Azaro
Azaro

Reputation: 53

Changing Textinput Size using kivy

I'm having some trouble using kivy. My goal is to create labels next to the textinput boxes so people remember what they are supposed to be typing in. I would like to be able to resize the textinput boxes or if there is a better way please let me know!

<Phone>:
result: _result
h: _h
w: _w


AnchorLayout:
    anchor_x: 'center'
    anchor_y: 'top'

    ScreenManager:
        size_hint: 1, .9
        id: _screen_manager
        Screen:
            name: 'home'
            canvas.before:
                Rectangle:
                    pos: self.pos
                    size: self.size
                    source: "/home/aaron/Desktop/main.png"
            Label:
                markup: True
                text: '[size=50][color=ff3333]Welcome to [color=ff3333]Diabetes Manager[/color][/size]'
        Screen:
            name: 'menu'
            GridLayout: 
                cols: 2
                padding: 50
                canvas.before:
                    Rectangle:
                        pos: self.pos
                        size: self.size
                        source: "/home/aaron/Desktop/main.png"

                Button:
                    text: 'My Profile'
                    on_press: _screen_manager.current = 'profile' 
                Button:
                    text: 'History'
                    on_press: _screen_manager.current = 'history'     

                Button:
                    text: 'New Entry'
                    on_press: _screen_manager.current = 'new_entry' 
                Button:
                    text: 'Graph'
                    on_press: _screen_manager.current = 'graph' 
                Button:
                    text: 'Diet'
                    on_press: _screen_manager.current = 'diet' 
                Button:
                    text: 'Settings'
                    on_press: _screen_manager.current = 'settings' 

        Screen:
            name: 'profile'
            GridLayout: 
                rows: 1
                BoxLayout:
                    Label:
                        text: 'Name'
                    TextInput:
                        id: _name
                        hint_text: 'Name'

                    Label:  
                        text: 'Gender'
                    TextInput:
                        id: _gender1
                        hint_text: 'Gender'

                    Label:
                        text: 'Type of Diabetes'
                    TextInput:
                        id: _type
                        hint_text: 'Type of Diabetes'

                    Label:
                        text: 'Height(in)'
                    TextInput:
                        id: _h
                        hint_text: 'Height in inches'

                    Label:
                        text: 'Weight(lb)'
                    TextInput:
                        id: _w
                        hint_text: 'Weight in pounds'

                    Label:
                        id:_result
                        text: 'BMI'
                    Button:
                        text: 'Calculate BMI'
                        on_press: root.product(*args)

                    Label:
                        text: 'List of Medications'
                    TextInput:
                        id: _meds
                        hint_text: 'List of Medications'

                    Label:
                        text: 'Insulin Times'
                    TextInput:
                        id: _times
                        hint_text: 'Please Enter Times to Take Insulin'


        Screen:
            name: 'history'
            GridLayout: 
                cols:1

        Screen:
            name: 'new_entry'
            GridLayout:
                cols:1
                TextInput:
                    id: _time
                    text: 'Please Enter The Current Time'
                TextInput:
                    id: _glucose_reading
                    text: 'Please Enter Your Current Blood Sugar'
                TextInput:
                    id: _food
                    text: 'Please Enter Amount of Carbs for The Meal'
                TextInput:
                    id: _meds_taken
                    text: 'Please Enter Any Medications Taken'


        Screen:
            name: 'graph'
            GridLayout: 
                cols: 3
                padding: 50
            Label: 
                markup: True
                text: '[size=24][color=dd88ff]Your Graph[/color][/size]'

        Screen:
            name: 'diet'
            GridLayout: 
                cols: 3
                padding: 50
            Label: 
                markup: True
                text: '[size=24][color=dd88ff]Reccomended Diet[/color][/size]'


        Screen:
            name: 'settings'
            GridLayout: 
                cols: 3
                padding: 50
            Label: 
                markup: True
                text: '[size=24][color=dd88ff]Settings[/color][/size]'


AnchorLayout:
    anchor_x: 'center'
    anchor_y: 'bottom'
    BoxLayout:
        orientation: 'horizontal'
        size_hint: 1, .1
        Button:
            id: btnExit
            text: 'Exit'
            on_press: app.stop() 
        Button:
            text: 'Menu'
            on_press: _screen_manager.current = 'menu'

Upvotes: 0

Views: 3891

Answers (1)

Peter Badida
Peter Badida

Reputation: 12159

You need to use another layout inside your GridLayout for each TextInput, which will create a widget with two widgets inside: Label and TextInput. The result will look like this:

Screen:
    name: 'profile'
    GridLayout: 
        cols: 1
        BoxLayout: ## Box 1
            Label:
                text: 'Name Please'                    
            TextInput:
                id: _name
        BoxLayout: ## Box 2
            Label:
                text: 'Another Name Please'                    
            TextInput:
                id: _name

With size_hint you can set sizes of Label or TextInput inside BoxLayout and even BoxLayout itself.

Or there is another way - hint_text which will display inside your TextInput when it's empty.

Example:

from kivy.lang import Builder
from kivy.base import runTouchApp
from kivy.uix.scrollview import ScrollView
Builder.load_string('''
<Test>:
    GridLayout: 
        cols: 1
        BoxLayout: ## here is one Box
            Label:
                text: 'Name Please'                    
            TextInput:
        BoxLayout: ## here is another Box
            Label:
                text: 'Name Please'                    
            TextInput:
''')
class Test(ScrollView):pass
runTouchApp(Test())

Upvotes: 1

Related Questions