Home Python C Language C ++ HTML 5 CSS Javascript Java Kotlin SQL DJango Bootstrap React.js R C# PHP ASP.Net Numpy Dart Pandas Digital Marketing

Widgets and Layuot


Widgets

Widgets in Kivy are the basic elements of the user interface. They represent everything from simple buttons and labels to more complex structures like lists and forms. Widgets can be customized and combined to create more complex interfaces.


Common Widgets

Label: Displays text.


    from kivy.uix.label import Label
    label = Label(text='Hello, Kivy!')
        

Button: A clickable button.


        from kivy.uix.label import Label
        label = Label(text='Hello, Kivy!')
    

TextInput:Allows user to input text.


        from kivy.uix.textinput import TextInput
        text_input = TextInput()
        

Image :Displays an image.


        from kivy.uix.image import Image
        image = Image(source='path/to/image.png')
        

Slider : A control for selecting a value from a range.


        from kivy.uix.slider import Slider
        slider = Slider(min=0, max=100, value=25)
        

Layout

Layouts are containers that manage the size and position of their child widgets. They determine how widgets are arranged within them and ensure that the UI is responsive to different screen sizes and orientations.


Common Layouts

BoxLayout: Arranges widgets in a horizontal or vertical box.

Horizontal BoxLayout:

          from kivy.uix.boxlayout import BoxLayout
          layout = BoxLayout(orientation='horizontal')
          layout.add_widget(Button(text='Button 1'))
          layout.add_widget(Button(text='Button 2'))
          

Vertical BoxLayout :

          layout = BoxLayout(orientation='vertical')
          layout.add_widget(Button(text='Button 1'))
          layout.add_widget(Button(text='Button 2'))
          

GridLayout: Arranges widgets in a grid.


          from kivy.uix.gridlayout import GridLayout
          layout = GridLayout(cols=2)
          layout.add_widget(Button(text='Button 1'))
          layout.add_widget(Button(text='Button 2'))
          layout.add_widget(Button(text='Button 3'))
          layout.add_widget(Button(text='Button 4'))
          

AnchorLayout :Anchors widgets to a specific position (top, bottom, left, right, center).


          from kivy.uix.anchorlayout import AnchorLayout
          layout = AnchorLayout(anchor_x='center', anchor_y='center')
          layout.add_widget(Button(text='Centered Button'))
          

FloatLayout: Places widgets at specific positions using relative coordinates.


          from kivy.uix.floatlayout import FloatLayout
          layout = FloatLayout()
          layout.add_widget(Button(text='Button', size_hint=(.2, .2), pos_hint={'x': .4, 'y': .4}))
          

StackLayout: Arranges widgets in a line, wrapping them when there’s not enough space.


          from kivy.uix.stacklayout import StackLayout
          layout = StackLayout()
          layout.add_widget(Button(text='Button 1', size_hint=(.2, .2)))
          layout.add_widget(Button(text='Button 2', size_hint=(.2, .2)))
          layout.add_widget(Button(text='Button 3', size_hint=(.2, .2)))

          

Combining Widgets and Layouts

To create a complete user interface, you often need to combine multiple widgets and layouts. Here's an example that combines several widgets in a BoxLayout:


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

class MyApp(App):
    def build(self):
        layout = BoxLayout(orientation='vertical')

        label = Label(text='Hello, Kivy!')
        layout.add_widget(label)

        text_input = TextInput()
        layout.add_widget(text_input)

        button = Button(text='Submit')
        layout.add_widget(button)

        return layout

if __name__ == '__main__':
    MyApp().run()

          

Summary




Advertisement





Q3 Schools : India


Online Complier

HTML 5

Python

java

C++

C

JavaScript

Website Development

HTML 5

Python

java

C++

C

JavaScript

Campus Learning

C

C#

java