Chapter 1 : GUI Basics – Building an Interface

Hello World!

Code Python

 
   import kivy
   kivy.require('1.7.0')
   from kivy.app import App
   from kivy.uix.button import Label
   class HelloApp(App):
       def build(self):
           return Label(text = 'Hello World!')
   if __name__=="__main__":
       HelloApp().run()
     

ผลลัพธ์ที่ได้...

Hello World! เเบบที่ 2

Code Python

 
      from kivy.app import App
   from kivy.uix.button import Label
   class Hello2App(App):
       def build(self):
           return Label()
   if __name__=="__main__":
       Hello2App().run()
   

File name : hello2.kv

 
     <Label>:
      text: 'Hello World!'
   

ผลลัพธ์ที่ได้...

Layouts

Code Python

 
      from kivy.app import App
   from kivy.uix.floatlayout import FloatLayout
   class FloatLayoutApp(App):
       def build(self):
            return FloatLayout()
   if __name__=="__main__":
       FloatLayoutApp().run()
   

File name : floatlayout.kv

 
   <Button>:
      color: .8,.9,0,1
      font_size: 32
      size_hint: .4, .3
   <FloatLayout>:
     Button:
       text: 'Hello'
       pos_hint: {'x': 0, 'top': 1}
     Button:
       text: 'World!'
       pos_hint: {'right': 1, 'y': 0}
   

ผลลัพธ์ที่ได้...

Embedding layouts

Code Python

 
      from kivy.app import App
   from kivy.uix.gridlayout import GridLayout
   class MyGridLayout(GridLayout):
       pass
   class LayoutsApp(App):
       def build(self):
           return MyGridLayout()
   if __name__=="__main__":
       LayoutsApp().run()
   

File name : layouts.kv

 
  <MyGridLayout>:
  rows: 2
  FloatLayout:
    Button:
      text: 'F1'
      size_hint: .3, .3
      pos: 0, 0
  RelativeLayout:
    Button:
      text: 'R1'
      size_hint: .3, .3
      pos: 0, 0
  GridLayout:
    cols: 2
    spacing: 10
    Button:
      text: 'G1'
      size_hint_x: None
      width: 50
    Button:
      text: 'G2'
    Button:
      text: 'G3'
      size_hint_x: None
      width: 50
  AnchorLayout:
    anchor_x: 'right'
    anchor_y: 'top'
    Button:
      text: 'A1'
      size_hint: [.5, .5]
    Button:
      text: 'A2'
      size_hint: [.2, .2]
  BoxLayout:
    orientation: 'horizontal'
    Button:
      text: 'B1'
    Button:
      text: 'B2'
      size_hint: [2, .3]
      pos_hint: {'y': .4}
    Button:
      text: 'B3'
  StackLayout:
    orientation: 'rl-tb'
    padding: 10
    Button:
      text: 'S1'
      size_hint: [.6, .2]
    Button:
      text: 'S2'
      size_hint: [.4, .4]
    Button:
      text: 'S3'
      size_hint: [.3, .2]
    Button:
      text: 'S4'
      size_hint: [.4, .3]
   

ผลลัพธ์ที่ได้...