Python ve Kivy ile Uygulama Geliştirme – 5

Categories python kivyPosted on
teknopenguen kivy uygulama

Bir dersimize daha hoş geldiniz arkadaşlar. Kivy derslerimizin bu bölümünde iki temel yerleşim düzeyini karşılaştırarak anlamaya çalışacağız. Bu yerleşim düzenlerimiz gridlayout ve boxlayout.

Hiç zaman kaybetmeden ilkinden başlayalım.

GridLayout

Gridlayout ızgara yerleşim şekli diyebiliriz. Yani satır ve sütunlar vardır ve elemanlarımız bu satır ve sütunlardan birine yerleşir isterseniz ne demek istediğimizi hemen bir örnekle anlatalım.

İki adet dosya oluşturuyoruz biri calisma.py diğeri ise calisma.kv. Calisma.py dosyamızı açalım ve içeriğini şu şekilde belirtelim.

 

  1. from kivy.app import App
  2.  
  3. from kivy.uix.gridlayout import GridLayout
  4.  
  5. from kivy.uix.button import Button
  6.  
  7. from kivy.lang import Builder
  8.  
  9. Builder.load_file("calisma.kv")
  10.  
  11. class yerlesim(BoxLayout):
  12.  
  13.     pass
  14.  
  15. class uygulama(App):
  16.  
  17.     def build(self):
  18.  
  19.         return yerlesim()
  20.  
  21. if __name__ == "__main__":
  22.  
  23.     uygulama().run()

gördüğünüz gibi görüntümüzü oluşturacak yerlesim sınıfı gridlayout sınıfını miras alıyor gelin şimdi bu dosyanın tasarımını yazalım. Calisma.kv dosyamızı açıyoruz ve içeriğini şu şekilde belirliyoruz.

  1. <yerlesim>:
  2.  
  3. 	cols: 3
  4.  
  5. 	padding: 10
  6. 	spacing: 5
  7.  
  8. 	Button:
  9. 		text: "1"
  10. 	Button:
  11. 		text: "2"
  12. 	Button:
  13. 		text: "3"
  14. 	Button:
  15. 		text: "4"
  16. 	Button:
  17. 		text: "5"
  18. 	Button:
  19. 		text: "6"
  20. 	Button:
  21. 		text: "7"
  22. 	Button:
  23. 		text: "8"
  24. 	Button:
  25. 		text: "9"

kv dosyamızda bu şekilde. Burada gördüğünüz gibi gridlayoutumuz 3 sütundan oluşuyor. Sırası ile yerleşime başlayacak.

1. buton  —> 1.satıra 1.sütuna

2.buton  —> 1.satıra 2.sütuna

3.buton  —> 1.satıra 3.sütuna

 

buradan sonra sütun kalmadığı için otomatik olarak 2.satıra atlayacak

 

4. buton  —> 2.satıra 1.sütuna

5.buton  —> 2.satıra 2.sütuna

6.buton  —> 2.satıra 3.sütuna

 

7. buton  —> 3.satıra 1.sütuna

8.buton  —> 3.satıra 2.sütuna

9.buton  —> 3.satıra 3.sütuna

yerleşimimiz bu şekilde olacak. İsterseniz karşılaştırma için uygulamamızın nasıl göründüğüne bakalım.

kivy uygulama görüntüsü

Eğer sizde de uygulama görüntüsü böyle ise doğru yaptınız demektir. Burada bahsetmemiz gereken bir diğer konu padding ve spacing. Padding uygulama çerçevesi ile layout arasındaki kullanılmayacak alandır. Çerçevenin etrafındaki siyah alanı görüyorsunuz. Orası 10 px lik padding alanımız. 

Spacing ise bütün butonlar arasındaki boşluklardır. Bu rakamlarla oynayarak ne demek istediğimizi daha kolay anlayabilirsiniz.

BoxLayout

Boxlayout yerleşimi şu şekildedir. Verilen elemanlar yatay veya dikey olarak boxlayout içine sırası ile yerleştirilir ne demek istediğimize hemen bakalım calisma.py dosyamızı açalım ve şu şekilde değiştirelim.

  1. from kivy.app import App
  2.  
  3. from kivy.uix.boxlayout import BoxLayout
  4.  
  5. from kivy.uix.button import Button
  6.  
  7. from kivy.lang import Builder
  8.  
  9. Builder.load_file("calisma.kv")
  10.  
  11. class yerlesim(BoxLayout):
  12.  
  13.     pass
  14.  
  15. class uygulama(App):
  16.  
  17.     def build(self):
  18.  
  19.         return yerlesim()
  20.  
  21. if __name__ == "__main__":
  22.  
  23.     uygulama().run()

buradaki farkın boxlayout olduğuna dikkat edin.

Şimdide calisma.kv dosyasını şu şekilde değiştirelim.

  1. <yerlesim>:
  2.  
  3. 	orientation: "vertical"
  4.  
  5. 	padding: 10
  6. 	spacing: 5
  7.  
  8. 	Button:
  9. 		text: "1"
  10. 	Button:
  11. 		text: "2"
  12. 	Button:
  13. 		text: "3"
  14. 	Button:
  15. 		text: "4"
  16. 	Button:
  17. 		text: "5"
  18. 	Button:
  19. 		text: "6"
  20. 	Button:
  21. 		text: "7"
  22. 	Button:
  23. 		text: "8"
  24. 	Button:
  25. 		text: "9"

butonlarımızın boxlayout içerisine yatay mı yoksa dikey mi yerleşeceğini orientation ifadesi ile belirliyoruz dikey için vertical yatay için horizontal kullanılır.

boxlayout yerleşimi de bu şekilde anlamadığınız ya da takıldığınız bir nokta varsa youtube kanalımızdan ders anlatım videomuzu izleyebilir, sitemize veya youtube’a yorum yaparak sorularınızı sorabilirsiniz.

Benzer Yazılar

avatar