{"id":3752,"date":"2018-06-09T11:25:01","date_gmt":"2018-06-09T02:25:01","guid":{"rendered":"https:\/\/www.ws-meguro.com\/\/?p=3752"},"modified":"2018-06-09T13:07:21","modified_gmt":"2018-06-09T04:07:21","slug":"youtube%e3%81%a7derek%e3%81%95%e3%82%93%e3%81%ab%e3%82%88%e3%82%8bkivy-tutorial%e3%82%92%e5%ad%a6%e3%81%b6%e2%91%a1%ef%bc%88kivy-uix-floatlayout%ef%bc%89","status":"publish","type":"post","link":"https:\/\/www.wsmeguro.jp\/wp\/?p=3752","title":{"rendered":"YouTube\u3067Derek\u3055\u3093\u306b\u3088\u308bKivy Tutorial\u3092\u5b66\u3076\u2461\uff08kivy.uix.floatlayout\u3068kivy.uix.floatlayout\uff09"},"content":{"rendered":"<p>\u5f15\u304d\u7d9a\u304d\u3001\uff12\u56de\u76ee\u3001kivy.uix.floatlayout\u3068kivy.uix.floatlayout\u306b\u3064\u3044\u3066\u3068\u306a\u308a\u307e\u3059\u3002<br \/>\n<div class=\"lyte-wrapper fourthree\" title=\"Kivy Tutorial 2\" style=\"width:480px;max-width:100%;margin:5px;\"><div class=\"lyMe\" id=\"WYL_j9PqNe3J_Cc\" itemprop=\"video\" itemscope itemtype=\"https:\/\/schema.org\/VideoObject\"><div><meta itemprop=\"thumbnailUrl\" content=\"https:\/\/i.ytimg.com\/vi\/j9PqNe3J_Cc\/hqdefault.jpg\" \/><meta itemprop=\"embedURL\" content=\"https:\/\/www.youtube.com\/embed\/j9PqNe3J_Cc\" \/><meta itemprop=\"duration\" content=\"PT20M40S\" \/><meta itemprop=\"uploadDate\" content=\"2016-10-08T11:31:52.000Z\" \/><\/div><div id=\"lyte_j9PqNe3J_Cc\" data-src=\"https:\/\/i.ytimg.com\/vi\/j9PqNe3J_Cc\/hqdefault.jpg\" class=\"pL\"><div class=\"tC\"><div class=\"tT\" itemprop=\"name\">Kivy Tutorial 2<\/div><\/div><div class=\"play\"><\/div><div class=\"ctrl\"><div class=\"Lctrl\"><\/div><div class=\"Rctrl\"><\/div><\/div><\/div><noscript><a href=\"https:\/\/youtu.be\/j9PqNe3J_Cc\" rel=\"nofollow\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i.ytimg.com\/vi\/j9PqNe3J_Cc\/0.jpg\" alt=\"Kivy Tutorial 2\" width=\"480\" height=\"340\" \/><br \/>\u3053\u306e\u52d5\u753b\u3092 YouTube \u3067\u8996\u8074<\/a><\/noscript><meta itemprop=\"description\" content=\"Code &amp; Transcript : https:\/\/goo.gl\/iBjKjm Best Kivy Book : http:\/\/amzn.to\/2duPAFD Support me on Patreon : https:\/\/www.patreon.com\/derekbanas In part 2 of my Kivy tutorial series we&#039;ll explore much of what we need to know before we start making apps in the next video. We&#039;ll cover creating custom widgets, setting default attributes, and 6 layouts being : Absolute Positioning, Floating Layout, Grid Layout, Box Layout, Stack Layout, and Page Layout. If you missed any of the previous Python videos, the series starts here : https:\/\/www.youtube.com\/playlist?list=PLGLfVvz_LVvTn3cK5e6LjhgGiSeVlIRwt Thank you to Patreon supports like the following for helping me make this video https:\/\/www.facebook.com\/cottageindustriesbuild\/ @kyleaisho @thetwistedhat vjFaLk\"><\/div><\/div><div class=\"lL\" style=\"max-width:100%;width:480px;margin:5px;\"><\/div><br \/>\n\u3068\u3044\u3046\u3053\u3068\u3067\u3001Window\u30b5\u30a4\u30ba\u306e\uff1f\uff05\u3068\u3044\u3046\u6307\u5b9a\u306efloatlayout\u3092\u4f7f\u3063\u3066\u898b\u307e\u3057\u3087\u3046\u3002<br \/>\n\u753b\u9762\u306f\u3053\u3046\u306a\u308a\u307e\u3059\u3002<br \/>\n<a href=\"https:\/\/www.wsmeguro.jp\/\/wp\/wp-content\/uploads\/2018\/06\/134e4c6bd6e5112ba89dd94b631ef4cf.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3754\" src=\"https:\/\/www.wsmeguro.jp\/\/wp\/wp-content\/uploads\/2018\/06\/134e4c6bd6e5112ba89dd94b631ef4cf.png\" alt=\"\" width=\"800\" height=\"621\" srcset=\"https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/134e4c6bd6e5112ba89dd94b631ef4cf.png 800w, https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/134e4c6bd6e5112ba89dd94b631ef4cf-300x233.png 300w, https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/134e4c6bd6e5112ba89dd94b631ef4cf-768x596.png 768w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><br \/>\n<!--more--><br \/>\n\u3067\u306f\u3001\u30b3\u30fc\u30c9\u306f\u3069\u3046\u306a\u3063\u3066\u3044\u308b\u304b\u3068\u3044\u3046\u3068\u3001main.py\u306f\u3053\u3061\u3089<\/p>\n<pre class=\"lang:python decode:true \"># main.py\r\n# -*- coding: utf-8 -*-\r\n\r\nimport kivy\r\nkivy.require(\"1.9.1\")\r\n\r\nfrom kivy.app import App\r\nfrom kivy.core.text import LabelBase, DEFAULT_FONT\r\nfrom kivy.resources import resource_add_path\r\nfrom kivy.uix.floatlayout import FloatLayout\r\n\r\nresource_add_path('..\/fonts')\r\n# \u30d9\u30fc\u30b9\u30d5\u30a9\u30f3\u30c8\u3092\u5909\u66f4\u3059\u308b\r\nLabelBase.register(DEFAULT_FONT, 'komorebi-gothic.ttf')\r\n\r\nclass FloatingApp(App):\r\n    def build(self):\r\n        return FloatLayout()\r\n\r\nif __name__ == \"__main__\":\r\n    FloatingApp().run()<\/pre>\n<p>floating.kv\u306f\u3001\u3053\u3061\u3089<\/p>\n<pre class=\"lang:python decode:true \"># floating.kv\r\n\r\n# size_hint defines the widget width (0-1) representing\r\n# a percentage of 100% and height of the window\r\n# size_hint\u306f\u3001\u30dc\u30bf\u30f3\u306a\u3069\u306ewidget\u306e\u30b5\u30a4\u30ba\u3092Window\u306e\u30b5\u30a4\u30ba\u306e\u4f55\uff05\u3068\u3044\u3046\u6307\u5b9a\u3092\u884c\u306a\u3063\u3066\u3044\u308b\u3002\r\n# \u304c\u3001\u5b9f\u969b\u306f\uff05\u3067\u306f\u306a\u304f0\u22121\u306e\u7bc4\u56f2\u3067\u6307\u5b9a\r\n&lt;CustButton@Button&gt;:\r\n    font_size: 32\r\n    color: 0, 0, 0, 1\r\n    size: 150, 50\r\n    background_normal: ''\r\n    background_down: 'red.png'\r\n    background_color: .88, .88, .88, 1\r\n    size_hint: .4, .3\r\n \r\n# pos_hint represents the position using either x, y, left,\r\n# right, top, bottom, center_x, or center_y\r\n# pos_hint\u306f\u3001widget\u306e\u3069\u3053\u3092window\u306e\u3069\u3053\uff080\u22121\uff09\u306b\u7f6e\u304f\u306e\u304b\u3092\u6307\u5b9a\u3057\u3066\u3044\u308b\u3002\r\n# x\u3001y\u306f\u3001\u5ea7\u6a19\u4e0a\u306e\u4f4d\u7f6e\r\n# right\uff08\u53f3\u7aef\uff09,left\uff08\u5de6\u7aef\uff09,top\uff08\u4e0a\u7aef\uff09\u3001bottom\uff08\u4e0b\u7aef\uff09\u3067\u6307\u5b9a\u3059\u308b\u65b9\u6cd5\r\n# center_x\uff08\u5de6\u53f3\u306e\u4e2d\u5fc3\uff09,center_y\uff08\u4e0a\u4e0b\u306e\u4e2d\u5fc3\uff09\u3067\u6307\u5b9a\u3059\u308b\u65b9\u6cd5\r\n\r\n&lt;FloatLayout&gt;:\r\n    CustButton:\r\n        text: \"Top Left\"\r\n        pos_hint: {\"x\": 0, \"top\": 1}\r\n    CustButton:\r\n        text: \"Bottom Right\"\r\n        pos_hint: {\"right\": 1, \"y\": 0}\r\n    CustButton:\r\n        text: \"Top Right\"\r\n        pos_hint: {\"right\": 1, \"top\": 1}\r\n    CustButton:\r\n        text: \"Bottom Left\"\r\n        pos_hint: {\"left\": 1, \"bottom\": 0}\r\n    CustButton:\r\n        text: \"Center\"\r\n        pos_hint: {\"center_x\": .5, \"center_y\": .5}<\/pre>\n<p>\u305d\u3046\u3059\u308b\u3068\u3001\u753b\u9762\u306e\u30b5\u30a4\u30ba\u3092\u5909\u3048\u3066\u3082\u3053\u3093\u306a\u611f\u3058\u3067\u81ea\u52d5\u7684\u306b\u4fee\u6b63\u3055\u308c\u307e\u3059\u3002<br \/>\n<a href=\"https:\/\/www.wsmeguro.jp\/\/wp\/wp-content\/uploads\/2018\/06\/6fc356a20fe6bcb21f9094458bcef5d0.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3755\" src=\"https:\/\/www.wsmeguro.jp\/\/wp\/wp-content\/uploads\/2018\/06\/6fc356a20fe6bcb21f9094458bcef5d0.png\" alt=\"\" width=\"554\" height=\"323\" srcset=\"https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/6fc356a20fe6bcb21f9094458bcef5d0.png 554w, https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/6fc356a20fe6bcb21f9094458bcef5d0-300x175.png 300w\" sizes=\"auto, (max-width: 554px) 100vw, 554px\" \/><\/a><br \/>\n\u30dd\u30a4\u30f3\u30c8\u306f\u3001\uff12\u3064\u3002size_hint\u3068pos_hint\u3067\u3059\u3002<\/p>\n<ul>\nsize_hint\u306f\u3001\u30dc\u30bf\u30f3\u306a\u3069\u306ewidget\u306e\u30b5\u30a4\u30ba\u3092Window\u306e\u30b5\u30a4\u30ba\u306e\u4f55\uff05\u3068\u3044\u3046\u6307\u5b9a\u3092\u884c\u306a\u3063\u3066\u3044\u308b\u3002\u306a\u304a\u3001\u5b9f\u969b\u306f\uff05\u3067\u306f\u306a\u304f0\u22121\u306e\u7bc4\u56f2\u3067\u6307\u5b9a<\/ul>\n<ul>\npos_hint\u306f\u3001widget\u306e\u3069\u3053\u3092window\u306e\u3069\u3053\uff080\u22121\uff09\u306b\u7f6e\u304f\u306e\u304b\u3092\u6307\u5b9a\u3057\u3066\u3044\u308b\u3002x\u3001y\u306f\u3001\u5ea7\u6a19\u4e0a\u306e\u4f4d\u7f6e\u3001right\uff08\u53f3\u7aef\uff09,left\uff08\u5de6\u7aef\uff09,top\uff08\u4e0a\u7aef\uff09\u3001bottom\uff08\u4e0b\u7aef\uff09\u3067\u6307\u5b9a\u3059\u308b\u65b9\u6cd5\u3001center_x\uff08\u5de6\u53f3\u306e\u4e2d\u5fc3\uff09,center_y\uff08\u4e0a\u4e0b\u306e\u4e2d\u5fc3\uff09\u3067\u6307\u5b9a\u3059\u308b\u65b9\u6cd5\u3068\u306a\u3063\u3066\u3044\u307e\u3059\u3002<\/ul>\n<p>\u7d9a\u3044\u3066\u3001GridLayout\u3067\u3059\u3002\u3053\u308c\u306f\u8868\u5f62\u5f0f\u306a\u306e\u3067\u3001wxPython\u307f\u305f\u3044\u306a\u611f\u3058\u3067\u3059\u3002<br \/>\n\u4e0b\u306e\u4f8b\u3067\u306f\u3001kivy.require(&#8220;1.9.1&#8221;)\u3068\u3001\u30d0\u30fc\u30b8\u30e7\u30f3\u3092\u4e0b\u3052\u3066\u6307\u5b9a\u3057\u3066\u3044\u307e\u3059\u304c\u52d5\u304d\u307e\u3059\u3002\u3053\u3053\u306f\u3001\u6700\u4f4e\u9650\u5fc5\u8981\u3068\u3055\u308c\u308b\u30d0\u30fc\u30b8\u30e7\u30f3\u306e\u6307\u5b9a\u3068\u3044\u3046\u3053\u3068\u3067\u3059\u3002<\/p>\n<pre class=\"lang:python decode:true \" ># main.py\r\n# -*- coding: utf-8 -*-\r\n\r\nimport kivy\r\nkivy.require(\"1.9.1\")\r\n\r\nfrom kivy.app import App\r\nfrom kivy.core.text import LabelBase, DEFAULT_FONT\r\nfrom kivy.resources import resource_add_path\r\nfrom kivy.uix.floatlayout import FloatLayout\r\nfrom kivy.uix.gridlayout import GridLayout\r\n\r\nresource_add_path('..\/fonts')\r\n# \u30d9\u30fc\u30b9\u30d5\u30a9\u30f3\u30c8\u3092\u5909\u66f4\u3059\u308b\r\nLabelBase.register(DEFAULT_FONT, 'komorebi-gothic.ttf')\r\n\r\nclass GridApp(App):\r\n    def build(self):\r\n        return GridLayout()\r\n\r\nif __name__ == \"__main__\":\r\n    GridApp().run()<\/pre>\n<p>\u7d9a\u3044\u3066\u3001grid.kv\u3067\u3059\u3002<br \/>\n&lt;GridLayout&gt;:\u306e\u3068\u3053\u308d\u3067\u3001Grid\u306e\u884c\u3084\u5217\u306e\u6570\u3001\u9699\u9593\u306e\u6307\u5b9a\u3092\u884c\u306a\u3063\u3066\u3044\u307e\u3059\u3002<br \/>\n\u8868\u306e\u4e2d\u306b\u57cb\u3081\u8fbc\u3080\u30dc\u30bf\u30f3\u3092\u305d\u308c\u305e\u308c\u6307\u5b9a\u3057\u3066\u3044\u307e\u3059\u3002size_hint\u3092\u4f7f\u308f\u306a\u3044\u5834\u5408\u306fNone\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n<pre class=\"lang:python decode:true \" ># grid.kv\r\n\r\n# Define the number of columns and rows\r\n# Define the spacing between children in pixels\r\n# \u8868\u5f62\u5f0f\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u306a\u306e\u3067\u3001\u884c\u306e\u6570\u3001\u5217\u306e\u6570\u3092\u305d\u308c\u305e\u308c\u3057\u3066\u3044\u307e\u3059\u3002\r\n# Spacing\u3067\u8868\u306e\u4e2d\u306e\u7bb1\u306e\u9699\u9593\uff08\u30b9\u30da\u30fc\u30b9\uff09\u306e\u6307\u5b9a\u3001padding\u3067\u3001Window\u3068\u8868\u306e\u9593\u306e\u9699\u9593\u306e\u6307\u5b9a\u3082\u3067\u304d\u307e\u3059\u3002\r\n\r\n&lt;GridLayout&gt;:\r\n    cols: 2\r\n    rows: 2\r\n    spacing: 5\r\n    padding: 15\r\n \r\n    # Set the size by passing None to size_hint_x\r\n    # and then pass the width\r\n    # size_hint(window\u306e\uff1f%\u6307\u5b9a)\u3092\u4f7f\u308f\u306a\u3044\u5834\u5408\u306f\u3001size_hint_x: None\u3068\u3057\u307e\u3059\u3002\r\n    # \u4f55\u3082\u6307\u5b9a\u3057\u306a\u3044\u3068\u4e0a\u4e0b\u5de6\u53f3\u5747\u7b49\u306b\u5272\u308a\u632f\u3089\u308c\u307e\u3059\u3002\r\n\r\n    Button:\r\n        font_size: 32\r\n        text: \"1st\"\r\n        size_hint_x: None\r\n        width: 200\r\n    Button:\r\n        font_size: 24\r\n        text: \"2nd\"\r\n    Button:\r\n        font_size: 28\r\n        text: \"3rd\"\r\n        size_hint_x: None\r\n        width: 200\r\n    Button:\r\n        font_size: 16\r\n        text: \"4th\"<\/pre>\n<p>\u305d\u3057\u3066\u753b\u9762\u306f\u3001\u3053\u3061\u3089\u306b\u306a\u308a\u307e\u3059\u3002<br \/>\n<a href=\"https:\/\/www.wsmeguro.jp\/\/wp\/wp-content\/uploads\/2018\/06\/e7c2e6f36cd6f323d19bcbeb9382abf4.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.wsmeguro.jp\/\/wp\/wp-content\/uploads\/2018\/06\/e7c2e6f36cd6f323d19bcbeb9382abf4.png\" alt=\"\" width=\"803\" height=\"621\" class=\"aligncenter size-full wp-image-3759\" srcset=\"https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/e7c2e6f36cd6f323d19bcbeb9382abf4.png 803w, https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/e7c2e6f36cd6f323d19bcbeb9382abf4-300x232.png 300w, https:\/\/www.wsmeguro.jp\/wp\/wp-content\/uploads\/2018\/06\/e7c2e6f36cd6f323d19bcbeb9382abf4-768x594.png 768w\" sizes=\"auto, (max-width: 803px) 100vw, 803px\" \/><\/a><br \/>\n\u7d9a\u304f<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u5f15\u304d\u7d9a\u304d\u3001\uff12\u56de\u76ee\u3001kivy.uix.floatlayout\u3068kivy.uix.floatlayout\u306b\u3064\u3044\u3066\u3068\u306a\u308a\u307e\u3059\u3002 Kivy Tutorial 2\u3053\u306e\u52d5\u753b\u3092 YouTube \u3067\u8996\u8074 \u3068\u3044\u3046\u3053\u3068\u3067\u3001Window\u30b5\u30a4\u30ba&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"footnotes":""},"categories":[526,508],"tags":[563,527,513],"class_list":["post-3752","post","type-post","status-publish","format-standard","hentry","category-python","category-508","tag-kivy","tag-python","tag-513"],"_links":{"self":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts\/3752","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3752"}],"version-history":[{"count":7,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts\/3752\/revisions"}],"predecessor-version":[{"id":3764,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=\/wp\/v2\/posts\/3752\/revisions\/3764"}],"wp:attachment":[{"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3752"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3752"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wsmeguro.jp\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3752"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}