I am using kivymd framework and want to insert lines between each bottom item of the Bottom Navigation.
The code is from https://kivymd.readthedocs.io/en/latest/components/bottom-navigation/index.html.
Thanks!
from kivymd.app import MDApp
from kivy.lang import Builder
class Test(MDApp):
def build(self):
self.theme_cls.primary_palette = "Gray"
return Builder.load_string(
'''
BoxLayout:
orientation:'vertical'
MDToolbar:
title: 'Bottom navigation'
md_bg_color: .2, .2, .2, 1
specific_text_color: 1, 1, 1, 1
MDBottomNavigation:
panel_color: .2, .2, .2, 1
MDBottomNavigationItem:
name: 'screen 1'
text: 'Python'
icon: 'language-python'
MDLabel:
text: 'Python'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 2'
text: 'C++'
icon: 'language-cpp'
MDLabel:
text: 'I programming of C++'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 3'
text: 'JS'
icon: 'language-javascript'
MDLabel:
text: 'JS'
halign: 'center'
'''
)
Test().run()
you can use MDSeparator in your KV file:
MDLabel:
text: "Chips with check:"
MDSeparator: <-----------##
StackLayout:
size_hint_y: None
height: self.minimum_height
spacing: dp(5)
MDChip:
label: "Check"
icon: ""
check: True
callback: app.callback
I don't think there is any easy way to do that, but here is an approach that adds a Separator Widget between the items in the MDBottomNavigation:
from kivy.clock import Clock
from kivy.properties import ListProperty
from kivy.uix.widget import Widget
from kivymd.app import MDApp
from kivy.lang import Builder
class Separator(Widget):
sep_color = ListProperty([1,0,0,1])
class Test(MDApp):
def add_seps(self, dt):
tab_bar = self.root.ids.mdbn.ids.tab_bar
for i in range(len(tab_bar.children)-1, 0, -1):
tab_bar.add_widget(Separator(size_hint=(None, 1), width=4, sep_color=[0,1,0,1]), index=i)
def build(self):
self.theme_cls.primary_palette = "Gray"
Clock.schedule_once(self.add_seps)
return Builder.load_string(
'''
<Separator>:
canvas:
Color:
rgba: self.sep_color
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation:'vertical'
MDToolbar:
title: 'Bottom navigation'
md_bg_color: .2, .2, .2, 1
specific_text_color: 1, 1, 1, 1
MDBottomNavigation:
id: mdbn
panel_color: .2, .2, .2, 1
MDBottomNavigationItem:
name: 'screen 1'
text: 'Python'
icon: 'language-python'
MDLabel:
text: 'Python'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 2'
text: 'C++'
icon: 'language-cpp'
MDLabel:
text: 'I programming of C++'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 3'
text: 'JS'
icon: 'language-javascript'
MDLabel:
text: 'JS'
halign: 'center'
'''
)
Test().run()
The Separator is just a Rectangle of the sep_color, and the add_seps() method inserts them between the items in the MDBottomNavigation. Those items are in a BoxLayout that has the id "tab_bar".
The Clock.schedule_once() calls the add_seps() method after the App is complete.
I have added the id "mdbn" on the MDBottomNavigation in your kv to make it easier to access that Widget.
Related
I created an app with a NavigationDrawer and everything work correctely, but the problem is to return to the first screen. I want to go back to the first screen (the Screen with name: 'Screen_*principal') when I click in the arrow-left in the MDTopAppBar in Login_*screen but nothing that I did worked.
KV file:
#: import RiseInTransition kivy.uix.screenmanager.RiseInTransition
#: import SlideTransition kivy.uix.screenmanager.SlideTransition
<CustomizeScreen#MDBoxLayout>
orientation: 'vertical'
text: ''
padding: 100
MDLabel:
text: root.text
halign: 'center'
pos_hint: {'center_x': .5}
MDFillRoundFlatButton:
text: 'Regresar'
pos_hint: {'center_x': .5}
on_release:
app.root.current = 'screen_principal'
app.root.transition = SlideTransition(direction= 'left' )
<DrawerClickableItem#MDNavigationDrawerItem>
focus_color: "#e7e4c0"
text_color: "#4a4939"
icon_color: "#4a4939"
ripple_color: "#c5bdd2"
selected_color: "#0c6c4d"
<DrawerLabelItem#MDNavigationDrawerItem>
text_color: "#4a4939"
icon_color: "#4a4939"
focus_behavior: False
selected_color: "#4a4939"
_no_ripple_effect: True
<Screen_principal>:
MDNavigationLayout:
MDScreen:
MDTopAppBar:
title: "Navigation Drawer"
elevation: 4
pos_hint: {"top": 1}
md_bg_color: "#e7e4c0"
specific_text_color: "#4a4939"
left_action_items: [["menu", lambda x: nav_drawer.set_state("open")]]
MDNavigationDrawer:
id: nav_drawer
radius: (0, 16, 16, 0)
MDNavigationDrawerMenu:
MDNavigationDrawerHeader:
title: "LOCATE YOU"
source: "icono.png"
spacing: "4dp"
padding: "12dp", 0, 0, "56dp"
DrawerClickableItem:
icon: "login"
text_right_color: "#4a4939"
text: "Iniciar Sesion"
on_press:
root.manager.current = "Login_screen"
DrawerClickableItem:
icon: "new-box"
text: "Registrarse"
text_right_color: "#4a4939"
on_press:
root.current = "screen_register"
DrawerClickableItem:
icon: "information-outline"
text: "Informacion"
text_right_color: "#4a4939"
on_press:
root.current = "scr1"
DrawerClickableItem:
icon: "microsoft-teams"
text: "Equipo"
text_right_color: "#4a4939"
on_press:
root.current = "scr1"
<Login_screen>:
MDBoxLayout:
orientation: 'vertical'
MDTopAppBar:
title: "Login"
md_bg_color: "#e7e4c0"
left_action_items: [["arrow-left", lambda *args : setattr(screen_manager, "current", "Screen_principal")]]
MDBoxLayout:
orientation: 'vertical'
size_hint_y: 0.3
Image:
source: 'usuario.png'
pos_hint: {'center_x': 0.5}
MDLabel:
text: 'Iniciar Sesion'
halign: 'center'
color: '#FF5A1E'
font_size: '35dp'
bold: True
pos_hint: {'center_y': .5}
MDBoxLayout:
orientation: 'vertical'
size_hint_y: 0.3
spacing: '12dp'
MDTextField:
id: user
hint_text: "Nombre de usuario"
icon_right: "account"
font_size: '25dp'
icon_right_color: '#FF5A1E'
pos_hint: {'center_x': 0.5}
MDTextField:
id: password
password:True
icon_right: "key-variant"
font_size: '25dp'
icon_right_color: '#FF5A1E'
hint_text: "Contrasena"
pos_hint: {'center_x': 0.5}
MDLabel:
id: signal_login
text: ''
halign: 'center'
color: '#FF5A1E'
font_size: '15dp'
MDBoxLayout:
orientation: 'vertical'
size_hint_y:0.4
spacing: '25dp'
MDFillRoundFlatButton:
id: bt_ingresar
text: 'Ingresar'
pos_hint: {'center_x':0.5}
on_release:
x = app.login_data()
root.current = 'open_screen' if x == True else None
MDFillRoundFlatButton:
md_bg_color: 1,1,1,1
Python file:
from kivymd.app import MDApp
from kivy.uix.screenmanager import ScreenManager
from kivy.lang import Builder
from kivy.uix.gridlayout import GridLayout
from kivy.core.window import Window
import requests
from kivy.uix.screenmanager import Screen, ScreenManager
from kivy.properties import BooleanProperty, ObjectProperty
Builder.load_file('diseno.kv')
class Screen_principal(Screen):
pass
class Login_screen(Screen):
pass
class TestApp(MDApp):
def build(self):
# Create the screen manager
sm = ScreenManager()
sm.add_widget(Screen_principal(name='Screen_principal'))
sm.add_widget(Login_screen(name='Login_screen'))
return sm
if __name__ == '__main__':
TestApp().run()
I tried a lot of things but nothing work, if someone could fix it I would be very grateful
In your kv, change:
left_action_items: [["arrow-left", lambda *args : setattr(screen_manager, "current", "Screen_principal")]]
to:
left_action_items: [["arrow-left", lambda *args : setattr(root.manager, "current", "Screen_principal")]]
This change accesses the ScreenManager by referencing root.manager, and the root in that context is the Login_screen.
I want to be able to click on MDFlatButton that says Štart and i want it to let's say for an example to call get_user_input(self) which would print whatever is inside text field. And I have been struggling with this for 2 whole days and i have no idea what to do, I am just a beginner and I have no clue what am I doing so sorry if it's messy. Ty for help, those are my files:
main.py file:
from kivy.core.window import Window
from kivy.lang import Builder
from kivy.properties import ObjectProperty
from kivymd.app import MDApp
from kivy.uix.screenmanager import Screen, ScreenManager
from kivymd.uix.menu import MDDropdownMenu
from kivymd.uix.textfield import MDTextField
from kivy.properties import StringProperty
class testy(Screen):
novy_test = ObjectProperty()
class Test(MDApp):
Window.size = (1170 / 3, 2532 / 3)
# input_number = ObjectProperty()
def build(self):
self.theme_cls.material_style = "M3"
self.theme_cls.theme_style = "Dark"
self.theme_cls.primary_palette = 'Gray'
return testy()
def get_user_input(self):
print(self.root.ids.my_textfield_1.ids.user.text)
def callback(self, button):
pass
class CustomOverFlowMenu(MDDropdownMenu):
# In this class you can set custom properties for the overflow menu.
pass
Test().run()
test.kv file:
#:import Factory kivy.factory.Factory
#:import CustomOverFlowMenu __main__.CustomOverFlowMenu
<testy>:
name:'testy'
id: testy
MDBoxLayout:
orientation: "vertical"
MDTopAppBar:
title: "MDTopAppBar"
use_overflow: True
overflow_cls: CustomOverFlowMenu()
specific_text_color: .51,.51,.51,1
md_bg_color: 0, 0, 0, 1
left_action_items: [["car", lambda x: Factory.novy_test().open(), '',"Nový test"]]
MDBottomNavigation:
panel_color: "black"
selected_color_background: "white"
text_color_active: "lightgray"
selected_color_background: 1, 1, 1, .4
MDBottomNavigationItem:
name: 'screen 1'
text: 'Testy'
icon: 'road-variant'
MDLabel:
text: 'Test'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 2'
text: 'chyby'
icon: 'alert-circle'
MDLabel:
text: 'Chyby'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 3'
text: 'Settings'
icon: 'cog'
MDLabel:
text: 'LinkedIN'
halign: 'center'
<novy_test#Popup>:
id:my_textfield_1
size_hint: .8, .45
title: 'Nový test'
separator_color: 'black'
title_align: 'center'
BoxLayout:
id: layout
spacing: 10
orientation:'vertical'
MDTextField:
id: user
hint_text: "Číslo testu"
mode: "round"
pos_hint: {"top": 1}
MDFlatButton:
text: 'Štart'
pos_hint: {'center_x': .5}
on_press: app.get_user_input()
MDFlatButton:
pos_hint: {'center_x': .5}
text:'test z nesprávnych'
MDFlatButton:
text:'test z neurobených'
pos_hint: {'center_x': .5}
MDFlatButton:
text:'test z neurobených'
pos_hint: {'center_x': .5}
MDFlatButton:
text:'test z neurobených'
pos_hint: {'center_x': .5}
I didn't perfectly understand all that you wanted to do, but in this example, the text a person types into the box will print. I moved the .kv language into a string just for convenience of creating a one-file runnable project. I tested it.
The main point is this code, inside the .kv file/kivy language you can use the id property to get a reference to the objects, and then the .text property of that object is sent as an argument to the function.
on_press: app.get_user_input(user.text)
runnable:
from kivy.core.window import Window
from kivy.lang import Builder
from kivymd.app import MDApp
from kivy.uix.screenmanager import Screen, ScreenManager
from kivymd.uix.menu import MDDropdownMenu
from kivy.uix.popup import Popup
from kivymd.uix.textfield import MDTextField
from kivy.properties import StringProperty
Builder.load_string('''
#:import Factory kivy.factory.Factory
<testy>:
name:'testy'
id: testy
MDBoxLayout:
orientation: "vertical"
MDTopAppBar:
title: "MDTopAppBar"
use_overflow: True
# overflow_cls: CustomOverFlowMenu()
specific_text_color: .51,.51,.51,1
md_bg_color: 0, 0, 0, 1
left_action_items: [["car", lambda x: Factory.NovyTest().open(), '',"Nový test"]]
MDBottomNavigation:
panel_color: "black"
selected_color_background: "white"
text_color_active: "lightgray"
selected_color_background: 1, 1, 1, .4
MDBottomNavigationItem:
name: 'screen 1'
text: 'Testy'
icon: 'road-variant'
MDLabel:
text: 'Test'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 2'
text: 'chyby'
icon: 'alert-circle'
MDLabel:
text: 'Chyby'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 3'
text: 'Settings'
icon: 'cog'
MDLabel:
text: 'LinkedIN'
halign: 'center'
<NovyTest#Popup>:
id:my_textfield_1
size_hint: .8, .45
title: 'Nový test'
separator_color: 'black'
title_align: 'center'
BoxLayout:
id: layout
spacing: 10
orientation:'vertical'
MDTextField:
id: user
hint_text: "Číslo testu"
mode: "round"
pos_hint: {"top": 1}
MDFlatButton:
text: 'Štart'
pos_hint: {'center_x': .5}
# inside .kv/kivy language you can use the id property
on_press: app.get_user_input(user.text)
MDFlatButton:
pos_hint: {'center_x': .5}
text:'test z nesprávnych'
MDFlatButton:
text:'test z neurobených'
pos_hint: {'center_x': .5}
MDFlatButton:
text:'test z neurobených'
pos_hint: {'center_x': .5}
MDFlatButton:
text:'test z neurobených'
pos_hint: {'center_x': .5}
'''
)
class NovyTest(Popup):
# just an example, not used in this code
def __init__(self, **kw):
super().__init__(**kw)
class testy(Screen):
# can list objects defined in .kv file and give them a type hint corresponding to object type
novy_test: NovyTest
def __init__(self, **kw):
super().__init__(**kw)
print("creating screen testy")
# novy_test = ObjectProperty()
class Test(MDApp):
Window.size = (1170 / 3, 2532 / 3)
# input_number = ObjectProperty()
def build(self) -> testy:
self.theme_cls.material_style = "M3"
self.theme_cls.theme_style = "Dark"
self.theme_cls.primary_palette = 'Gray'
return testy()
def get_user_input(self, input_text, *args):
print(f"{self} user input: {input_text}")
# print(self.root.ids.my_textfield_1.ids.user.text)
def callback(self, button):
pass
class CustomOverFlowMenu(MDDropdownMenu):
# In this class you can set custom properties for the overflow menu.
pass
Test().run()
end
I created this widget in a .kv file that inherits from MDCard:
<ElementCard#MDCard>:
radius: '10dp'
spacing: '10dp'
padding: '10dp'
image: ''
text: ''
sub_text: ''
orientation: 'vertical'
md_bg_color: 0.87, 0, 0.49
ripple_behavior: True # effect
on_release:
app.root.transition = RiseInTransition()
Image:
source: root.image
halign: 'center'
MDBoxLayout:
orientation: 'vertical'
md_bg_color: 'green'
MDLabel:
text: root.text
color: 'white'
halign: 'center'
MDLabel:
text: root.sub_text
halign: 'center'
and I use it:
<ui>:
...
ElementCard:
text: 'IA'
sub_text: 'Inteligencia artificial'
image: 'images/image1.jpg'
on_release:
root.current = 'screen1'
...
The problem is that the ElementCard widget doesn't show the content:
ElementCard is the purple block and it covers all its content.
When I set the transparency in 0.5 the program looks like this:
50% transparency
The versions are these:
Kivy==2.1.0
kivymd==1.1.1
I've tried rebooting the machine, restarting the virtual environment, reinstalling kivy and kivymd but nothing works.
I think the problem is the inheritance because when I use directly the MDCard like in this code:
MDCard:
radius: '10dp'
spacing: '10dp'
padding: '10dp'
orientation: 'vertical'
md_bg_color: 0.87, 0, 0.49,0.6
ripple_behavior: True # effect
on_release:
app.root.transition = RiseInTransition()
Image:
source: 'images/image1.jpg'
halign: 'center'
MDBoxLayout:
orientation: 'vertical'
md_bg_color: 'green'
MDLabel:
text: 'IA'.
color: 'white'
halign: 'center'
MDLabel:
text: 'Inteligencia artificial'
halign: 'center'
With the last code the program works fine:
MDCard works normally.
main.py full code:
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager
from kivymd.app import MDApp
class Ui(ScreenManager):
pass
class MainApp(MDApp):
def build(self):
self.theme_cls.theme_style ='Dark'
self.theme_cls.primary_palette ='Teal'
Builder.load_file("design.kv")
return Ui()
def change_style(self, checked, value):
if value:
self.theme_cls.theme_style ='Dark'
pass
else:
self.theme_cls.theme_style ='Light'
pass
if __name__ == "__main__":
MainApp().run()
design.kv full code:
#:kivy 2.1.0
#:import RiseInTransition kivy.uix.screenmanager.RiseInTransition
#:import SlideTransition kivy.uix.screenmanager.SlideTransition
<CustomizeScreen#MDBoxLayout>:
orientation: 'vertical'
text: ''
padding: 100
MDLabel:
text: root.text
halign: 'center'
pos_hint:{'center_x': 0.5}
MDFillRoundFlatButton:
text: 'REGRESAR'
pos_hint: {'center_x': 0.5}
on_release:
app.root.current = 'screen_principal'
app.root.transition = SlideTransition(direction = 'left')
<ElementCard#MDCard>:
radius: '10dp'
spacing: '10dp'
padding: '10dp'
image: ''
text: ''
sub_text: ''
orientation: 'vertical'
md_bg_color: 0.87, 0, 0.49
ripple_behavior: True # effect
on_release:
app.root.transition = RiseInTransition()
Image:
source: root.image
halign: 'center'
MDBoxLayout:
orientation: 'vertical'
md_bg_color: 'green'
MDLabel:
text: root.text
color: 'white'
halign: 'center'
MDLabel:
text: root.sub_text
halign: 'center'
<ui>:
MDScreen:
name: 'screen_principal'
md_bg_color: "black"
MDBoxLayout:
orientation: "vertical"
MDBoxLayout:
size_hint: 1, 0.2 # x=1 ocupa todo, y=0.2 ocupa 20%
orientation: "horizontal"
padding: '10dp'
MDCard:
radius: '10dp'
padding: '10dp'
line_color: 1,0,1,1
MDLabel:
text: 'APLICACIÓN DE TECNOLOGÍA'
halign: 'center'
pos_hint: {'center_y': 0.5}
MDSwitch:
pos_hint: {'center_y': 0.5}
on_active:
app.change_style(*args)
MDGridLayout:
cols: 3
size_hint: 0.8, 0.8 # x=1 ocupa todo, y=0.8 ocupa 80%
pos_hint: {'center_x': 0.5}
padding: ['10dp','10dp','10dp','10dp']
spacing: '10dp'
ElementCard:
text: 'IA'
sub_text: 'Inteligencia artificial'
image: 'images/image1.jpg'
on_release:
root.current = 'screen1'
I commented this problem in the github kivyMD project, they marked as a bug and give me a couple of options to implement, link to github
Edit:
Thanks for pointing out my mistake with my link.
This is the first option:
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.card import MDCard
KV = """
<ElementCard>
MDLabel:
text: "HELLO WORLD"
MDScreen:
ElementCard:
size_hint: 0.5, 0.8
pos_hint: {"center_x": .5, "center_y": .5}
md_bg_color: 0.87, 0, 0.49, 1
"""
class ElementCard(MDCard):
pass
class MainApp(MDApp):
def build(self):
return Builder.load_string(KV)
MainApp().run()
and the 2nd:
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.card import MDCard
KV = """
<ElementCard#MDCard>
MDLabel:
text: "HELLO WORLD"
MDScreen:
ElementCard:
size_hint: 0.5, 0.8
pos_hint: {"center_x": .5, "center_y": .5}
md_bg_color: 0.87, 0, 0.49, 1
"""
class MainApp(MDApp):
def build(self):
return Builder.load_string(KV)
MainApp().run()
I guess that the kivymd developers will repair this bug in the future.
I'm new to Kivy, I'm working on a tracking app for vehicle repair and I've got a list of appointments and I'm trying to go to a different screen when you press an item on the list and I I have no clue on why it isn't working for me as it says that it is on a different screen but it isn't on the app
from kivymd.app import MDApp
from kivy.lang.builder import Builder
from kivymd.uix.list import ThreeLineAvatarIconListItem
from kivymd.uix.list import ImageLeftWidget
from kivy.uix.screenmanager import Screen, ScreenManager, SwapTransition, CardTransition
from kivy.core.window import Window
import sqlite3
DatabaseConnection = sqlite3.connect('CarWorkshopDB.db')
cursor = DatabaseConnection.cursor()
Window.size= (400, 650)
class MainScreen(Screen):
pass
class AddScreen(Screen):
pass
class DetailsScreen(Screen):
pass
class WorkApp(MDApp):
def build(self):
self.screen_manager = ScreenManager(transition=CardTransition())
self.screen_manager.add_widget(MainScreen(name='MainScreen'))
self.screen_manager.add_widget(AddScreen(name='AddScreen'))
self.screen_manager.add_widget(DetailsScreen(name='DetailsScreen'))
screen = Builder.load_file("test2.kv")
return screen
def on_start(self):
client = 'John smith'
cursor.execute("SELECT TrackingNumber, Plate, Status FROM Appointments WHERE Customer =?", (client,))
for i in cursor:
self.new_message(i[0], i[1], i[2])
def new_message(self, TrackingNumber, Vehicle, Process):
new_message = ThreeLineAvatarIconListItem(text=TrackingNumber, secondary_text=Vehicle, tertiary_text=Process)
new_message.add_widget(ImageLeftWidget(source='RepairIMG.jpg'))
new_message.bind(on_release=self.on_touch_down)
self.root.ids.list.add_widget(new_message)
def on_touch_down(self, x):
print(self.screen_manager.current)
self.screen_manager.current = "DetailsScreen"
self.screen_manager.transition.direction = 'right'
print(self.screen_manager.current)
WorkApp().run()
this is the list code in the kv file
NavigationLayout:
ScreenManager:
id: screen_manager
MainScreen:
name : "MainScreen"
BoxLayout:
orientation:'vertical'
MDBottomNavigation:
panel_color: 1, .643, 0, 1
MDBottomNavigationItem:
name: 'screen 1'
text: 'Home'
icon: 'alpha-h-circle'
MDToolbar:
title: 'Add Repair'
md_bg_color: 1, .643, 0, 1
elevation: 6
pos_hint: {'top':1}
Widget:
MDBottomNavigationItem:
name: 'screen 2'
text: 'Track'
icon: 'alpha-t-circle'
MDToolbar:
id: toolbar
title: 'Track History'
md_bg_color: 1, .643, 0, 1
elevation: 6
pos_hint: {'top':1}
NavigationLayout:
x: toolbar.height
size_hint_y: 1.0 - toolbar.height/root.height
ScreenManager:
Screen:
name: 'ScrollViewScreen'
ScrollView:
MDList:
id: list
MDFloatingActionButton:
icon: 'plus'
md_bg_color: 1, .643, 0, 1
on_release:
screen_manager.current = 'AddScreen'
screen_manager.transition = CardTransition()
screen_manager.transition.direction = "down"
pos_hint: {'x': .84, 'y': .02}
MDBottomNavigationItem:
name: 'screen 4'
text: 'More'
icon: 'dots-horizontal'
MDToolbar:
title: 'More'
md_bg_color: 1, .643, 0, 1
elevation: 6
pos_hint: {'top':1}
Widget:
MDLabel:
text: 'dfsfdsf'
halign: 'center'
AddScreen:
name: 'AddScreen'
id: Add
FloatLayout:
orientation: 'vertical'
MDToolbar:
id: toolbar2
title: 'Add Tracking Number'
md_bg_color: 1, .643, 0, 1
elevation: 6
pos_hint: {'top':1}
MDIconButton:
icon : 'close'
pos_hint : {'top':0.98, 'x':0.85}
on_release :
screen_manager.current = "Main"
screen_manager.transition = CardTransition()
screen_manager.transition.direction = "up"
FloatLayout:
x: toolbar2.height
size_hint_y: 1.0 - toolbar.height/root.height
ScatterLayout:
MDLabel:
text: 'Track Repair'
font_style: 'H4'
valign: 'top'
pos_hint: {'top':1}
text_size: self.size
size_hint: None, None
MDTextFieldRound:
icon_left: 'alpha-t-circle'
hint_text: 'Tracking Number'
normal_color: 1, .643, 0, 1
pos_hint: {'y':.7}
text_size: self.size
MDTextFieldRound:
icon_left: 'alpha-p-circle'
hint_text: 'Postcode'
normal_color: 1, .643, 0, 1
pos_hint: {'y':.6}
text_size: self.size
MDTextButton:
text: "Cant find your tracking number?"
custom_color: 1, .643, 0, 1
pos_hint: {'y':.5}
halign: 'center'
MDRectangleFlatButton:
text: 'confirm'
pos_hint: {'y':.4}
valign: 'middle'
text_size: self.size
DetailsScreen:
name: 'DetailsScreen'
id: Details
BoxLayout:
orientation: 'vertical'
MDLabel:
text: 'details Screen?'
The problem is that in your build() method you are building a widget tree in the lines:
self.screen_manager = ScreenManager(transition=CardTransition())
self.screen_manager.add_widget(MainScreen(name='MainScreen'))
self.screen_manager.add_widget(AddScreen(name='AddScreen'))
self.screen_manager.add_widget(DetailsScreen(name='DetailsScreen'))
But this widget tree is not used in your GUI. The widget tree in your GUI is built from the kv file by:
screen = Builder.load_file("test2.kv")
When your code tries to change the current Screen by using:
self.screen_manager.current = "DetailsScreen"
it is changing the current Screen of a ScreenManager that is not in your GUI.
A fix is to assign the correct value to self.screen_manager, like this:
class WorkApp(MDApp):
def build(self):
screen = Builder.load_file("test2.kv")
self.screen_manager = screen.ids.screen_manager
return screen
Iam trying to learn coding with Python and iam making an application that tracks session times from users using KivyMD. At the moment iam trying to display the total amount of time by fetching json data trough an api call from my database. I wrote a function to fetch and process the json data to calculate the total time. The function must fire automatically to show the data (variable:total_minutes) in the MDLabel time_label when the Mijn sessie Tab loads. This is where iam getting very confused.
I found the on_pre_enter function in Kivy which fires the function when the screen loads but it only works in the Screen Class and not in the Tabs Class. I have no idea how i can use the python variable in the Tabs class if i do the python logic in the Screen class. I have tried many things with Objectproperty and Stringproperty but none where succesfull. I think iam missing something bigger here.
I will post the code to make things more clearly when you will see the application for yourself. For safety reasons i replaced the api request function with a small function which produces the same outcome (float).
Many thanks in advance!
main.py file
from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.core.window import Window
from kivy.uix.screenmanager import ScreenManager, Screen
from kivymd.uix.tab import MDTabsBase
from kivymd.font_definitions import fonts
from kivymd.icon_definitions import md_icons
from kivy.uix.floatlayout import FloatLayout
from kivy.properties import ObjectProperty, StringProperty
from kivy.uix.widget import Widget
from kivymd.uix.label import MDLabel
import requests
import json
from datetime import datetime
Window.size = (300, 500) # voor develop doeleinden mobielscherm
class Screen1(Screen):
pass
def on_pre_enter(self, *args):
def func(a, b):
total_minutes = a - b
return total_minutes
print(func(3000,1500))
class Screen2(Screen):
pass
class Screen3(Screen):
pass
class Screen4(Screen):
pass
class Tab_mijn_sessie(FloatLayout, MDTabsBase):
pass
class Tab_alarm(FloatLayout, MDTabsBase):
pass
class Tab_actieve_drinkers(FloatLayout, MDTabsBase):
pass
class Tab_score(FloatLayout, MDTabsBase):
pass
class Tab_achievments(FloatLayout, MDTabsBase):
pass
class Tab_historie(FloatLayout, MDTabsBase):
pass
class DemoApp(MDApp):
def build(self):
self.theme_cls.primary_palette = 'Red'
self.theme_cls.theme_style = 'Dark'
screen = Builder.load_file('demo_file.kv')
return screen
DemoApp().run()
demo_file.kv file
Screen:
NavigationLayout:
ScreenManager:
id:screen_manager
Screen1:
name: 'home_screen'
BoxLayout:
name: 'home_layout'
orientation: 'vertical'
MDToolbar:
title: 'Huidige sessie'
left_action_items: [['menu', lambda x: nav_drawer.set_state("open")]]
specific_text_color: 1,1,1,1
MDTabs:
id:home_tabs
tab_bar_height: '35dp'
text_color_active: 1,1,0,1
text_color_normal: 0,0,0,1
color_indicator: 0.95, 0.95, 0.1, 1
tab_indicator_anim: True
anim_duration: 0.2
tab_indicator_height: '3dp'
Tab_mijn_sessie:
text: 'Mijn sessie'
Tab_alarm:
text: 'Alarm'
Tab_actieve_drinkers:
text: 'Actieve drinkers'
MDToolbar:
id: bottom_toolbar_scr1
name: 'bottom_toolbar'
specific_text_color: 1,1,1,1
title: ' Sessie inactief..'
Screen2:
name: 'statistieken_screen'
BoxLayout:
name: 'statistieken_layout'
orientation: 'vertical'
MDToolbar:
title: 'Statistieken'
left_action_items: [['menu', lambda x: nav_drawer.set_state("open")]]
specific_text_color: 1,1,1,1
MDTabs:
id:home_tabs
tab_bar_height: '35dp'
text_color_active: 1,1,0,1
text_color_normal: 0,0,0,1
color_indicator: 0.95, 0.95, 0.1, 1
tab_indicator_anim: True
anim_duration: 0.2
tab_indicator_height: '3dp'
Tab_score:
text: 'Scorebord'
Tab_achievments:
text: 'Achievements'
Tab_historie:
text: 'Historie'
MDToolbar:
id: bottom_toolbar_scr2
name: 'bottom_toolbar'
specific_text_color: 1,1,1,1
title: ' Sessie inactief..'
Screen3:
name: 'logout_screen'
BoxLayout:
name: 'logout_layout'
orientation: 'vertical'
MDToolbar:
title: 'Uitloggen'
left_action_items: [['menu', lambda x: nav_drawer.set_state("open")]]
specific_text_color: 1,1,1,1
Widget:
Screen4:
name: 'profile_screen'
BoxLayout:
name: 'profile_layout'
orientation: 'vertical'
MDToolbar:
title: 'Profiel'
left_action_items: [['menu', lambda x: nav_drawer.set_state("open")]]
specific_text_color: 1,1,1,1
Widget:
MDToolbar:
id: bottom_toolbar_scr4
name: 'bottom_toolbar'
specific_text_color: 1,1,1,1
title: ' Sessie inactief..'
MDNavigationDrawer:
id:nav_drawer
BoxLayout:
orientation: 'vertical'
spacing: '8dp'
padding: '8dp'
Image:
source: 'avatar.jpg'
MDLabel:
text: ' Name'
front_style: 'Subtitle1'
size_hint_y: None
height: self.texture_size[1]
MDLabel:
text: ' email#hotmail.com'
front_style: 'Caption'
size_hint_y: None
height: self.texture_size[1]
ScrollView:
MDList:
OneLineIconListItem:
theme_text_color: 'Custom'
text_color: 244/255, 67/255, 54/255, 1
text: 'Huidige sessie'
on_press:
screen_manager.current = 'home_screen'
nav_drawer.set_state("close")
IconLeftWidget:
theme_text_color: 'Custom'
text_color: 0.95, 0.95, 0.1, 1
icon: 'beer'
on_press:
screen_manager.current = 'home_screen'
nav_drawer.set_state("close")
OneLineIconListItem:
theme_text_color: 'Custom'
text_color: 244/255, 67/255, 54/255, 1
text: 'Statistieken'
on_press:
screen_manager.current = 'statistieken_screen'
nav_drawer.set_state("close")
IconLeftWidget:
icon: 'history'
theme_text_color: 'Custom'
text_color: 0.95, 0.95, 0.1, 1
on_press:
screen_manager.current = 'historie_screen'
nav_drawer.set_state("close")
OneLineIconListItem:
theme_text_color: 'Custom'
text_color: 244/255, 67/255, 54/255, 1
text: 'Profiel'
on_press:
screen_manager.current = 'profile_screen'
nav_drawer.set_state("close")
IconLeftWidget:
icon: 'face-profile'
theme_text_color: 'Custom'
text_color: 0.95, 0.95, 0.1, 1
on_press:
screen_manager.current = 'profile_screen'
nav_drawer.set_state("close")
OneLineIconListItem:
theme_text_color: 'Custom'
text_color: 244/255, 67/255, 54/255, 1
text: 'Uitloggen'
on_press:
screen_manager.current = 'logout_screen'
nav_drawer.set_state("close")
IconLeftWidget:
icon: 'logout'
theme_text_color: 'Custom'
text_color: 0.95, 0.95, 0.1, 1
on_press:
screen_manager.current = 'logout_screen'
nav_drawer.set_state("close")
<Tab_mijn_sessie>:
MDLabel:
text: 'Total time'
font_style: 'H6'
halign: 'center'
pos_hint: {"center_x": .5, "center_y": .4}
MDLabel:
id : time_label
text: '(this has to display the total amount of time)'
font_style: 'Body2'
halign: 'center'
pos_hint: {"center_x": .5, "center_y": .3}
MDFlatButton:
theme_text_color: 'Custom'
text_color: 1,1,1,1
halign: 'center'
text:'Activate session'
user_font_size: "48sp"
pos_hint: {"center_x": .5, "center_y": .7}
on_press:
app.root.ids.bottom_toolbar_scr1.title = ' Sessie actief!'
app.root.ids.bottom_toolbar_scr1.specific_text_color = 0,1,0,1
app.root.ids.bottom_toolbar_scr2.title = ' Sessie actief!'
app.root.ids.bottom_toolbar_scr2.specific_text_color = 0,1,0,1
app.root.ids.bottom_toolbar_scr4.title = ' Sessie actief!'
app.root.ids.bottom_toolbar_scr4.specific_text_color = 0,1,0,1
<Tab_alarm>:
MDLabel:
halign: 'center'
text:'Alarm'
user_font_size: "48sp"
pos_hint: {"center_x": .5, "center_y": .5}
<Tab_actieve_drinkers>:
MDLabel:
halign: 'center'
text:'Actieve drinkers'
user_font_size: "48sp"
pos_hint: {"center_x": .5, "center_y": .5}
<Tab_score>:
MDLabel:
halign: 'center'
text:'Scorebord'
user_font_size: "48sp"
pos_hint: {"center_x": .5, "center_y": .5}
<Tab_achievments>:
MDLabel:
halign: 'center'
text:'Achievments'
user_font_size: "48sp"
pos_hint: {"center_x": .5, "center_y": .5}
<Tab_historie>:
FloatLayout:
MDLabel:
halign: 'center'
text:'Historie'
user_font_size: "48sp"
pos_hint: {"center_x": .5, "center_y": .5}
MDFlatButton:
id: flat
text: 'druk hier'
pos_hint: {"center_x": .5, "center_y": 0.4}
from kivy.lang import Builder
from kivy.uix.floatlayout import FloatLayout
from kivymd.app import MDApp
from kivymd.uix.tab import MDTabsBase
from kivymd.icon_definitions import md_icons
KV = '''
BoxLayout:
orientation: "vertical"
MDToolbar:
title: "Example Tabs"
MDTabs:
id: tabs
on_tab_switch: app.on_tab_switch(*args)
<Tab>:
MDIconButton:
id: icon
icon: app.icons[0]
user_font_size: "48sp"
pos_hint: {"center_x": .5, "center_y": .5}
'''
class Tab(FloatLayout, MDTabsBase):
'''Class implementing content for a tab.'''
class Example(MDApp):
icons = list(md_icons.keys())[15:30]
def build(self):
return Builder.load_string(KV)
def on_start(self):
for name_tab in self.icons:
self.root.ids.tabs.add_widget(Tab(text=name_tab))
def on_tab_switch(
self, instance_tabs, instance_tab, instance_tab_label, tab_text
):
'''Called when switching tabs.
:type instance_tabs: <kivymd.uix.tab.MDTabs object>;
:param instance_tab: <__main__.Tab object>;
:param instance_tab_label: <kivymd.uix.tab.MDTabsLabel object>;
:param tab_text: text or name icon of tab;
'''
count_icon = [k for k, v in md_icons.items() if v == tab_text]
instance_tab.ids.icon.icon = count_icon[0]
Example().run()
https://kivymd.readthedocs.io/en/latest/components/tabs/index.html#kivymd.uix.tab.MDTabs.on_tab_switch