”;
Kivy framework provides BoxLayout class with which we can arrange the widgets sequentially. The sequence is determined by the orientation property of BoxLayout object and can be a string: either ”vertical” or ”horizontal”.
The BoxLayout class is defined in the “kivy.uix.boxlayout” module. To declare a BoxLayout object, use.
from kivy.uix.boxlayout import BoxLayout blo = BoxLayout(**kwargs)
Properties
-
orientation − Orientation of the layout. orientation is an OptionProperty and defaults to ”horizontal”. Can be ”vertical” or ”horizontal”.
-
padding − Padding between layout box and children: [padding_left, padding_top, padding_right, padding_bottom]. padding also accepts a two argument form [padding_horizontal, padding_vertical] and a one
argument form [padding]. -
minimum_height − Automatically computed minimum height needed to contain all children. The minimum_height is a NumericProperty and defaults to 0. It is read only.
-
minimum_size − Automatically computed minimum size needed to contain all children.minimum_size is a ReferenceListProperty of (minimum_width, minimum_height) properties. It is read only.
-
minimum_width − Automatically computed minimum width needed to contain all children. minimum_width is a NumericProperty and defaults to 0. It is read only.
The BoxLayout class also inherits the add_widget() and remove_widget() methods, which we have already discussed earlier.
Vertical BoxLayout
Typical use of BoxLayout is shown here. We add a label, a text input and a button in a vertical box layout.
Example
from kivy.app import App from kivy.uix.label import Label from kivy.uix.button import Button from kivy.uix.textinput import TextInput from kivy.uix.boxlayout import BoxLayout from kivy.core.window import Window Window.size = (720,200) class DemoApp(App): def build(self): lo = BoxLayout(orientation = ''vertical'') self.l1 = Label(text=''Enter your name'', font_size=20) self.t1 = TextInput(font_size = 30) self.b1 = Button(text = ''Submit'', size_hint = (None, None),pos_hint={''x'':.4, ''y'':.2}, size = (200,75)) lo.add_widget(self.l1) lo.add_widget(self.t1) lo.add_widget(self.b1) return lo if __name__ == ''__main__'': DemoApp().run()
Output
It will produce the following output −
You can use the following “Demo.kv” file to construct the above GUI −
BoxLayout: orientation : ''vertical'' Label: id : l1 text : ''Enter your name'' font_size : ''20pt'' TextInput: id : t1 font_size : 30 Button: id : b1 text : ''Submit'' size_hint : (None, None) pos_hint : {''x'':.4, ''y'':.2} size : (200,75)
Horizontal BoxLayout
In the following program, we have placed a label, a text input box and a button in Box layout with horizontal orientation.
Example
from kivy.app import App from kivy.uix.label import Label from kivy.uix.button import Button from kivy.uix.textinput import TextInput from kivy.uix.boxlayout import BoxLayout from kivy.clock import Clock from kivy.core.window import Window Window.size = (720,200) class DemoApp(App): def build(self): self.lo = BoxLayout(orientation = ''horizontal'') self.l1 = Label(text=''Enter your name'', font_size=20) self.t1 = TextInput(font_size = 30, pos_hint={''y'':0.25}, pos = (0,100), size_hint = (None, None), size = (650,100)) self.b1 = Button(text = ''Submit'', size_hint = (None, None),pos_hint={''x'':.4, ''y'':.35}, size = (75, 40)) self.lo.add_widget(self.l1) self.lo.add_widget(self.t1) self.lo.add_widget(self.b1) return self.lo if __name__ == ''__main__'': DemoApp().run()
Output
It will produce the following output −
You can obtain the same GUI design with the following “Demo.kv” file −
BoxLayout: orientation : ''horizontal'' Label: text : ''Enter your name'' font_size : ''20pt'' TextInput : font_size : ''30pt'' pos_hint : {''y'':0.25} pos : (0,100) size_hint : (None, None) size : (650,100) Button : text : ''Submit'' size_hint : (None, None) pos_hint : {''x'':.4, ''y'':.35} size : (75, 40)
”;