Im new to Python and Kivy. But I want to create a mobile app. It is supposed to be an app that will have a menu with dishes. I want when clicking on an image with a specific food, the image with that food changes to another widget with text (what the food contains and allergens), when clicked again, the image returns. Thanks for answers! Vasa
IMAGE OF APP
from kivy.uix.button import Button
import kivy
kivy.require("1.9.1")
from kivy.app import App
from kivy.uix.scrollview import ScrollView
from kivy.core.window import Window
from kivy.app import runTouchApp
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.screenmanager import Screen
from kivy.uix.anchorlayout import AnchorLayout
from kivy.lang import Builder
from kivy.config import Config
from kivy.uix.widget import Widget
from kivy.graphics import Rectangle, Color
from kivy.core.window import Window
from kivy.lang import Builder
Config.set('graphics', 'resizable', True)
class MainLayout(BoxLayout):
def spinner_clicked(self, value):
self.ids.tlac.text = value
class Home(App):
def build(self):
Window.clearcolor = (.92, .53, .58)
return MainLayout()
Home().run()
This is kv. file:
<MainLayout>:
orientation: "vertical"
AnchorLayout:
canvas:
Color:
rgba: .5, .1, .1, .1
Rectangle:
pos: self.pos
size: self.size
anchor_x: "center"
anchor_y: "top"
size_hint: 1, 0.2
BoxLayout:
orientation: "horizontal"
Image:
source:"logo.png"
Button:
background_color: .92, .53, .58, 0
pos_hint: {"center_x" : 0.5}
on_press: self.background_color = (.5, .1, .1, .2)
on_release: self.background_color = (.5, .1, .1, .0)
Image:
source:"logo_2.ico"
center_x: self.parent.center_x
center_y: self.parent.center_y
Spinner:
id: burger
background_color: .92, .53, .58, 0
pos_hint: {"center_x" : 0.5}
values: ["A", "B", "C"]
on_text: root.spinner_clicked(burger.text)
color: .92, .53, .58, 0
Image:
source:"menu.png"
center_x: self.parent.center_x
center_y: self.parent.center_y
ScrollView:
BoxLayout:
orientation: "vertical"
size_hint: 1, None
height: self.minimum_height
spacing: 5
GridLayout:
cols: 2
spacing: 5
size_hint: 1, None
height: self.minimum_height
BoxLayout:
height: 500
orientation: "vertical"
Button:
background_normal: 'obr.png'
background_down: 'down.png'
size_hint: .5, 1
pos_hint: {"x":.25, "y":1}
Button:
text: "kobliha \ncena"
halign: "center"
valign: "middle"
on_press: self.background_color = (.5, .1, .1, .1)
on_release: self.background_color = (.92, .53, .58, 0)
background_color: .92, .53, .58, 0
Button:
text: "koko2"
size_hint: 1, None
height: 500
Button:
text: "koko2"
size_hint: 1, None
height: 150
Button:
text: "koko3"
size_hint: 1, None
height: 150
Button:
text: "koko4"
size_hint: 1, None
height: 150
Button:
text: "koko5"
size_hint: 1, None
height: 150
Button:
text: "koko6"
size_hint: 1, None
height: 150
Button:
text: "koko7"
size_hint: 1, None
height: 150
Button:
text: "end"
size_hint: 1, None
height: 150
IMAGE OF APP
Related
I have tried for many hours, reading the wiki and experimenting in different ways but I have not been able to do it, can someone please explain to me explicitly (showing me) how to do this without only linking me to the wiki. Below you will find my code copied, where you read on_release: under the button with its id "settings", I want it to actually happen not on release but 1 sec after I have pressed the button.
.py file:
import kivy
from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.config import Config
from kivy.core.window import Window
from kivy.uix.boxlayout import BoxLayout
#title
#self.title('Past Paper Question Search 🔎')
#background
Window.clearcolor = (0.145, 0.145, 0.149, 1)
#resizability
Config.set('graphics', 'resizable', True)
class FloatLayout(FloatLayout):
def __init__(self, **kwargs):
super(FloatLayout, self).__init__(**kwargs)
class GUIApp(App):
def build(self):
return FloatLayout()
if __name__ == "__main__":
GUIApp().run()
.kv file:
<FloatLayout>:
BoxLayout:
id: searchBox
orientation: 'horizontal'
size_hint_x: 0.6
size_hint_y: 0.07
pos_hint: {"x":0.2, "y":0.7}
TextInput:
background_color: 0.275, 0.275, 0.275, 1
multiline: False
font_size: self.height/1.6
foreground_color: [1, 1, 1, 1]
hint_text: "Search"
hint_text_color: [1, 1, 1, 0.3]
cursor_color: [1, 1, 1, 1]
padding: [(self.height)/2-(self.line_height/2.0), (self.height)/2-(self.line_height/2.0), 6, 0]
Button:
size_hint_y: 1
width: self.height
size_hint_x: None
border: 0, 0, 0, 0
background_normal: "resources/Search.png"
background_down: "resources/Search_pressed.png"
Button:
id: settings
size_hint_y: 0.095
width: self.height
size_hint_x: None
border: 0, 0, 0, 0
background_normal: "resources/empty.png"
background_down: "resources/empty.png"
pos_hint: {"x":0.92, "y":0.9}
on_press: gif.anim_delay = 0.10
on_press: gif._coreimage.anim_reset(True)
on_release: settings.pos_hint= {"x":0.2, "y":2}
on_release: close.pos_hint= {"x":0.92, "y":0.9}
on_release: searchBox.pos_hint= {"x":0.2, "y":2.7}
Image:
id: gif
source: 'resources/settings_gif.gif'
center: self.parent.center
size: self.parent.size
anim_delay: -1
anim_loop: 1
allow_stretch: True
Button:
id: close
size_hint_y: 0.095
width: self.height
size_hint_x: None
border: 0, 0, 0, 0
background_normal: "resources/X.png"
background_down: "resources/X.png"
on_press: searchBox.pos_hint= {"x":0.2, "y":0.7}
on_press: settings.pos_hint= {"x":0.92, "y":0.9}
on_press: close.pos_hint= {"x":0.92, "y":2.9}
pos_hint: {"x":0.92, "y":2.9}
Thx in advance
Here is a small example. Read about Clock: https://kivy.org/doc/master/api-kivy.clock.html?highlight=clock#module-kivy.clock
from kivy.app import App
from kivy.lang import Builder
from kivy.clock import Clock
kv = """
BoxLayout:
orientation: 'vertical'
Label:
id: status
Button:
size_hint_y: None
height: 48
text: 'Press'
on_release: app.schedule_action()
"""
class WaitOneSecondApp(App):
def build(self):
return Builder.load_string(kv)
def schedule_action(self):
self.root.ids.status.text = 'Waiting One Second...'
Clock.schedule_once(self.wait_over, 1)
def wait_over(self, dt):
self.root.ids.status.text = 'The wait is over'
WaitOneSecondApp().run()
I want to create an app in Python Kivy but I have stuck in some part. I want some additional show-ups in my app. Briefly, that is a selection app. So after make some sellections and and press "calculate" button, I want to show some hidden results. And when you confirm those results you should press "confirm" button that shows new selections which were hidden as well.
I can make it with BooleanProperty but in that case when height: "0dp" and opacity: 0, it still keeps unwanted empty space in widget. How can I get rid of the empty space ?
little comment: when you make opticity 1 while height:"0dp" remain, you will see they are still there. height 0 is not working properly.
here my main.py
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.anchorlayout import AnchorLayout
from kivy.uix.checkbox import CheckBox
from kivy.uix.stacklayout import StackLayout
from kivy.uix.label import Label
from kivy.uix.popup import Popup
from kivy.lang import Builder
from kivy.properties import BooleanProperty
from kivy.uix.screenmanager import ScreenManager, Screen
class MainWindow(Screen):
pass
def btn(self):
popup = Popup(content=Label(text='Wrong Password'),
size_hint=(None, None), size=(200, 200))
popup.bind(on_touch_down=popup.dismiss)
popup.open()
class SecondWindow(Screen):
isShownMenu = BooleanProperty(True)
bisShownMenu = BooleanProperty(True)
class WindowManager(ScreenManager):
pass
kv = Builder.load_file("my.kv")
class MyMainApp(App):
def build(self):
return kv
if __name__== "__main__":
MyMainApp().run()
and here is my.kv:
WindowManager:
MainWindow:
SecondWindow:
<ScrollViewExample#ScrollView>:
SecondWindow:
size_hint: 1, None
height: self.minimum_height
<Button>:
size_hint: .35 , 1
height: "20dp"
width: "20dp"
pos_hint: {"center_x": .5}
<MainWindow>:
name:"main"
BoxLayout:
canvas.before:
Rectangle:
pos: self.pos
size: self.size
orientation: "vertical"
Image:
source:"vgs.png"
size_hint: 1, None
height: "110dp"
allow_stretch: True
keep_ratio: False
AnchorLayout:
anchor_x:"center"
anchor_y:"center"
BoxLayout:
orientation: "vertical"
spacing: "10dp"
size_hint: .8,.3
BoxLayout:
orientation: "horizontal"
Label:
text: "Username:"
color: 0,0,0,1
TextInput:
id: username
text: "***"
multiline: False
BoxLayout:
orientation: "horizontal"
Label:
text: "Password:"
color: 0,0,0,1
TextInput:
id: password
text: "***"
multiline: False
BoxLayout:
#orientation:"horizontal"
CheckBox:
color: 0,0,0,1
Label:
text: "Remember me"
color: 0,0,0,1
Button:
size_hint: .35 , 1
text: "Login"
pos_hint: {"center_x": .5}
on_release:
#root.btn() if username.text!="batu" or password.text!="1010" else None
app.root.current= "second" #if username.text=="batu" and password.text=="1010" else "main"
root.manager.transition.direction="left"
<SecondWindow>:
name:"second"
ScrollView:
GridLayout:
cols:1
height: self.minimum_height
row_default_height: "60dp"
size_hint_y: None
spacing:"10dp"
canvas.before:
Rectangle:
pos: self.pos
size: self.size
Image:
source:"vgs.png"
size_hint: 1, None
height: "110dp"
allow_stretch: True
keep_ratio: False
BoxLayout:
pading:"10dp"
spacing:"10dp"
orientation: "vertical"
BoxLayout:
orientation: "horizontal"
Label:
text:"Solid Content:"
color: 0,0,0,1
TextInput:
text:"enter %"
color: 0,0,0,1
BoxLayout:
orientation: "horizontal"
Label:
text:"Pressure:"
color: 0,0,0,1
TextInput:
text:"enter BAR"
color: 0,0,0,1
Button:
text:" Model Selection"
height: "20dp"
width: "20dp"
Button:
text:" Screen Selection"
Button:
text:"Rotor Selection"
Button:
text:"Motor & Reduction Selection"
Button:
text:"Calculate Selections"
on_press: root.isShownMenu = not root.isShownMenu
BoxLayout:
pading:"10dp"
spacing:"10dp"
size_hint: 1, None
height: "0dp" if root.isShownMenu else "80dp"
opacity: 0 if root.isShownMenu else 1
orientation: "vertical"
BoxLayout:
orientation:"horizontal"
Label:
text:"Calculated Flow:"
color: 0,0,0,1
Label:
text:"enter %"
color: 0,0,0,1
BoxLayout:
orientation:"horizontal"
Label:
text:"Calculated Pressure:"
color: 0,0,0,1
Label:
text:"00000"
color: 0,0,0,1
BoxLayout:
orientation:"horizontal"
Label:
text:"Fibre Lenght:"
color: 0,0,0,1
Label:
text:"000000"
color: 0,0,0,1
Button:
on_press: root.bisShownMenu = not root.bisShownMenu
text:"Confirm"
BoxLayout:
size_hint: 1, None
height: "0dp" if root.bisShownMenu else "80dp"
opacity: 0 if root.bisShownMenu else 1
orientation:"horizontal"
Label:
text:"cutter head material"
color: 0,0,0,1
Button:
text:"1.secim"
Button:
text:"2.secim"
Button:
text:"3.secim"
Button:
text:"4.secim"
BoxLayout:
size_hint: 1, None
height: "0dp" if root.bisShownMenu else "80dp"
opacity: 0 if root.bisShownMenu else 1
orientation:"horizontal"
Label:
text:"screen material"
color: 0,0,0,1
Button:
text:"1.secim"
Button:
text:"2.secim"
Button:
text:"3.secim"
Button:
text:"4.secim"
BoxLayout:
size_hint: 1, None
height: "0dp" if root.bisShownMenu else "80dp"
opacity: 0 if root.bisShownMenu else 1
orientation:"horizontal"
Label:
text:"blade material"
color: 0,0,0,1
Button:
text:"1.secim"
Button:
text:"2.secim"
Button:
text:"3.secim"
Button:
text:"4.secim"
BoxLayout:
size_hint: 1, None
height: "0dp" if root.bisShownMenu else "80dp"
opacity: 0 if root.bisShownMenu else 1
orientation:"horizontal"
Label:
text:"pot material"
color: 0,0,0,1
Button:
text:"1.secim"
Button:
text:"2.secim"
Button:
text:"3.secim"
Button:
text:"4.secim"
Button:
size_hint: .35 , 1
text: "Login"
pos_hint: {"center_x": .5}
on_release:
app.root.current= "main"
root.manager.transition.direction="right"
sorry for long codes. maybe it helps you in some parts.
I have solved my problem.
Well, if you want to add a different class to main your main class with a button or something, you should use "add_widget". But while you doing it, you need to convert your class to objectproperty first and than, use ids for id of your main widget;
cal2= ObjectProperty()
def btn4(self):
self.cal2 = MaterialS() #MaterialS is my class with different widget
self.ids.scd.add_widget(self.cal2, index=0) #scd is the id of my main widget, index =0 help me to insert to the bottom
I've some problems with multiple MDLabels in BoxLayout (that is contains by AnchorLayout), so all the MDLabel objects are stacked in one place on the screen!
I dont know how to make them centered and grouped like a list (with spacing and e.g.)
Please, help me with solving that problem!
Thanks a lot and sorry for bad english.
There is my main.py
from kivy.app import App
from kivymd.theming import ThemeManager
from kivymd.label import MDLabel
from kivy.uix.screenmanager import Screen
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.anchorlayout import AnchorLayout
from kivy.metrics import dp, sp, pt
def toast(text):
from kivymd.toast.kivytoast import toast
toast(text)
class MyScreen(Screen):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.menu_items = [
{
"viewclass": "MDMenuItem",
"text": "text%d" % i,
"callback": self.callback,
}
for i in range(1, 3)
]
self.menu_button = None
def change_variable(self, value):
print("\nvalue=", value)
self.VARIABLE = value
print("\tself.VARIABLE=", self.VARIABLE)
def callback(self, *args):
toast(args[0])
class MainApp(App):
title = "KivyMD MDDropdownMenu Demo"
theme_cls = ThemeManager()
def build(self):
return MyScreen()
if __name__ == "__main__":
MainApp().run()
And there is my main.kv file contains:
#:import MDDropdownMenu kivymd.menus.MDDropdownMenu
#:import MDRaisedButton kivymd.button.MDRaisedButton
#:import MDLabel kivymd.label.MDLabel
<MDMenuItem>:
on_release:
app.root.change_variable(self.text)
app.root.menu_button.text = self.text
<MyScreen>:
name: 'myscrn'
AnchorLayout:
anchor_y: 'center'
BoxLayout:
orientation: 'vertical'
size_hint: 0.1, 0.5
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
spacing: dp(10)
MDRaisedButton:
id: mainbutton
size_hint: None, None
size: 3 * dp(48), dp(48)
text: 'MDButton1'
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
opposite_colors: True
on_release:
root.menu_button = mainbutton
MDDropdownMenu(items=root.menu_items, width_mult=4).open(self)
MDRaisedButton:
id: secondbutton
size_hint: None, None
size: 3 * dp(48), dp(48)
text: 'MDButton2'
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
opposite_colors: True
on_release:
root.menu_button = secondbutton
MDDropdownMenu(items=root.menu_items, width_mult=4).open(self)
AnchorLayout:
anchor_y: 'top'
BoxLayout:
orientation: 'vertical'
size_hint: 0.95, 0.5
padding: [0, 0, 0, 0]
spacing: dp(5)
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
MDLabel:
font_size: dp(12)
text: '123'
MDLabel:
font_size: dp(22)
text: '456'
Woops, looks like a simple mistake. Your indentation on KV Lang is incorrect. You didn't nest your labels into BoxLayout correctly.
AnchorLayout:
anchor_y: 'top'
BoxLayout:
orientation: 'vertical'
size_hint: 0.95, 0.5
padding: [0, 0, 0, 0]
spacing: dp(5)
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
MDLabel:
font_size: dp(12)
text: '123'
MDLabel:
font_size: dp(22)
text: '456'"""
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()