I am trying to reference to Canvas within GridLayout with just drawing simple rectangle before further development.
Code:
main.py:
import kivy
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.lang import Builder
from kivy.graphics.vertex_instructions import Rectangle
from kivy.graphics.context_instructions import Color
class Grafika(Widget):
def __init__(self, **kwargs):
super(Grafika,self).__init__(**kwargs)
with self.canvas:
Color(1, 0, 0, 1)
Rectangle(pos=self.pos,size=self.size)
kv=Builder.load_file("my.kv")
class MyMainApp(App):
def build(self):
return kv
if __name__ == "__main__":
MyMainApp().run()
my.py
<TextInput>:
font_size:20
color: 0.3, 0.6,0.7,1
size_hint: (0.3,0.5)
<Button>:
font_size:20
color: 0.3, 0.6,0.7,1
size_hint: (0.3,0.3)
Grafika:
GridLayout:
cols:2
GridLayout:
size_hint: (0.3,0.2)
cols:1
GridLayout:
cols:2
Label:
text:"no"
TextInput:
text: "50"
Label:
text:"rbr"
TextInput:
text: "100"
Button:
text:"calc"
canvas:
Color:
rbg:1, 1, 1, 1
Rectangle:
pos:self.pos
size:self.size
After running i get error:
...
27: Button:
28: text:"calc"
>> 29: canvas:
30: Color:
31: rbg:1, 1, 1, 1
...
Canvas instructions added in kv must be declared before child widgets.
I am new in kivy, so any help is appreciated.
After solving this issue, I am planning to run custom python func , run under button calc, and return calculated results on canvas.
Func results are 2d line points, hence plotting of results on canvas is goal here.
Change:
Grafika:
GridLayout:
cols:2
GridLayout:
size_hint: (0.3,0.2)
cols:1
GridLayout:
cols:2
Label:
text:"no"
TextInput:
text: "50"
Label:
text:"rbr"
TextInput:
text: "100"
Button:
text:"calc"
canvas:
Color:
rbg:1, 1, 1, 1
Rectangle:
pos:self.pos
size:self.size
to:
Grafika:
GridLayout:
cols:2
canvas:
Color:
rbg:1, 1, 1, 1
Rectangle:
pos:self.pos
size:self.size
GridLayout:
size_hint: (0.3,0.2)
cols:1
GridLayout:
cols:2
Label:
text:"no"
TextInput:
text: "50"
Label:
text:"rbr"
TextInput:
text: "100"
Button:
text:"calc"
to put the canvas: instruction before the children.
Related
recently I try to make that app with python and kivy. After tons of hours googling everything together i more or less have everything i want. Only one thing is missing:
I have several screens. At the beginning of the App I have a menu. After that i have lots of questions; all of them have the same text and buttons in the bottom of the screen. I managed to make that the following way:
<firstquestion>:
name: "firstquestion"
GridLayout:
cols: 1
size_hint_y: 1
GridLayout:
cols: 1
NeuLabelinBox:
text: "Here the Question"
GridLayout:
cols: 1
size_hint_y: 0.1
UnteresMenue:
Please notice "UnteresMenue" which refer another Class in the kv language. I think I somehow mixed 2 Screens together in one. The kv code of "UnteresMenue"
<UnteresMenue>:
name: "UnteresMenue"
#id: UnteresMenue
GridLayout:
cols: 1
NeuButton:
text: root.labeltext
Now for the python part:
class UnteresMenue(Screen):
labeltext = StringProperty("Answer")
That works fine. But now I want to change the text of the label in this "UnteresMenue", when I press a certain button at the beginning of the app (Start Questions). The label in the "Untermenue" should change to a certain text. So to do this:
text: "Exam"
self.manager.get_screen('UnteresMenue').labeltext = text
For all other classes this method works fine. But not for that certain class "UnteresMenue". Is it because it is implemented in the question and therefor kv does not recognize its properties?
For any small hints I would be more than grateful!
Here an "Mini" Example:
In the Main Menu you get to the "Exam" Section (Press Here in the example). While entering this Section (Prüfungsmodus) the property of the questions should change. "Press Here" again to get to the questions.
Normally it says in the Top of the questions "This should change" And THIS is supposed to change the label into "Zeit" while entering the Prüfungsmodus Screen (Class def on_enter, in the python file), but it doesn't...
Python File:
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen, TransitionBase
from kivy.properties import ObjectProperty, NumericProperty
from kivy.uix.popup import Popup
from kivy.uix.label import Label
from kivy.core.text import LabelBase
from kivy.core.window import Window
from kivy.graphics import Color, InstructionGroup, Line, Rectangle
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.button import Button
from kivy.properties import ListProperty
from kivy.uix.textinput import TextInput
from kivy.uix.checkbox import CheckBox
from kivy.uix.widget import Widget
from kivy.config import Config
from kivy.properties import StringProperty
from kivy.clock import Clock
from functools import partial
from kivy.uix.image import Image
from kivy.garden.navigationdrawer import NavigationDrawer as ND
from kivy.uix.scatter import Scatter
import random
import time
Window.clearcolor = (0.2,0.2, 0.2,1)
Window.size = (480, 800)
#--------------------------------- Hauptmenü -------------------------------------------
class hauptmenue(Screen, Widget):
pass
class Pruefungsmodus(Screen):
labeltext2 = StringProperty("hi")
def on_enter(self):
text = "Zeit"
self.manager.get_screen('OberesMenue').labeltext = text #DAS Klappt nicht
def StartPruefung(self):
sm.current = "ersteFrage"
class UnteresMenue(Screen):
background_color_Kappa = ListProperty([0.2,0.2,0.2, 1])
class OberesMenue(Screen):
BildLabeltext = StringProperty("Bilder\Loesung_Bild_pressed.png")
BildLabeltext2 = StringProperty("Bilder\Loesung_Bild.png")
labeltext = StringProperty("This should change")
class ersteFrage(Screen):
pass
class WindowManager(ScreenManager):
pass
kv = Builder.load_file("my.kv")
sm = WindowManager()
sm.add_widget(hauptmenue(name="hauptmenue"))
sm.add_widget(Pruefungsmodus(name="Pruefungsmodus"))
sm.add_widget(OberesMenue(name="OberesMenue"))
sm.add_widget(UnteresMenue(name="UnteresMenue"))
sm.add_widget(ersteFrage(name="ersteFrage"))
sm.current = "hauptmenue"
class Vorbrereitung(App):
pruefung = ObjectProperty(None)
def build(self):
return sm
if __name__ == "__main__":
Vorbrereitung().run()
my.kv file :
#:include alleFragen.kv
<NeuLabel2#Label>:
halign: "center"
color:1,1,1,1 # <-----------
canvas.before:
Color:
rgba: 0.2,0.2, 0.2,1
Rectangle:
pos: self.pos
size: self.size
<NeuLabelinBox#Label>:
font_size: "22sp"
color:0,0,0,1 # <-----------
canvas.before:
Color:
rgba: 0.949019608, 0.949019608, 0.949019608, 1
Rectangle:
pos: self.pos
size: self.size
<NeuCheckBox#CheckBox>:
color: 0, 0, 0, 1
canvas.before:
Color:
rgba: 0.949019608, 0.949019608, 0.949019608, 1
Rectangle:
pos: self.pos
size: self.size
<NeuButton#Button>:
font_size: "22sp"
background_normal: ''
#background_normal: "background.png"
background_color: 0.92549,0.92549,0.92549, 1
color:0,0,0,1 # <-----------
canvas.before:
Color:
rgba: 0.2,0.2, 0.2,1
Rectangle:
pos: self.pos
size: self.size
<NeuButtonKappa#Button>:
font_size: "40sp"
background_normal: ''
background_color: 0.2,0.2,0.2, 1
color:1,1,1,1 # <-----------
canvas.before:
Color:
rgba: 0.2,0.2, 0.2,1
Rectangle:
pos: self.pos
size: self.size
#---------------------------------- Hauptmenue ---------------------------------------------------------------------------------
<hauptmenue>:
name: "Hauptmenue"
GridLayout:
cols:1
#spacing: 20
GridLayout:
cols:1
padding: 20
size_hint_y: 0.2
NeuLabel2:
size_hint_x: 0.6
text: ""
font_size: (root.width**2 + root.height**2) / 13**4
halign: 'center'
valign: 'middle'
GridLayout:
cols:2
padding: 30
spacing: 20
size_hint_y: 0.5
BoxLayout:
NeuButton:
text: ''
BoxLayout:
NeuButton:
text: 'PRESS HERE'
on_release:
app.root.current = "Pruefungsmodus"
BoxLayout:
NeuButton:
text: ""
halign: 'center'
valign: 'middle'
BoxLayout:
NeuButton:
text: ""
BoxLayout:
padding: 10
size_hint_y: 0.15
NeuButton:
text: ''
#---------------------------------- Pruefungsmodus ---------------------------------------------------------------------------------
<Pruefungsmodus>:
name: "Pruefungsmodus"
#background_color: 1, 1, 1, 1
id: pruefungsmudos
GridLayout:
cols:1
#spacing: 20
GridLayout:
cols:3
padding: 20
size_hint_y: 0.2
Image:
size_hint_x: 0.2
source:"Bilder\Logo.png"
NeuLabel2:
size_hint_x: 0.6
text: 'Pr\u00FCfungs\nmodus'
font_size: (root.width**2 + root.height**2) / 12**4
halign: 'center'
valign: 'middle'
Image:
size_hint_x: 0.2
source:"Bilder\Logo2.png"
GridLayout:
cols:1
padding: 30
spacing: 10
size_hint_y: 0.4
NeuLabelinBox:
id: text2
text: root.labeltext2
color: 0,0,0,1 # <-----------
canvas.before:
Color:
rgba: 0.949019608, 0.949019608, 0.949019608, 1
Rectangle:
pos: self.pos
size: self.size
GridLayout:
cols:2
padding: 30
size_hint_y: 0.2
BoxLayout:
padding: 30
spacing: 10
NeuButton:
size_hint_x: 0.5
text: "Press Here"
on_release:
app.root.current = "ersteFrage"
NeuButton:
size_hint_x: 0.5
text: ""
on_release:
app.root.current = "hauptmenue"
#---------------------------------- Erste Frage ---------------------------------------------------------------------------------
<ersteFrage>:
name: "ersteFrage"
GridLayout:
cols: 1
size_hint_y: 1
GridLayout:
cols: 1
size_hint_y: 0.08
OberesMenue:
GridLayout:
cols: 1
size_hint_y: 0.1
NeuLabel2:
font_size: "18sp"
text: "Wie lautet......."
GridLayout:
cols: 1
size_hint_y: 0.7
padding: 20
background_color: 0.92549,0.92549,0.92549, 1
rows: 2
BoxLayout:
orientation:'horizontal'
NeuLabelinBox:
text: "h+u=ZU"
NeuCheckBox:
NeuLabelinBox:
text: "h+u=ZU"
NeuCheckBox:
BoxLayout:
orientation:'horizontal'
NeuLabelinBox:
text: "h+u=ZU"
NeuCheckBox:
NeuLabelinBox:
text: "h+u=ZU"
NeuCheckBox:
GridLayout:
cols: 1
size_hint_y: 0.1
UnteresMenue:
and the outsourced Top and Button Menu:
alleFragen.kv
<OberesMenue>:
id: OberesMenueee
name: "OberesMenue"
GridLayout:
cols:1
GridLayout:
#size_hint_y: 0.05
spacing: 20
cols: 3
NeuButton:
text: ""
size_hint_x: 0.16
background_color: 1,1,1, 1
background_down: root.BildLabeltext
background_normal: root.BildLabeltext2
color:1,1,1,1 # <-----------
canvas.before:
Color:
rgba: 0.2,0.2, 0.2,1
Rectangle:
pos: self.pos
size: self.size
NeuLabel2:
size_hint_x: 0.8
text: root.labeltext
NeuButtonKappa:
size_hint_x: 0.1
text: "MENU"
background_down: "Bilder\HintergurndFarbe_app.png"
on_release:
app.root.current = "hauptmenue"
<UnteresMenue>:
name: "UnteresMenue"
id: UnteresMenuee
GridLayout:
cols: 5
spacing: 20
padding: 20
NeuButton:
text: "<=="
NeuButton:
text: "<"
NeuButtonKappa:
text: 'k'
#background_color: root.background_color_Kappa
background_down: "Bilder\HintergurndFarbe_app.png"
NeuButton:
text: ">"
NeuButton:
text: "==>"
The problem is that you have two different instances of the OberesMenue Screen.
There is one created in your python:
sm.add_widget(OberesMenue(name="OberesMenue"))
And you have another created in your kv:
<ersteFrage>:
name: "ersteFrage"
GridLayout:
cols: 1
size_hint_y: 1
GridLayout:
cols: 1
size_hint_y: 0.08
OberesMenue:
In order to acces the second instance of OberesMenue, you can add an id:
<ersteFrage>:
name: "ersteFrage"
GridLayout:
cols: 1
size_hint_y: 1
GridLayout:
cols: 1
size_hint_y: 0.08
OberesMenue:
id: in_ersteFrage
Then in your on_enter() method of Pruefungsmodus, you can change that instance by using:
def on_enter(self):
text = "Zeit"
self.manager.get_screen('ersteFrage').ids.in_ersteFrage.labeltext = text #DAS Klappt nicht
Note that this changes the Label in the second instance of OberesMenue, but has no effect on the first. Your original code was changing the first instance, but not the second. And you can't put the same instance in both places at the same time, since a Widget can have only one parent at a time.
So, if those instances are intended to be identical, then you need to change the Label in both.
If you really want to share the same instance, you can keep your own record of where it is and use remove_widget() and add_widget() to move it from one parent to another.
I'm trying to position a gridlayout(that contains 4 text input) at the center of another gridlayout(that is the rootwidget- ResgistrationWindow in my case) in kivy.but nothing seems to work.
This is my .kv file and the root widget is a grid layout
<RegistrationWindow>
cols:1
canvas.before:
Rectangle:
size: self.size
pos:self.pos
source:"emotion.jpg"
GridLayout:
cols: 2
size_hint: None,None
size:root.width,root.height/14
Label:
text: "Button 1"
size_hint_x:0.95
Button:
text: "X"
size_hint_x: 0.05
GridLayout:
cols:1
size_hint: None, None
size:root.width, root.height/2
TextInput:
multiline:False
TextInput:
multiline:False
TextInput:
multiline:False
TextInput:
multiline:False
And this is my .py file
from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.lang.builder import Builder
class RegistrationWindow(GridLayout):
def __init__(self, **kwargs):
super().__init__(**kwargs)
kv = Builder.load_file("emotions.kv")
class RegistrationApp(App):
def build(self):
return RegistrationWindow()
if __name__ == "__main__":
RegistrationApp().run()
I think your problem is a matter of indentations. Since you want to add your GridLayouts inside your RegistrationWindow, your .kv file should look more like this:
(You can rearrange the GridLayouts further as you like, or indent a GridLayout even more to put it inside another GridLayout.)
<RegistrationWindow>
cols:1
canvas.before:
Rectangle:
size: self.size
pos:self.pos
source:"emotion.jpg"
GridLayout:
cols: 2
size_hint: None,None
size:root.width,root.height/14
Label:
text: "Button 1"
size_hint_x:0.95
Button:
text: "X"
size_hint_x: 0.05
GridLayout:
cols:1
size_hint: None, None
size:root.width, root.height/2
TextInput:
multiline:False
TextInput:
multiline:False
TextInput:
multiline:False
TextInput:
multiline:False
I'm trying to figure out how to make my buttons and labels fix perfectly depending on my display size. So if the phone display is different, it will always be in fixed size.
Python Code:
import kivy
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen
class OpeningScreen(Screen):
pass
class LoginScreen(Screen):
pass
class SignupScreen(Screen):
pass
class ScreenManagement(ScreenManager):
pass
AppKv = Builder.load_file("App.kv")
class MyApp(App):
def build(self):
return AppKv
if __name__ == '__main__':
MyApp().run()
Kv code:
#: import FadeTransition kivy.uix.screenmanager.FadeTransition
#: import hex kivy.utils.get_color_from_hex
#------------------------------------------------------------#
ScreenManagement:
transition: FadeTransition()
OpeningScreen:
LoginScreen:
SignupScreen:
#------------------------------------------------------------#
<OpeningScreen>:
name: "OpeningScreen"
canvas:
Color:
rgb: 1, 1, 1
Rectangle:
pos: self.pos
size: self.size
Label:
text: "Welcome"
color: 1,1,1,1
font_size: 45
size_hint: 0.2,0.1
pos_hint: {"x":0.40, "top":0.995}
Button:
size: 100,75
on_release: app.root.current = "LoginScreen"
text: "Login"
font_size: 50
color: 1,1,1,1
background_color: (0,0,0,1)
background_normal: ""
background_down: ""
size_hint: 0.3,0.2
pos_hint: {"x":0.35, "top":0.7}
Button:
size: 100,75
on_release: app.root.current = "SignupScreen"
text: "Sign up"
font_size: 50
color: 1,1,1,1
background_color: (0,0,0,1)
background_normal: ""
background_down: ""
size_hint: 0.3,0.2
pos_hint: {"x":0.35, "top":0.4}
#------------------------------------------------------------#
<LoginScreen>:
name: "LoginScreen"
canvas:
Color:
rgb: 1, 1, 1
Rectangle:
pos: self.pos
size: self.size
Label:
text: "Login In"
color: 0,0,0,1
font_size: 45
size_hint: 0.2,0.1
pos_hint: {"x":0.40, "top":0.995}
#------------------------------------------------------------#
<SignupScreen>:
name: "SignupScreen"
canvas:
Color:
rgb: 1, 1, 1
Rectangle:
pos: self.pos
size: self.size
Label:
text: "Sign Up"
color: 0,0,0,1
font_size: 45
size_hint: 0.2,0.1
pos_hint: {"x":0.40, "top":0.995}
I would really appreciate if anyone could help me with this. I was trying to find out how to do this but I couldn't
Button and Label sizes can be set using several different approaches:
Use Kivy Metrics. You can set sizes using dp (for example dp(100)), this is a Density-independent Pixel size. There is also a sp (used similarly) that is Scale-independent Pixels (normally used for font sizes)
Use self.texture_size. You can set sizes using this as size: self.texture_size. This will make your Button and Label widgets just large enough to fit the text in it. You can add some padding by using something like:
width: self.texture_size[0] + dp(10)
height: self.texture_size[1] + dp(10)
Use size_hint. This will ensure that the Button and Label widgets take up the same percentage of your display, regardless of the device.
Don't forget to set size_hint to None, None for the first two above to work.
I'm currently working with Kivy for GUI Design I was looking for a way to change a button text with a TextInput from another screen.
My Screen 1 has a button that will work as a "label", there I have another button to go to screen 2.
Screen 2 is a Keypad with a Textinput on it, there I put the numbers that I want to set in the button "label" from screen 1.
With a button called "ENTER" I want to go back to the screen 1 and update the new text in the button "label". But I can't figure out how to do it properly.
Here is a little piece of the project code main.py :
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.uix.label import Label
from kivy.uix.widget import Widget
from kivy.graphics import Line
from kivy.uix.gridlayout import GridLayout
from kivy.uix.textinput import TextInput
class Main_Screen(Screen):
pass
class Input_Number_Inch_Screen(Screen):
pass
class Input_Screen(Screen):
pass
class Screen_Management(ScreenManager):
pass
presentation = Builder.load_file("screen3.kv")
class Screen3App(App):
def build(self):
return presentation
Screen3App().run()
the screen3.kv file:
Screen_Management:
id: screen_management
transition: FadeTransition()
Main_Screen:
id: main_screen
name: "main_screen_name"
manager: screen_management
Input_Screen:
id: tire_setup_screen_id
name: "tire_setup_screen_name"
manager: screen_management
Input_Number_Inch_Screen:
name: "inch_screen"
manager: screen_management
<Main_Screen>:
canvas:
Color:
rgb: [.30, .30, .30]
Rectangle:
pos: self.pos
size: self.size
Button:
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
size_hint: .2, 1
pos_hint: {"x": 0, "center_y": .5}
on_release: app.root.current = "tire_setup_screen_name"
text: " INPUTS "
font_size: 30
# Screen 1: Input Screen
<Input_Screen>:
canvas:
Color:
rgb: [.30, .30, .30]
Rectangle:
pos: self.pos
size: self.size
GridLayout:
cols: 2
pos: (160,150)
size_hint: (.8, .8)
Button:
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
font_size: 30
text: "INPUT\n(Inch)"
size_hint_x: None
width: 150
on_release: app.root.current = "inch_screen"
# This button will go to the screen2
Button:
id: inch_input
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
font_size: 100
text: "THIS IS THE TEXT THAT I WANT TO UPDATE"
# Screen 2: Input Inch Screen Data
<Input_Number_Inch_Screen>:
canvas:
Color:
rgb: [.30, .30, .30]
Rectangle:
pos: self.pos
size: self.size
GridLayout:
orientation: 'vertical'
display: entry
rows: 6
padding: 10
spacing: 10
# This is the TextInput
BoxLayout:
TextInput:
id: entry
font_size: 75
multiline: False
# This will be the button that would go back to the screen and update
# the button text with the new text entered in the TextInput
BoxLayout:
spacing: 10
Button:
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
font_size: 40
text:"ENTER"
on_release: app.root.current = "tire_setup_screen_name"
on_press: app.root.inch_input.text = entry.text
Any comment to help it would be great, thanks for your time.
Please replace the following in screen3.kv:
on_press: app.root.inch_input.text = entry.text
with:
on_press: root.manager.ids.tire_setup_screen_id.ids.inch_input.text = entry.text
Example
main.py
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.uix.label import Label
from kivy.uix.widget import Widget
from kivy.graphics import Line
from kivy.uix.gridlayout import GridLayout
from kivy.uix.textinput import TextInput
class Main_Screen(Screen):
pass
class Input_Number_Inch_Screen(Screen):
pass
class Input_Screen(Screen):
pass
class Screen_Management(ScreenManager):
pass
presentation = Builder.load_file("screen3.kv")
class Screen3App(App):
def build(self):
return presentation
if __name__ == "__main__":
Screen3App().run()
screen3.kv
#:kivy 1.10.0
#:import FadeTransition kivy.uix.screenmanager.FadeTransition
Screen_Management:
id: screen_management
transition: FadeTransition()
Main_Screen:
id: main_screen
name: "main_screen_name"
manager: screen_management
Input_Screen:
id: tire_setup_screen_id
name: "tire_setup_screen_name"
manager: screen_management
Input_Number_Inch_Screen:
name: "inch_screen"
manager: screen_management
<Main_Screen>:
canvas:
Color:
rgb: [.30, .30, .30]
Rectangle:
pos: self.pos
size: self.size
Button:
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
size_hint: .2, 1
pos_hint: {"x": 0, "center_y": .5}
on_release: root.manager.current = "tire_setup_screen_name"
text: " INPUTS "
font_size: 30
# Screen 1: Input Screen
<Input_Screen>:
canvas:
Color:
rgb: [.30, .30, .30]
Rectangle:
pos: self.pos
size: self.size
GridLayout:
cols: 2
pos: (160,150)
size_hint: (.8, .8)
Button:
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
font_size: 30
text: "INPUT\n(Inch)"
size_hint_x: None
width: 150
on_release: root.manager.current = "inch_screen"
# This button will go to the screen2
Button:
id: inch_input
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
font_size: 100
text: "THIS IS THE TEXT THAT I WANT TO UPDATE"
# Screen 2: Input Inch Screen Data
<Input_Number_Inch_Screen>:
canvas:
Color:
rgb: [.30, .30, .30]
Rectangle:
pos: self.pos
size: self.size
GridLayout:
orientation: 'vertical'
display: entry
rows: 6
padding: 10
spacing: 10
# This is the TextInput
BoxLayout:
TextInput:
id: entry
font_size: 75
multiline: False
# This will be the button that would go back to the screen and update
# the button text with the new text entered in the TextInput
BoxLayout:
spacing: 10
Button:
background_color: .52, .52, .52, 1
bold: 1
color: .0078,.67,.69,1
font_size: 40
text:"ENTER"
on_release: root.manager.current = "tire_setup_screen_name"
on_press: root.manager.ids.tire_setup_screen_id.ids.inch_input.text = entry.text
Outpu
I have two widgets in a horizontal boxlayout. Afaik they will both stretch to fill half of the boxlayout. How do I go about resizing the widgets and repositioning within the boxlayout? Is it worth putting each widget in its own boxlayout so that it isn't affected by the widget beside it? Here is my code so far:
from kivy.app import App
from kivy.uix.label import Label
from kivy.lang import Builder
from kivy.properties import ListProperty
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.dropdown import DropDown
from kivy.uix.button import Button
from kivy.uix.textinput import TextInput
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
class ShoppingListScreen(Screen):
pass
class theScreenManager(ScreenManager):
pass
root_widget = Builder.load_string('''
#:import FadeTransition kivy.uix.screenmanager.FadeTransition
theScreenManager:
ShoppingListScreen:
<ShoppingListScreen>:
BoxLayout:
orientation: 'vertical'
BoxLayout:
orientation: 'horizontal'
size_hint: 1, .3
Button:
text: '<'
size_hint: .1, 1
font_size: 75
background_normal: ""
background_color: 0.18, .5, .92, 1
on_release: app.root.current = 'main'
Label:
text: 'Login'
halign: 'left'
font_size: 50
canvas.before:
Color:
rgb: 0.18, .5, .92
Rectangle:
pos: self.pos
size: self.size
Widget:
size_hint: .1, 1
canvas.before:
Color:
rgb: 0.18, .5, .92
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: 'vertical'
canvas.before:
Color:
rgb: 1, 1, 1
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: 'horizontal'
padding_left: 250
Label:
text: 'Username:'
font_size: 25
color: 0.18, .5, .92, 1
size_hint: .2, .5
pos_hint: {'top': 1}
TextInput:
size_hint: .3, .1
Button:
text: 'Register'
font_size: 35
size_hint: 1, .3
background_normal: ""
background_color: 0.18, .5, .92, 1
#on_release: app.root.current = 'main'
Label:
text: 'Support'
color: 0.18, .5, .92, 1
halign: 'left'
font_size: 25
size_hint: 1, .3
canvas.before:
Color:
rgb: 1, 1, 1
Rectangle:
pos: self.pos
size: self.size
''')
class temprecipeapp(App):
def build(self):
return root_widget
if __name__ == "__main__":
temprecipeapp().run()
If you run this file you will see the username and textinput box are in skewered positions. I am trying to center them and put them both beside each other. How would I go about doing so?
Maybe this will help:
I just import GridLayout and change part with Label:Usename and TextInput from BoxLayout to GridLayout.
from kivy.app import App
from kivy.uix.label import Label
from kivy.lang import Builder
from kivy.properties import ListProperty
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.gridlayout import GridLayout
from kivy.uix.dropdown import DropDown
from kivy.uix.button import Button
from kivy.uix.textinput import TextInput
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
class ShoppingListScreen(Screen):
pass
class theScreenManager(ScreenManager):
pass
root_widget = Builder.load_string('''
#:import FadeTransition kivy.uix.screenmanager.FadeTransition
theScreenManager:
ShoppingListScreen:
<ShoppingListScreen>:
BoxLayout:
orientation: 'vertical'
BoxLayout:
orientation: 'horizontal'
size_hint: 1, .3
Button:
text: '<'
size_hint: .1, 1
font_size: 75
background_normal: ""
background_color: 0.18, .5, .92, 1
on_release: app.root.current = 'main'
Label:
text: 'Login'
halign: 'left'
font_size: 50
canvas.before:
Color:
rgb: 0.18, .5, .92
Rectangle:
pos: self.pos
size: self.size
Widget:
size_hint: .1, 1
canvas.before:
Color:
rgb: 0.18, .5, .92
Rectangle:
pos: self.pos
size: self.size
GridLayout:
cols: 2
rows: 1
size_hint: 1, .1
canvas.before:
Color:
rgb: 1, 1, 1
Rectangle:
pos: self.pos
size: self.size
Label:
text: 'Username:'
font_size: 25
size_hint: .3, 1
color: 0.18, .5, .92, 1
pos_hint: {'center': 1}
TextInput:
size_hint: .7, 1
font_size: 25
Button:
text: 'Register'
font_size: 35
size_hint: 1, .3
background_normal: ""
background_color: 0.18, .5, .92, 1
#on_release: app.root.current = 'main'
Label:
text: 'Support'
color: 0.18, .5, .92, 1
halign: 'left'
font_size: 25
size_hint: 1, .3
canvas.before:
Color:
rgb: 1, 1, 1
Rectangle:
pos: self.pos
size: self.size
''')
class temprecipeapp(App):
def build(self):
return root_widget
if __name__ == "__main__":
temprecipeapp().run()