SlideShare uma empresa Scribd logo
1 de 23
Kivy CatalogでKv Language
を知る
齋藤大輔
Outline
• Kvの説明
• Kivy Catalog とは
• レイアウトについて
• Float Layout
• Box Layout
• Another Layout
• Grid Layout
• Stack Layout
2
Kvとは何か?
3
Kv とは何か?
• 最低限インポートしておくもの
import kivy
from kivy.app import App
from kivy.uix.widget import Widget
4
Kvとは何か?
• Kvファイルの名前付けのルール
名前の規則から
MyApp -> my.kv
ファイル名を指定する
Builder.load_file('path/to/file.kv')
Kvを直接記述する
Builder.load_string(kv_string)
5
Kvとは何か?
from kivy.lang import Builder
w = Builder.load_string(''‘
Widget:
height: self.width / 2. if self.disabled else self.width
x: self.y + 50
''')
6
Kvとは何か?
7
Kivy Catalogとは?
• Kvを使ったレイアウトの例などを見ることが出来る
• インタラクティブに変更も可能
• すぐに更新される
• いろいろ試せる
8
Float Layout
9
Box Layout
10
Box Layout
• orientation
• ‘vertical’ or ‘horizontal’
• padding
• [padding_left, padding_top, padding_right, padding_bottom]
• [padding_horizontal, padding_vertical]
• default [0, 0, 0, 0]
• spacing
• ピクセル単位での子要素の間隔
11
Another Layout
12
Another Layout
• anchor_x
• 水平のアンカー位置
• anchor_y
• 垂直のアンカー位置
• padding
• [padding_left, padding_top, padding_right, padding_bottom]
• [padding_horizontal, padding_vertical]
• default [0, 0, 0, 0]
13
Grid Layout
14
Grid Layout
• cols
• グリッド内の列数
• padding
• [padding_left, padding_top, padding_right, padding_bottom]
• [padding_horizontal, padding_vertical]
• default [0, 0, 0, 0]
• rows
• グリッド内の行数
• spacing
• ピクセル単位での子要素の間隔
15
Stack Layout
16
Stack Layout
• orientation
• ‘lr-tb’, ‘tb-lr’, ‘rl-tb’, ‘tb-rl’, ‘lr-bt’, ‘bt-lr’, ‘rl-bt’ and ‘bt-rl’
• padding
• [padding_left, padding_top, padding_right, padding_bottom]
• [padding_horizontal, padding_vertical]
• default [0, 0, 0, 0]
• spacing
• ピクセル単位での子要素の間隔
17
TIPS
日本語の表示
日本語を扱う
• 基本は対応していない
• フォントを追加することにより表示可能
19
このように書く
# -*- coding: utf-8 -*-
import kivy
from kivy.core.text import LabelBase, DEFAULT_FONT
from kivy.app import App
from kivy.uix.button import Button
20
このように書く
LabelBase.register(DEFAULT_FONT, 'VL-Gothic-Regular.ttf')
class MyApp(App):
def build(self):
return Button(text='こんにちは', font_size=“50pt")
if __name__ == '__main__':
MyApp().run()
21
参考: http://blog.livedoor.jp/katsuooo_l/archives/42346599.html
表示できました
22
次回の予定
Kivyを使ったアプリケーション作成
• 8月末
• テキストエディタ?
• 電卓?
• タイマー?
• ・・・・
23

Mais conteúdo relacionado

Mais procurados

BITRISEを使っています
BITRISEを使っていますBITRISEを使っています
BITRISEを使っていますKazuaki KURIU
 
【AWS×Deployment】TechTalk #5
【AWS×Deployment】TechTalk #5【AWS×Deployment】TechTalk #5
【AWS×Deployment】TechTalk #5幸夫 茅根
 
グループ制作注意
グループ制作注意グループ制作注意
グループ制作注意MakotoItoh
 
GitBucketで社内OSSしませんか?
GitBucketで社内OSSしませんか?GitBucketで社内OSSしませんか?
GitBucketで社内OSSしませんか?Kiyotaka Kunihira
 
Wantedly - 世界一"いいね!"される 求人サイトの作り方
Wantedly - 世界一"いいね!"される 求人サイトの作り方Wantedly - 世界一"いいね!"される 求人サイトの作り方
Wantedly - 世界一"いいね!"される 求人サイトの作り方Yoshinori Kawasaki
 
技術選択とアーキテクトの役割
技術選択とアーキテクトの役割技術選択とアーキテクトの役割
技術選択とアーキテクトの役割Toru Yamaguchi
 
マジカルsvnとキュアgit
マジカルsvnとキュアgitマジカルsvnとキュアgit
マジカルsvnとキュアgitTakafumi ONAKA
 
Hands on PhotoBlog App with WordPress REST API and App Inventor
Hands on PhotoBlog App with WordPress REST API and App InventorHands on PhotoBlog App with WordPress REST API and App Inventor
Hands on PhotoBlog App with WordPress REST API and App InventorHong Chen
 
GitLabを骨までしゃぶりつくす@ゆるUniStudy#7
GitLabを骨までしゃぶりつくす@ゆるUniStudy#7GitLabを骨までしゃぶりつくす@ゆるUniStudy#7
GitLabを骨までしゃぶりつくす@ゆるUniStudy#7Wataru NOGUCHI
 
iOS対応のCIサービス「Bitrise」を使ってみた
iOS対応のCIサービス「Bitrise」を使ってみたiOS対応のCIサービス「Bitrise」を使ってみた
iOS対応のCIサービス「Bitrise」を使ってみたKosuke Ogawa
 
GitHubEnterpriseからBitbucket(Stash) への移行事例
GitHubEnterpriseからBitbucket(Stash) への移行事例GitHubEnterpriseからBitbucket(Stash) への移行事例
GitHubEnterpriseからBitbucket(Stash) への移行事例知教 本間
 
Confluence と DITA による Webマニュアル作成フロー
Confluence と DITA によるWebマニュアル作成フローConfluence と DITA によるWebマニュアル作成フロー
Confluence と DITA による Webマニュアル作成フローTakashi Yamaguchi
 
マイクロサービスにおける 非同期アーキテクチャ
マイクロサービスにおける非同期アーキテクチャマイクロサービスにおける非同期アーキテクチャ
マイクロサービスにおける 非同期アーキテクチャota42y
 
JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介
JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介
JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介kk_Ataka
 
Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017
Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017
Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017Kohei Saito
 
SIerでもSphinxを使いたい! 後編
SIerでもSphinxを使いたい! 後編SIerでもSphinxを使いたい! 後編
SIerでもSphinxを使いたい! 後編kk_Ataka
 
Sphinxで作る貢献しやすい ドキュメント翻訳の仕組み
Sphinxで作る貢献しやすいドキュメント翻訳の仕組みSphinxで作る貢献しやすいドキュメント翻訳の仕組み
Sphinxで作る貢献しやすい ドキュメント翻訳の仕組みTakayuki Shimizukawa
 
Front-end package managers
Front-end package managersFront-end package managers
Front-end package managersHayashi Yuichi
 
SIerでもSphinxを使いたい!総括
SIerでもSphinxを使いたい!総括SIerでもSphinxを使いたい!総括
SIerでもSphinxを使いたい!総括kk_Ataka
 
13_B_5 Who is a architect?
13_B_5 Who is a architect?13_B_5 Who is a architect?
13_B_5 Who is a architect?Atsushi Fukui
 

Mais procurados (20)

BITRISEを使っています
BITRISEを使っていますBITRISEを使っています
BITRISEを使っています
 
【AWS×Deployment】TechTalk #5
【AWS×Deployment】TechTalk #5【AWS×Deployment】TechTalk #5
【AWS×Deployment】TechTalk #5
 
グループ制作注意
グループ制作注意グループ制作注意
グループ制作注意
 
GitBucketで社内OSSしませんか?
GitBucketで社内OSSしませんか?GitBucketで社内OSSしませんか?
GitBucketで社内OSSしませんか?
 
Wantedly - 世界一"いいね!"される 求人サイトの作り方
Wantedly - 世界一"いいね!"される 求人サイトの作り方Wantedly - 世界一"いいね!"される 求人サイトの作り方
Wantedly - 世界一"いいね!"される 求人サイトの作り方
 
技術選択とアーキテクトの役割
技術選択とアーキテクトの役割技術選択とアーキテクトの役割
技術選択とアーキテクトの役割
 
マジカルsvnとキュアgit
マジカルsvnとキュアgitマジカルsvnとキュアgit
マジカルsvnとキュアgit
 
Hands on PhotoBlog App with WordPress REST API and App Inventor
Hands on PhotoBlog App with WordPress REST API and App InventorHands on PhotoBlog App with WordPress REST API and App Inventor
Hands on PhotoBlog App with WordPress REST API and App Inventor
 
GitLabを骨までしゃぶりつくす@ゆるUniStudy#7
GitLabを骨までしゃぶりつくす@ゆるUniStudy#7GitLabを骨までしゃぶりつくす@ゆるUniStudy#7
GitLabを骨までしゃぶりつくす@ゆるUniStudy#7
 
iOS対応のCIサービス「Bitrise」を使ってみた
iOS対応のCIサービス「Bitrise」を使ってみたiOS対応のCIサービス「Bitrise」を使ってみた
iOS対応のCIサービス「Bitrise」を使ってみた
 
GitHubEnterpriseからBitbucket(Stash) への移行事例
GitHubEnterpriseからBitbucket(Stash) への移行事例GitHubEnterpriseからBitbucket(Stash) への移行事例
GitHubEnterpriseからBitbucket(Stash) への移行事例
 
Confluence と DITA による Webマニュアル作成フロー
Confluence と DITA によるWebマニュアル作成フローConfluence と DITA によるWebマニュアル作成フロー
Confluence と DITA による Webマニュアル作成フロー
 
マイクロサービスにおける 非同期アーキテクチャ
マイクロサービスにおける非同期アーキテクチャマイクロサービスにおける非同期アーキテクチャ
マイクロサービスにおける 非同期アーキテクチャ
 
JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介
JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介
JUS関西 Sphinxワークショップ@関西 Sphinx事例紹介
 
Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017
Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017
Dockerで始める Java EE アプリケーション開発 for JJUG CCC 2017
 
SIerでもSphinxを使いたい! 後編
SIerでもSphinxを使いたい! 後編SIerでもSphinxを使いたい! 後編
SIerでもSphinxを使いたい! 後編
 
Sphinxで作る貢献しやすい ドキュメント翻訳の仕組み
Sphinxで作る貢献しやすいドキュメント翻訳の仕組みSphinxで作る貢献しやすいドキュメント翻訳の仕組み
Sphinxで作る貢献しやすい ドキュメント翻訳の仕組み
 
Front-end package managers
Front-end package managersFront-end package managers
Front-end package managers
 
SIerでもSphinxを使いたい!総括
SIerでもSphinxを使いたい!総括SIerでもSphinxを使いたい!総括
SIerでもSphinxを使いたい!総括
 
13_B_5 Who is a architect?
13_B_5 Who is a architect?13_B_5 Who is a architect?
13_B_5 Who is a architect?
 

Kivy CatalogでKv Languageを知る

Notas do Editor

  1. KivyのKVについて図を見ながら口頭で説明する およそ5分
  2. KivyのKVについて図を見ながら口頭で説明する およそ5分
  3. フロートレイアウトを使ってボタンの文字やサイズヒントなどを変更してみる 参加者にも変更をしてもらう 5分から10分
  4. ボックスレイアウトについて説明 次ページで使える要素も説明する 10分
  5. 要素について説明 いろいろ変更してみる (これ以降全レイアウトについても同じ)
  6. lr-tb