How to colspan in kivy with python

Question

How can I make this layout in kivy without .kv file?

Basically all i want to do is to fit Button2 and button3 in tha same column

from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.textinput import TextInput


class TestApp(App):
def build(self):
    root = FloatLayout()
    layout = BoxLayout(orientation='vertical')
    button1 = TextInput(size_hint=(1,.7))
    button2 = TextInput(size_hint=(1,.2))
    button3 = Button(text='Send',size_hint=(1, .1))
    layout.add_widget(button1)
    layout.add_widget(button2)
    layout.add_widget(button3)
    root.add_widget(layout)
    return root

 TestApp().run()

Asked By: Kyriakos Anemos

||

Source

Answer 1

Add Button2 and Button3 to a different BoxLayout and then add this BoxLayout as a child of layout.
So something like this inside your build method:

root = FloatLayout()
layout = BoxLayout(orientation='vertical')
layout1 = BoxLayout()
button1 = TextInput()
button2 = TextInput()
button3 = Button()
layout.add_widget(button1)
layout1.add_widget(button2)
layout1.add_widget(button3)
layout.add_widget(layout1)
root.add_widget(layout)

I’m assuming this is the behaviour you expect to get:

Answered By: illright

Answer 2

To build what is in the image you’ve got 4 buttons and two box layouts, one nested inside the other. You shouldn’t need size hints because the heights of the 2 rows are the same and the width of the bottom 3 buttons are the same. There is no need for a float layout in the above image.

class TestApp(App):
def build(self):
    # layout for the outer box layout to handle the rows
    layout = BoxLayout(orientation='vertical')
    # layout for the inner box layout, which is the bottom 3 columns
    bottom_row = BoxLayout(size_hint_y=0.6)  # Defaults to horizontal orientation

    # Make the buttons
    button1 = TextInput()    
    button2 = TextInput()
    button3 = Button()
    button4 = Button()

    # Add the first button and then bottom row to the layout. Add the bottom 3 buttons to the bottom_row box layout.
    layout.add_widget(button1)
    bottom_row.add_widget(button2)
    bottom_row.add_widget(button3)
    bottom_row.add_widget(button4)
    layout.add_widget(bottom_row)

return layout

Answered By: Paul Brown

Answer 3

Try with this, the concept is similar to Paul, I create first a general block, and add small components, in this case the main is Box Layout. I add a input text and later the buttons

from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.gridlayout import GridLayout
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.textinput import TextInput



class TestApp(App):
    def build(self):
        layout = BoxLayout(orientation='vertical')
        # layout for the inner box layout, which is the bottom 3 columns
        bottom_row = GridLayout(size_hint_y=1, cols=5)  # Defaults to horizontal orientation

        # Make the buttons
        button1 = TextInput()    

        # Add the first button and then bottom row to the layout. Add the bottom 3 buttons to the bottom_row box layout.
        layout.add_widget(button1)
        for i in range(10):
            bottom_row.add_widget(Button(text=str(i)))

        layout.add_widget(bottom_row)

        return layout

TestApp().run()

Answered By: José Daniel Sarmiento

How to colspan in kivy with python

Question:

Answers: