from kivy.lang import Builder
from kivymd.app import MDApp
KV = '''
MDScreen:
MDLabel:
id: lab
text: "WELLCOME"
bold:'True'
font_size: 40
halign: 'center'
color:1,0,1,1
pos_hint: {'center_x': .5, 'center_y': .83}
MDFillRoundFlatButton:
text: "language-python"
pos_hint: {"center_x": .5, "center_y": .5}
size_hint: (0.25,0.08)
on_release: app.kav()
'''
class Example(MDApp):
def build(self):
self.theme_cls.theme_style = "Dark"
self.theme_cls.primary_palette = "Orange"
return Builder.load_string(KV)
def kav(self):
self.root.ids.lab.text = 'Have A Great Day'
Example().run()
i even tried this little app. it still doesnt work.???
It`s work
from kivy.lang import Builder
from kivymd.app import MDApp
KV = '''
MDScreen:
MDLabel:
id: lab
text: "WELLCOME"
bold:'True'
font_size: 40
halign: 'center'
color:1,0,1,1
pos_hint: {'center_x': .5, 'center_y': .83}
MDFillRoundFlatButton:
text: "language-python"
pos_hint: {"center_x": .5, "center_y": .5}
size_hint: (0.25,0.08)
on_release: app.kav()
'''
class Example(MDApp):
def build(self):
self.theme_cls.theme_style = "Dark"
self.theme_cls.primary_palette = "Orange"
return Builder.load_string(KV)
def kav(self):
self.root.ids.lab.text = 'Have A Great Day'
Example().run()
Related
So i am trying to add a MDFloatingActionButtonSpeedDial button into my screen but it just does not shows up but if i remove the MDNavigationRail part, it shows up fine.
Here's my code:
main.py
from kivymd.app import MDApp
from kivy.uix.screenmanager import ScreenManager, Screen
from kivymd.uix.datatables import MDDataTable
from kivy.metrics import dp
class CfgScreen(Screen):
data = {
"Add user": "account-plus-outline",
"Edit user": "account-edit-outline",
"Delete user":"account-remove-outline"
}
my_label = "Wazap!"
rdata = [("a","b","c","d","e"),("a","b","c","d","e"),("a","b","c","d","e")]
def __init__(self, **kwargs):
super(CfgScreen, self).__init__(**kwargs)
def on_pre_enter(self):
self.create_ua_table()
def create_ua_table(self):
table_ua = MDDataTable(
column_data=[
("Username", dp(50)),
("Password", dp(100)),
("Level", dp(40)),
("Email", dp(70)),
("Company", dp(50))
],
row_data=self.rdata,
sorted_on="Username",
sorted_order="ASC",
elevation=2
)
self.ids.screen_cfg_user_account.add_widget(table_ua)
class MainApp(MDApp):
def build(self):
self.title = "Banana BMS"
self.theme_cls.primary_palette = "Teal"
self.theme_cls.primary_hue = "500"
sm = ScreenManager()
sm.add_widget(CfgScreen(name="cfg"))
return sm
if __name__=="__main__":
MainApp().run()
main.kv
CfgScreen:
<CfgScreen>:
name: "cfg"
sm_cfg: sm_cfg
scroll: scroll
screen_cfg_user_account: screen_cfg_user_account
canvas.before:
Color:
rgba: 242/255.00, 242/255.00, 242/255.00
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: "vertical"
MDTopAppBar:
title: "Topbar"
elevation: 10
md_bg_color: app.theme_cls.primary_color
specific_text_color: 242/255.00, 242/255.00, 242/255.00
canvas.before:
Color:
rgba: app.theme_cls.primary_color
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: "horizontal"
MDNavigationRail:
id: navigation_rail
md_bg_color: app.theme_cls.primary_color
selected_color_background: "#F2F2F2"
ripple_color_item: 242/255.00, 242/255.00, 242/255.00
specific_text_color: 242/255.00, 242/255.00, 242/255.00
icon_color_item_normal: 242/255.00, 242/255.00, 242/255.00
icon_color_item_active: app.theme_cls.primary_color
anchor: "center"
type: "unselected"
size_x: 0.3
MDNavigationRailItem:
icon: "account-details-outline"
MDNavigationRailItem:
icon: "account-card-outline"
MDNavigationRailItem:
icon: "database-settings-outline"
ScreenManager:
id: sm_cfg
canvas.before:
Color:
rgba: 242/255.00, 242/255.00, 242/255.00
Rectangle:
pos: self.pos
size: self.size
Screen:
name: "cfg_user_account"
MDLabel:
text: root.my_label
halign: "center"
MDScrollView:
id: scroll
size_hint: 0.9, 0.7
pos_hint:{'x': 0.05, 'center_y': 0.45}
RelativeLayout:
id: screen_cfg_user_account
#orientation: "vertical"
MDFloatingActionButtonSpeedDial:
data: root.data
root_button_anim: True
Anyone can tell me why is it not working? There is no error thrown either.
I recently started using kivy for my project.
I'm trying to make a simple digital coffee menu board.
I'm trying to display what a user have selected.
In MenuScreen, menu is presented to a user, which then a user can select.
After selection, I would like to move to another screen and display 'the selection' eg: Espresso
on top of the picture of a coffee cup.
I got to a stage where I can manually write a string value to be displayed.
But I wasn't able to display the selected name of the coffee by a user.
I'm literally stuck with this problem for 2 straight days or about 17hours of intense googling and reading documentations, but with my limited braincells, I wasn't able to solve it.
I've looked into binding, passing variables between 2 classes,etc.
Any help would be greatly appreciated!!
short version python code
class MenuScreen(Screen):
def __init__(self, **kwargs):
super(MenuScreen, self).__init__(**kwargs)
def buttonEspresso(self):
print ('Espresso Selected')
global selectedDrink
selectedDrink = self.coffeeName.text #<-------
sm.current = 'settings'
class SettingsScreen(Screen):
coffeeName = ObjectProperty(None)
def __init__(self, **kwargs):
super(SettingsScreen, self).__init__(**kwargs)
self.ids.coffeeName.text = selectedDrink #<-------
def backToMenu(self):
print('going back to menu')
sm.current = 'menu'
short version kivy code
:
coffeeName: coffeeName
GridLayout:
cols:2
GridLayout:
cols:2
Button:
id: coffeeName
text: 'Espresso'
on_press:
root.manager.transition = FadeTransition()
root.text = 'Espresso'
root.buttonEspresso()
<SettingsScreen>:
coffeeName: coffeeName
GridLayout:
cols:2
GridLayout:
cols:1
Button:
text: 'Back to menu'
size_hint: None, None
size: 200, 50
on_press:
root.manager.transition = SlideTransition(direction="left")
root.backToMenu()
Label:
id: coffeeName #<-------
text: 'coffeeName'
font_size: 70
size_hint: None, None
size: 960, 50
AnchorLayout:
anchor_x: 'center'
anchor_y: 'center'
Image:
source: 'cappuccino.png'
size_hint: None, None
size: 1000, 1000
If I select 'Espresso' then my desired outcome is
having 'Espresso' displayed in the red border.
Above image with myDesiredOutcome was made by editing
self.ids.coffeeName.text = selectedDrink #<-------
for illustration purpose
PythonCode
import kivy
from kivy.app import App
from kivy.logger import Logger
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.video import Video
from kivy.uix.label import Label
from kivy.uix.button import Button
from kivy.lang import Builder
from kivy.uix.widget import Widget
from kivy.properties import StringProperty
from kivy.properties import ObjectProperty
import subprocess
import os
from omxplayer.player import OMXPlayer
class Player(Video):
def __init__(self, **kwargs):
super(Player, self).__init__(**kwargs)
self.player = OMXPlayer('video.mp4','--loop')
self.state='play'
self.options={'eos': 'loop'}
self.bind(on_touch_down = self.on_stop)
def check(self):
Logger.info("film position:" + str(self.position))
def on_stop(self, *args):
print ('I have been clicked')
#self.state='stop' # stop the video
self.player.quit()
sm.current = 'menu' # switch to the other Screen
class MenuScreen(Screen):
#coffeeName = ObjectProperty(None)
def __init__(self, **kwargs):
super(MenuScreen, self).__init__(**kwargs)
def buttonEspresso(self):
print ('Espresso Selected')
global selectedDrink
selectedDrink = self.coffeeName.text #<-------
sm.current = 'settings'
def buttonAmericano(self):
print ('Americano Selected')
sm.current = 'settings'
def buttonCafeLatte(self):
print ('Cafe Latte Selected')
sm.current = 'settings'
def buttonCappuccino(self):
print ('Cappuccino Selected')
sm.current = 'settings'
def buttonCafeMocha(self):
print ('Cafe Mocha Selected')
sm.current = 'settings'
def buttonMochaccino(self):
print ('Mochaccino Selected')
sm.current = 'settings'
class SettingsScreen(Screen):
coffeeName = ObjectProperty(None)
def __init__(self, **kwargs):
super(SettingsScreen, self).__init__(**kwargs)
self.ids.coffeeName.text = selectedDrink #<-------
def backToMenu(self):
print('going back to menu')
sm.current = 'menu'
Builder.load_file('screenManager.kv')
sm = ScreenManager()
screen1 = Screen(name='video')
screen1.add_widget(Player())
sm.add_widget(screen1)
sm.add_widget(MenuScreen(name='menu'))
sm.add_widget(SettingsScreen(name='settings'))
class VideoPlayerApp(App):
def build(self):
return sm
if __name__ == "__main__":
video = VideoPlayerApp()
try:
video.run()
except KeyboardInterrupt:
video.stop()
os.system('killall dbus-daemon')
Kivy code
#:import FadeTransition kivy.uix.screenmanager.FadeTransition
#:import SlideTransition kivy.uix.screenmanager.SlideTransition
#:import GridLayout kivy.uix.gridlayout
<MenuScreen>:
coffeeName: coffeeName
GridLayout:
cols:2
GridLayout:
cols:2
Button:
id: coffeeName
text: 'Espresso'
on_press:
root.manager.transition = FadeTransition()
root.text = 'Espresso'
root.buttonEspresso()
Button:
text: 'Americano'
on_press:
root.manager.transition = FadeTransition()
root.buttonAmericano()
Button:
text: 'Cafe Latte'
on_press:
root.manager.transition = FadeTransition()
root.buttonCafeLatte()
Button:
text: 'Cappuccino'
on_press:
root.manager.transition = FadeTransition()
root.buttonCappuccino()
Button:
text: 'Cafe Mocha'
on_press:
root.manager.transition = FadeTransition()
root.buttonCafeMocha()
Button:
text: 'Mochaccino'
on_press:
root.manager.transition = FadeTransition()
root.buttonMochaccino()
GridLayout:
cols:2
Button:
text: 'Hot Chocolate'
on_press:
root.manager.transition = FadeTransition()
root.manager.current = 'settings'
#fading transition for video
Button:
text: 'Creamy Chocolate'
on_press:
root.manager.transition = FadeTransition()
root.manager.current = 'settings'
#fading transition for video
Button:
text: 'Express Coffee'
on_press:
root.manager.transition = FadeTransition()
root.manager.current = 'settings'
#fading transition for video
Button:
text: 'Green Tea'
on_press:
root.manager.transition = FadeTransition()
root.manager.current = 'settings'
#fading transition for video
Button:
text: 'Milk Tea'
on_press:
root.manager.transition = FadeTransition()
root.manager.current = 'settings'
#fading transition for video
Button:
text: 'Roibos Tea'
on_press:
root.manager.transition = FadeTransition()
root.manager.current = 'settings'
#fading transition for video
<SettingsScreen>:
coffeeName: coffeeName
GridLayout:
cols:2
GridLayout:
cols:1
Button:
text: 'Back to menu'
size_hint: None, None
size: 200, 50
on_press:
root.manager.transition = SlideTransition(direction="left")
root.backToMenu()
Label:
id: coffeeName #<-------
text: 'coffeeName'
font_size: 70
size_hint: None, None
size: 960, 50
AnchorLayout:
anchor_x: 'center'
anchor_y: 'center'
Image:
source: 'cappuccino.png'
size_hint: None, None
size: 1000, 1000
GridLayout:
cols:1
Label:
font_size: 70
text: 'Select a Payment Option'
size_hint: None, None
size: 960, 200
BoxLayout:
size_hint: None, None
size: 960, 50
ToggleButton:
text: 'Cash'
font_size: 50
on_press:
print('on_press')
ToggleButton:
text: 'UniPay'
font_size: 50
ToggleButton:
text: 'Bank Cards'
font_size: 50
BoxLayout:
Button:
text: 'Back to menu'
on_press:
root.manager.transition = SlideTransition(direction="left")
root.manager.current = 'menu'
I am referring to this video and trying to replicate the same using KivyMD. Basically it is a simple app with the screen manager. Once you enter the password pswd it takes you to the next screen and on the release of the button, it comes back.
I am trying to replace the text filed with KivyMD TestRoundField
main.py file from the Tutorial
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen
class MainWindow(Screen):
pass
class SecondWindow(Screen):
pass
class WindowManager(ScreenManager):
pass
kv = Builder.load_file("my.kv")
class MyMainApp(App):
def build(self):
return kv
if __name__ == "__main__":
MyMainApp().run()
my.kv file from the tutorial - Password - pswd
WindowManager:
MainWindow:
SecondWindow:
<MainWindow>:
name: "main"
GridLayout:
cols:1
GridLayout:
cols:2
Label:
text: "Password"
TextInput:
id: passw
multiline: False
Button:
text: "Submit"
on_release:
app.root.current = "second" if passw.text == "pswd" else "main"
root.manager.transition.direction = "left"
<SecondWindow>:
name: "second"
Button:
text: "Go Back"
on_release:
app.root.current = "main"
root.manager.transition.direction = "right"
My Code
This is my main.py file -
from kivy.factory import Factory
from kivymd.app import MDApp
from kivy.lang import Builder
kivyFile = Builder.load_file("loginKivy.kv")
class MainApp(MDApp):
def __init__(self, **kwargs):
self.title = "KivyMD Examples - Round Text Field"
self.theme_cls.primary_palette = "BlueGray"
super().__init__(**kwargs)
def build(self):
self.root = Factory.Password()
return kivyFile
class Second_Screen(Screen):
pass
if __name__ == "__main__":
MainApp().run()
This is my loginKivy.kv file
#:set color_shadow [0, 0, 0, .2980392156862745]
#:set color_lilac [.07058823529411765, .07058823529411765, .14901960784313725, .8]
<MyMDTextFieldRound#MDTextFieldRound>
size_hint_x: None
normal_color: color_shadow
active_color: color_shadow
pos_hint: {"center_x": .5}
<Password#Screen>
canvas:
Color:
rgba: color_lilac
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: "vertical"
size_hint_y: None
height: self.minimum_height
spacing: dp(15)
pos_hint: {"center_x": .5, "center_y": .5}
MyMDTextFieldRound:
icon_type: "without"
hint_text: "Field without icon"
color: 1,0,1,1
I am confused on how to proceed further. What should I do next?
I suggest changing your build() method to:
def build(self):
return Builder.load_file("loginKivy.kv")
# sm = ScreenManager()
# sm.add_widget(Factory.Password())
# sm.add_widget(Second_Screen())
# return sm
Then you need to add the "Submit" and "Go Back" Buttons to your kv as well as the <Second_Screen> rule.
You can add those Buttons using kivy Button or kivyMD MDRaisedButton:
#:set color_shadow [0, 0, 0, .2980392156862745]
#:set color_lilac [.07058823529411765, .07058823529411765, .14901960784313725, .8]
ScreenManager:
Password:
Second_Screen:
<MyMDTextFieldRound#MDTextFieldRound>
size_hint_x: None
normal_color: color_shadow
active_color: color_shadow
pos_hint: {"center_x": .5}
<Password#Screen>
name: "main"
canvas:
Color:
rgba: color_lilac
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: "vertical"
size_hint_y: None
height: self.minimum_height
spacing: dp(15)
pos_hint: {"center_x": .5, "center_y": .5}
MyMDTextFieldRound:
id: passw
icon_type: "without"
hint_text: "Field without icon"
color: 1,0,1,1
MDRaisedButton:
text: "Submit"
pos_hint: {'center_x': 0.5}
on_release:
app.root.current = "second" if passw.text == "pswd" else "main"
root.manager.transition.direction = "left"
<Second_Screen>:
name: 'second'
MDRaisedButton:
text: "Go Back"
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
on_release:
app.root.current = "main"
root.manager.transition.direction = "right"
I have also added the ScreenManager structure allowing the build() method to just return the result of loading the kv file.
The documentation for kv can be found at kivy.lang
What I have:
- A dynamic TextWrapper(GridLayout) that includes Images and Labels made from the "description" text out of the SpeciesView.data
- A RecycleView that lets me click through the different texts
The problem is though, that I can't seem to find a way to scroll through the GridLayout (TextWrapper).
I think I am not using the size_hint_y correctly, which should allow the ScrollView to be able to scroll. The reason found here..
The text is always weirdly cut.
So how do I get this ScrollView to work?
from kivy.app import App
from kivy.uix.button import Label
from kivy.lang import Builder
from kivy.properties import BooleanProperty, StringProperty, ObjectProperty
from kivy.uix.behaviors import FocusBehavior
from kivy.uix.gridlayout import GridLayout
from kivy.uix.image import Image
from kivy.uix.recycleboxlayout import RecycleBoxLayout
from kivy.uix.recycleview import RecycleView
from kivy.uix.recycleview.layout import LayoutSelectionBehavior
from kivy.uix.recycleview.views import RecycleDataViewBehavior
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.scrollview import ScrollView
Builder.load_string("""
<ScreenManagement>:
screen_species: screen_species
ScreenSpecies:
id: screen_species
name: 'screen_species'
<ScreenSpecies>:
species_text: species_text
Label:
pos_hint: {"x": .45, "top": 1}
size_hint: .1, .1
text: "Test"
BoxLayout:
id: species_layout
padding: dp(10)
spacing: dp(10)
orientation: 'horizontal'
SpeciesView:
id: species_list_view
SpeciesText:
id: species_text
name_selected: "" if not species_list_view.name_selected else species_list_view.name_selected
<SpeciesView>:
viewclass: 'SelectableLabel'
name_selected: ""
SelectableRecycleBoxLayout:
orientation: 'vertical'
default_size: None, dp(32)
default_size_hint: .6, None
size_hint: 1, .9
multiselect: False
touch_multiselect: False
<SpeciesText>:
ScrollView:
size_hint_y: None
<SelectableLabel>:
canvas.before:
Color:
rgba: (.05, 0.5, .9, .8) if self.selected else (.5, .5, .5, 1)
Rectangle:
pos: self.pos
size: self.size
<SpeciesLabel>:
text_size: self.size
size_hint_y: None
<SpeciesImage>:
size_hint_y: None
allow_stretch: True
keep_ratio: True
texture_size: dp(20), dp(40)
<TextWrapper>:
minimum_height: self.height
orientation: "vertical"
spacing: 10
cols: 1
size_hint_y: None
""")
class SelectableRecycleBoxLayout(FocusBehavior, LayoutSelectionBehavior,
RecycleBoxLayout):
pass
class SelectableLabel(RecycleDataViewBehavior, Label):
''' Add selection support to the Label '''
index = None
selected = BooleanProperty(False)
selectable = BooleanProperty(True)
def refresh_view_attrs(self, rv, index, data):
''' Catch and handle the view changes '''
self.index = index
return super(SelectableLabel, self).refresh_view_attrs(
rv, index, data)
def on_touch_down(self, touch):
''' Add selection on touch down '''
if super(SelectableLabel, self).on_touch_down(touch):
return True
if self.collide_point(*touch.pos) and self.selectable:
return self.parent.select_with_touch(self.index, touch)
def apply_selection(self, rv, index, is_selected):
''' Respond to the selection of items in the view. '''
self.selected = is_selected
if is_selected:
print("selection changed to {0}".format(rv.data[index]))
rv.name_selected = rv.data[index]['text']
App.get_running_app().root.screen_species.species_text.update(TextWrapper(rv.data[index]["description"]))
else:
print("selection removed for {0}".format(rv.data[index]))
class ScreenSpecies(Screen):
pass
class SpeciesView(RecycleView):
def __init__(self, **kwargs):
super(SpeciesView, self).__init__(**kwargs)
self.data = [
{"text": "Test1", "description": "Test1.textbf\nBla\n |img=image.jpg| Test1.textaf\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla"},
{"text": "Test2", "description": "Test2.text"},
{"text": "Test3", "description": "Test3.text"}
]
class SpeciesText(ScrollView):
def update(self, text_wrapper):
print("Adding TextWrapper {} to SpeciesText ScrollView".format(text_wrapper))
self.clear_widgets()
self.add_widget(text_wrapper)
class SpeciesLabel(Label):
pass
class SpeciesImage(Image):
pass
class TextWrapper(GridLayout):
def __init__(self, text="", **kwargs):
super(TextWrapper, self).__init__(**kwargs)
self.content = self.wrap_text(text)
def wrap_text(self, source):
text = source.split("|")
for i in range(0, len(text)):
if "img=" in text[i]:
self.add_widget(SpeciesImage(source=text[i][4:]))
else:
self.add_widget(SpeciesLabel(text=text[i]))
return text
class ScreenManagement(ScreenManager):
screen_species = ObjectProperty(None)
class TestApp(App):
def build(self):
return ScreenManagement()
test_app = TestApp()
test_app.run()
Thanks as always!
SpeciesText - Using RstDoc
The following example illustrates Kivy RstDcoument. It supports long text, images, and the document is scrollable.
Snippets
kv File
<SpeciesText>:
container: container
orientation: 'vertical'
size_hint: 1, .9
RstDocument:
id: container
Example: SpeciesText - Using RstDoc
main.py
from kivy.app import App
from kivy.uix.button import Label
from kivy.lang import Builder
from kivy.properties import BooleanProperty, ObjectProperty
from kivy.uix.behaviors import FocusBehavior
from kivy.uix.image import Image
from kivy.uix.recycleboxlayout import RecycleBoxLayout
from kivy.uix.recycleview import RecycleView
from kivy.uix.recycleview.layout import LayoutSelectionBehavior
from kivy.uix.recycleview.views import RecycleDataViewBehavior
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.boxlayout import BoxLayout
Builder.load_string("""
<ScreenManagement>:
screen_species: screen_species
ScreenSpecies:
id: screen_species
name: 'screen_species'
<ScreenSpecies>:
species_text: species_text
Label:
pos_hint: {"x": .45, "top": 1}
size_hint: .1, .1
text: "Test"
BoxLayout:
id: species_layout
padding: dp(10)
spacing: dp(10)
orientation: 'horizontal'
SpeciesView:
id: species_list_view
SpeciesText:
id: species_text
name_selected: "" if not species_list_view.name_selected else species_list_view.name_selected
<SpeciesView>:
viewclass: 'SelectableLabel'
name_selected: ""
SelectableRecycleBoxLayout:
orientation: 'vertical'
default_size: None, dp(32)
default_size_hint: .6, None
size_hint: 1, .9
multiselect: False
touch_multiselect: False
<SpeciesText>:
container: container
orientation: 'vertical'
size_hint: 1, .9
RstDocument:
id: container
<SelectableLabel>:
canvas.before:
Color:
rgba: (.05, 0.5, .9, .8) if self.selected else (.5, .5, .5, 1)
Rectangle:
pos: self.pos
size: self.size
""")
class SelectableRecycleBoxLayout(FocusBehavior, LayoutSelectionBehavior,
RecycleBoxLayout):
pass
class SelectableLabel(RecycleDataViewBehavior, Label):
''' Add selection support to the Label '''
index = None
selected = BooleanProperty(False)
selectable = BooleanProperty(True)
def refresh_view_attrs(self, rv, index, data):
''' Catch and handle the view changes '''
self.index = index
return super(SelectableLabel, self).refresh_view_attrs(
rv, index, data)
def on_touch_down(self, touch):
''' Add selection on touch down '''
if super(SelectableLabel, self).on_touch_down(touch):
return True
if self.collide_point(*touch.pos) and self.selectable:
return self.parent.select_with_touch(self.index, touch)
def apply_selection(self, rv, index, is_selected):
''' Respond to the selection of items in the view. '''
self.selected = is_selected
if is_selected:
print("selection changed to {0}".format(rv.data[index]))
rv.name_selected = rv.data[index]['text']
App.get_running_app().root.screen_species.species_text.update(rv.data[index]["description"])
else:
print("selection removed for {0}".format(rv.data[index]))
class ScreenSpecies(Screen):
species_text = ObjectProperty(None)
class SpeciesView(RecycleView):
def __init__(self, **kwargs):
super(SpeciesView, self).__init__(**kwargs)
self.data = [
{"text": "Test1", "description": "./rstDocs/bearwithus.rst"},
{"text": "Test2", "description": "./rstDocs/kvDoc.rst"},
{"text": "Test3", "description": "./rstDocs/sphinxDoc.rst"}
]
class SpeciesText(BoxLayout):
container = ObjectProperty(None)
def update(self, source):
print("Adding TextWrapper {} to SpeciesText ScrollView".format(source))
self.container.source = source
class SpeciesLabel(Label):
pass
class SpeciesImage(Image):
pass
class ScreenManagement(ScreenManager):
screen_species = ObjectProperty(None)
class TestApp(App):
def build(self):
return ScreenManagement()
test_app = TestApp()
test_app.run()
Output: SpeciesText - Using RstDoc
SpeciesText - Using ScrollView+GridLayout+Label+Image
Use ObjectProperty to hook up to the GridLayout. Please refer to the example for details.
Snippets
kv file
<SpeciesText>:
container: container
bar_width: 10
bar_color: 0, 1, 0, 1 # green
bar_inactive_color: 1, 0, 0, 1 # red
effect_cls: "ScrollEffect"
scroll_type: ['bars']
size_hint: (1, None)
# TextWrapper
GridLayout:
id: container
cols: 1
spacing: 10
size_hint_y: None
height: self.minimum_height
Example: SpeciesText - Using ScrollView+GridLayout+Label+Image
main.py
from kivy.app import App
from kivy.uix.button import Label
from kivy.lang import Builder
from kivy.properties import BooleanProperty, StringProperty, ObjectProperty
from kivy.uix.behaviors import FocusBehavior
from kivy.uix.gridlayout import GridLayout
from kivy.uix.image import Image
from kivy.uix.recycleboxlayout import RecycleBoxLayout
from kivy.uix.recycleview import RecycleView
from kivy.uix.recycleview.layout import LayoutSelectionBehavior
from kivy.uix.recycleview.views import RecycleDataViewBehavior
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.scrollview import ScrollView
Builder.load_string("""
<ScreenManagement>:
screen_species: screen_species
ScreenSpecies:
id: screen_species
name: 'screen_species'
<ScreenSpecies>:
species_text: species_text
Label:
pos_hint: {"x": .45, "top": 1}
size_hint: .1, .1
text: "Test"
BoxLayout:
id: species_layout
padding: dp(10)
spacing: dp(10)
orientation: 'horizontal'
SpeciesView:
id: species_list_view
SpeciesText:
id: species_text
name_selected: "" if not species_list_view.name_selected else species_list_view.name_selected
<SpeciesView>:
viewclass: 'SelectableLabel'
name_selected: ""
SelectableRecycleBoxLayout:
orientation: 'vertical'
default_size: None, dp(32)
default_size_hint: .6, None
size_hint: 1, .9
multiselect: False
touch_multiselect: False
<SpeciesText>:
container: container
bar_width: 10
bar_color: 0, 1, 0, 1 # green
bar_inactive_color: 1, 0, 0, 1 # red
effect_cls: "ScrollEffect"
scroll_type: ['bars']
size_hint: (1, None)
GridLayout:
id: container
cols: 1
spacing: 10
size_hint_y: None
height: self.minimum_height
<SelectableLabel>:
canvas.before:
Color:
rgba: (.05, 0.5, .9, .8) if self.selected else (.5, .5, .5, 1)
Rectangle:
pos: self.pos
size: self.size
<SpeciesLabel>:
size: self.texture_size
size_hint_y: None
<SpeciesImage>:
size_hint_y: None
allow_stretch: True
keep_ratio: True
texture_size: dp(20), dp(40)
""")
class SelectableRecycleBoxLayout(FocusBehavior, LayoutSelectionBehavior,
RecycleBoxLayout):
pass
class SelectableLabel(RecycleDataViewBehavior, Label):
''' Add selection support to the Label '''
index = None
selected = BooleanProperty(False)
selectable = BooleanProperty(True)
def refresh_view_attrs(self, rv, index, data):
''' Catch and handle the view changes '''
self.index = index
return super(SelectableLabel, self).refresh_view_attrs(
rv, index, data)
def on_touch_down(self, touch):
''' Add selection on touch down '''
if super(SelectableLabel, self).on_touch_down(touch):
return True
if self.collide_point(*touch.pos) and self.selectable:
return self.parent.select_with_touch(self.index, touch)
def apply_selection(self, rv, index, is_selected):
''' Respond to the selection of items in the view. '''
self.selected = is_selected
if is_selected:
print("selection changed to {0}".format(rv.data[index]))
rv.name_selected = rv.data[index]['text']
App.get_running_app().root.screen_species.species_text.wrap_text(rv.data[index]["description"])
else:
print("selection removed for {0}".format(rv.data[index]))
class ScreenSpecies(Screen):
species_text = ObjectProperty(None)
class SpeciesView(RecycleView):
def __init__(self, **kwargs):
super(SpeciesView, self).__init__(**kwargs)
self.data = [
{"text": "Test1", "description": "Test1.textbf\nBla\n |img=kivy_logo.jpg| Test1.textaf\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla\nBla"},
{"text": "Test2", "description": "Test2.text"},
{"text": "Test3", "description": "Test3.text"}
]
class SpeciesText(ScrollView):
container = ObjectProperty(None)
def wrap_text(self, source):
print("Adding TextWrapper {} to SpeciesText ScrollView".format(source))
self.container.clear_widgets()
text = source.split("|")
for txt in text:
if "img=" in txt:
self.container.add_widget(SpeciesImage(source=txt[4:]))
else:
self.container.add_widget(SpeciesLabel(text=txt))
class SpeciesLabel(Label):
pass
class SpeciesImage(Image):
pass
class ScreenManagement(ScreenManager):
screen_species = ObjectProperty(None)
class TestApp(App):
def build(self):
return ScreenManagement()
test_app = TestApp()
test_app.run()
Output: SpeciesText - Using ScrollView+GridLayout+Label+Image
I have created a ScrollView with a GridLayout that has a bunch of buttons. my issue is that I cant get the buttons to be a perfect square when changing the window size.
.py file:
from kivy.app import App
from kivy.uix.label import Label
from kivy.uix.button import Button
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.properties import ObjectProperty
from kivy.uix.scrollview import ScrollView
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.stacklayout import StackLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.gridlayout import GridLayout
class LogInScreen(Screen):
pass
class EmployeeScreen(Screen):
pass
class MyLayout(GridLayout):
def __init__(self,**kwargs):
super(MyLayout,self).__init__(**kwargs)
self.size_hint_y = (None)
self.bind(minimum_height = self.setter('height'))
class Manager(ScreenManager):
login_screen = ObjectProperty(None)
employee_screen = ObjectProperty(None)
class CptApp(App):
icon = 'Images\login\cptlogo.png'
title = 'CPT'
def build(self):
return Manager()
if __name__=='__main__':
CptApp().run()
enter code here
.kv file:
#: import Window kivy.core.window.Window
<Manager>:
id: screen_manager
login_screen: login_screen
employee_screen: employee_screen
LogInScreen:
id: login_screen
name: 'login'
manager: screen_manager
FloatLayout:
StackLayout:
orientation: 'lr-tb'
canvas:
Color:
rgba: 1,1,1,1
Rectangle:
pos: self.pos
size: self.size
Image:
size_hint_y: .1
source: 'Images\login\cptbanner.jpg'
allow_stretch: True
keep_ratio: True
Image:
source: 'Images\login\HD7Brw.jpg'
allow_stretch: True
keep_ratio: False
Label:
size_hint_y: .05
size_hint_x: .5
pos_hint: {"x": .25, "y": .7}
markup: True
text: '[i][b][color=#000000]USER NAME[/color][/b][/i]'
TextInput:
id: 'username_input'
multiline: False
size_hint_x: .4
size_hint_y: .05
pos_hint: {"x": .3, "y": .65}
Label:
size_hint_y: .05
size_hint_x: .5
markup: True
text: '[i][b][color=#000000]PASSWORD[/color][/b][/i]'
pos_hint: {'x': .25, 'y': .5}
TextInput:
id: 'password_input'
multiline: False
password: True
size_hint_x: .4
size_hint_y: .05
pos_hint: {'x': .3, 'y': .45}
Image:
source: 'Images/login/loginbutton.png'
size_hint_x: .25
size_hint_y: .1
pos_hint: {'x': .375, 'y': .25}
Button:
id: 'login_button'
background_color: 0,0,0,0
markup: True
text: '[i][b][color=#000000]LOGIN[/color][/b][/i]'
size_hint_x: .25
size_hint_y: .1
pos_hint: {'x': .375, 'y': .25}
on_release: screen_manager.current = 'employeescreen'
EmployeeScreen:
id: employee_screen
name: 'employeescreen'
manager: screen_manager
StackLayout:
orientation: 'lr-tb'
canvas:
Color:
rgba: 1,1,1,1
Rectangle:
pos: self.pos
size: self.size
Image:
size_hint_y: .1
source: 'Images\login\cptbanner.jpg'
allow_stretch: True
keep_ratio: True
ScrollView:
size: (Window.width, Window.height)
MyLayout:
cols: 2
height: self.minimum_height
pos: root.pos
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
Button:
height: 40
size_hint_y: None
text: 'TEST'
enter code here
I want the height of the buttons to be the same as whatever the width is.
You can simply set the width to the same constant like so:
Button:
height: 40
size_hint_y: None
width: 40
size_hint_x: None
text: 'TEST'
This produces perfect squares, but I guess this isn't what you want.
Another very simple thing is to set the button's height to be the same as it's width (literally):
Button:
size_hint_y: None
height: self.width
text: 'TEST'
Which produces a nice result.
.
And, when resized:
Perfect squares still.