किवी लेआउट चयन समस्या

Question

मैं अपने रोबोट प्रोजेक्ट के लिए Kivy UI बनाने जा रहा हूं, मेरी एकमात्र समस्या लेआउट के साथ काम कर रही है, मैं इसमें उलझन में हूं।

मैं GUI छवि संलग्न करूंगा कि मैं Kivy में इसके लिए लेआउट बनाना चाहता हूं कृपया सर्वोत्तम विकल्प (बॉक्स, ग्रिड, सापेक्ष, ..) का मार्गदर्शन करें, मुझे पता है कि मुझे उन्हें मिश्रण करना होगा और 2 या अधिक लेआउट का एक साथ उपयोग करना होगा लेकिन मैं सही ढंग से चयन नहीं कर सकता, मैंने Kivy दस्तावेज पढ़ा और मैंने Kivy डिजाइनर का उपयोग करने की कोशिश की लेकिन फिर भी मैं सर्वश्रेष्ठ लेआउट का चयन नहीं कर सका। अधिकतम विंडो आकार 800x600 है।

Answer 1

मैं SimpleTableLayout पसंद करेंगे, यह Kivy गार्डन में एक विजेट उपलब्ध है: Simple Table Laout - Kivy Garden

आप यहाँ Kivy-गार्डन का उपयोग कैसे करें स्थापना के निर्देश हैं पता नहीं है: How to install kivy garden

SimpleTableLayout पंक्ति और कॉलम स्पैनिंग के साथ-साथ एक निश्चित सेल का विजेट प्राप्त करने का समर्थन करता है: SimpleTableLayout.cell(row, col)

आपके ऐप के लिए एक छोटा सा उदाहरण:

<SimpleTableLayout>: 
    rows:10 
    cols:14 

    <Gauge1>: 
     rowspan:2 
     colspan:2 

    <SpaceHolderWidget>: 
     rowspan:12 

    <SpaceHolderWidget>: 
     colspan: 2 

    <SmallGauge1>: 

    <SpaceHolderWidget>: 

    <SmallGauge2>: 

    <SpaceHolderWidget>: 
     colspan:2 

    <SpaceHolderWidget>: 
     rowspan:12 

    <Gauge2>: 
     rowspan:2 
     colspan:2 

    <Canvas>: 
     rowspan:5 
     colspan:7 

Answer 2

आप जो लेआउट का उपयोग करने को नहीं जानते हैं, तो, ग्रिड लेआउट का उपयोग, क्योंकि यह सबसे बहुमुखी है।

सामान्य रूप से, यदि आप एक पंक्ति में एन विजेट डालना चाहते हैं, तो rows: 1 सेट करें। यदि आप कॉलम में एन विजेट डालना चाहते हैं, तो cols: 1 सेट करें।

फिर, विजेट के सही आकार को सेट करने के लिए size_hint का उपयोग करें।

आप विगेट्स के बीच रिक्त स्थान बनाने के लिए रिक्त लेबल का उपयोग कर सकते हैं।

किवी डिजाइनर के बारे में - पहले इस उपकरण का उपयोग करने से पहले सेटिंग UI को मैन्युअल रूप से सीखना बेहतर होता है।

#:kivy 1.9.0 

<RoundGauge@Button>: 
    text: 'gauge' 

<SidePanel@GridLayout>: 
    cols: 1 
    size_hint_x: .2 

    RoundGauge: 
     size_hint_y: .5 
    RoundGauge: 
     size_hint_y: .5 

    GridLayout: 
     rows: 1 

     Slider: 
      orientation: 'vertical' 
     Slider: 
      orientation: 'vertical' 

# main layout divided into bottom gauges and screen part 
GridLayout: 
    cols: 1 

    canvas: 
     Color: 
      rgba: 1,1,1,.5 
     Rectangle: 
      size: self.size 

    # both side panels and screen part 
    GridLayout: 
     rows: 1 

     # left panel 
     SidePanel: 

     # middle panel 
     GridLayout: 
      cols: 1 

      # upper gauges 
      GridLayout: 
       rows: 1 
       size_hint_y: .3 

       Label: 
       RoundGauge: 
        size_hint_x: .5 
       Label: 
        size_hint_x: .1 
       RoundGauge: 
        size_hint_x: .5 
       Label: 

      Label: 
       text: 'screen' 
       canvas: 
        Color: 
         rgba: 1,1,1,.5 
        Rectangle: 
         size: self.size 
         pos: self.pos 

      # bottom gauges 
      GridLayout: 
       rows: 1 
       size_hint_y: .3 

       RoundGauge: 
       RoundGauge: 
       RoundGauge: 
       RoundGauge: 
       RoundGauge: 
       RoundGauge: 

     # right panel 
     SidePanel: 

    GridLayout: 
     rows: 1 
     size_hint_y: .2 

     RoundGauge: 
     RoundGauge: 
     RoundGauge: 
     RoundGauge: 
     RoundGauge: 
     RoundGauge: 
     RoundGauge: