Raidar
Raidar

Reputation: 69

Kivy make a grid layout inside a label or button

Is it possible to have a grid like layout inside a Label or a Button in kivy.

I have an app that takes in a CSV file with product information and I would like to populate MainScreen with rows from a CSV file. Each row should look like this:

Row In the end the Label or Button should be pressable to open a pop up window for confirmation screen for quantity of the product and verify.
Is it even possible or am I approaching it from the wrong angle?

I do not have any code yet to populate the MainScreen with rows but this is how it looks so far. To clarify. At this moment I don't need help with importing CSV files, but with the method to display it, that matches the above criteria(picture)

Code so far is as follows:
ATmain.py

from kivy.app import App
from kivy.uix.screenmanager import Screen, ScreenManager
from kivy.core.window import Window
from kivy.lang import Builder
from kivy.properties import StringProperty

Window.clearcolor = (1,1,1,1)
Window.size = (270, 480)


class LoginScreen(Screen):
    input = StringProperty("")


class MainScreen(Screen):
    username = StringProperty('')


class ScreenManagement(ScreenManager):
    pass


presentation = Builder.load_file("app.kv")


class ATApp(App):
    presentation = Builder.load_file("app.kv")
    def build(self):
        return presentation


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

app.kv:

# File name: main.py
#:import FadeTransition kivy.uix.screenmanager.FadeTransition
#:kivy 1.10.1

ScreenManagement:
    transition: FadeTransition()
    LoginScreen:
        id: login
    MainScreen:
        username: login.input



<LoginScreen>:
    name: "login"
    canvas:
        Color:
            rgba: [1,1,1]
        Rectangle:
            pos: self.pos
            size: self.size
    FloatLayout:
        rows:2
        cols:1
        background_color: 1,1,1,1
        Label:
            size_hint: 0.3, 0.05
            pos_hint: {"x": 0.5 - 0.3/2, "center_y": 0.4}
            text:"Kasutaja"
            color: 0,0,0,1
        TextInput:
            id: input
            size_hint: (0.3, None)
            height: 30
            pos_hint: {"x": 0.5 - 0.3/2, "center_y": 0.3}
            multiline: False

        Button:
            id: confirm_login
            text: "Login"
            size_hint: 0.15, 0.07
            pos_hint: {"x": 0.5 - 0.15/2, "center_y": 0.2}
            background_color: 0.9,0.9,0.9,1
            on_press: self.background_color = (1,0,0,1)
            on_release: root.input = input.text; app.root.current = "main"

<MainScreen>:
    name: "main"
    canvas:
        Rectangle:
            pos: self.pos
            size: self.size 
    Label:

        id:name
        text: root.username
        color: (0,0,0,1)
        size_hint_y: None
        height: 30
        size_hint_x: 1
        pos_hint: {"right": 1, "top": 1}


    BoxLayout:
        orientation: "vertical"
        size_hint_y: None
        size_hint_x: 1
        pos_hint_x: None
        pos_hint_y: 1

        Button:
            text: "Item1"
            color: (0,0,0,1)
            height: self.height
            size_hint_y: None
            size_hint_x: 1
            pos_hint: {"right": 1, "top": 0}

I would be very greatful if anyone could as much as point me in the right direction!

Upvotes: 1

Views: 2347

Answers (1)

silverhash
silverhash

Reputation: 919

The kivy hack way will be to simply use a GridLayout or any layout for that matter then give your layout button properties so it is clickable like so :

from kivy.behaviors import ButtonBehavior

#then make a clickable grid
class GridButton(GridLayout, ButtonBehaviour):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
    #Then do whatever you want to do

Another way to do it I guess would be to use the on_touch_down callback and check if the touch is within the widget's bounds

Upvotes: 1

Related Questions