I need to create an autofill app, I have a label and text input on the top, and recycle view on the bottom. However, when I run the program, the recycle view disappears, even though I have set in the string. This app will facilitate searching content by typing the name in the text input and the relevant content will appear in the recycle view, so the user is not required to view through the long list of content.
from kivy.app import App
from kivy.lang import Builder
from kivy.core.window import Window
from kivy.uix.recycleview import RecycleView
from kivy.uix.boxlayout import BoxLayout
Window.size = (350, 600)
Builder.load_string('''
<MyLayout>:
BoxLayout:
orientation: "vertical"
spacing: 10
padding: 10
Label :
text : 'Favourite Pizza'
TextInput :
font_size: 30
focus: True
multiline : False
<RV>:
RecycleBoxLayout:
viewclass: 'TextInput'
default_size: None, 30
default_size_hint: 1, None
size_hint_y: .8
height: self.minimum_height
orientation : 'vertical'
''')
class MyLayout(BoxLayout):
pass
class RV(RecycleView):
def __init__(self, **kwrgs):
super(RV, self).__init__(**kwrgs)
content = ["Pepperoni", "Cheese","Papper", "Hawaii", "Seafood",
"Ham", "Taco", "Onion"]
self.data = [{'text':item} for item in content]
print(content)
class MainApp(App):
title='Search App'
def build(self):
Window.clearcolor = (51/255, 153/255, 1, 1)
return MyLayout()
MainApp().run()
What should I do in order to get a complete view (label, text input & recycle view)? I want to type an input text, the relevant content will appear in the recycle view, can I use recycle view to achieve this purpose? Can I use both BoxLayout and the RecycleBoxLayout at the same time, since it refers to the different widgets?
First of all, dynamic classes must be in the same level as root.
Secondly in order to make RecycleView grow vertically, here, you have to set size_hint_y of RecycleBoxLayout to None. Thus your kvlang should now look like,
<MyLayout>:
BoxLayout:
orientation: "vertical"
spacing: 10
padding: 10
Label :
text : 'Favourite Pizza'
TextInput :
font_size: 30
focus: True
multiline : False
RV:
<RV>:
viewclass: 'TextInput'
RecycleBoxLayout:
default_size: None, 30
default_size_hint: 1, None
size_hint_y: None
height: self.minimum_height
orientation : 'vertical'
Related
How can I make a RecycleView in a Kivy python app display all its labels without truncating the text contents of the label nor adding huge spaces in-between the labels?
I'm trying to display a very large amount of text in a Kivy (5+ MB) without causing it to lock-up. I think objectively the best solution here is to use a RecycleView with each line of the text in its own Label.
Official Documentation Demo
The example given in the official Kivy documentation about RecycleView is fine because the amount of text in the label is extremely short.
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.recycleview import RecycleView
Builder.load_string('''
<RV>:
viewclass: 'Label'
RecycleBoxLayout:
default_size: None, dp(56)
default_size_hint: 1, None
size_hint_y: None
height: self.minimum_height
orientation: 'vertical'
''')
class RV(RecycleView):
def __init__(self, **kwargs):
super(RV, self).__init__(**kwargs)
self.data = [{'text': str(x)} for x in range(100)]
class TestApp(App):
def build(self):
return RV()
if __name__ == '__main__':
TestApp().run()
Demo with content
But if we update the example above so that the text in the label is actually substantial, mimicking real-world text, then the contents of the label's text gets truncated. And there's a huge space in-between each label.
import random
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.recycleview import RecycleView
Builder.load_string('''
<RV>:
viewclass: 'Label'
scroll_type: ['bars','content']
bar_width: dp(25)
RecycleBoxLayout:
default_size: None, dp(56)
default_size_hint: 1, None
size_hint_y: None
height: self.minimum_height
orientation: 'vertical'
''')
class RV(RecycleView):
def __init__(self, **kwargs):
super(RV, self).__init__(**kwargs)
self.data = [{'text': str(self.get_random())} for x in range(100)]
def get_random(self):
# generate some random ASCII content
random_ascii = ''.join( [random.choice('0123456789abcdefghijklnmnoqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ') for i in range(0,900)] )
random_ascii = 'START|' + random_ascii + '|END'
print( random_ascii)
return random_ascii
class TestApp(App):
def build(self):
return RV()
if __name__ == '__main__':
TestApp().run()
Demo with content and 'text_size'
I've tried setting the text_size of the Label. That certainly displays much more of the text, but it's still not showing all of the text in each Label.
In this example, the gap between each label is now gone.
import random
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.recycleview import RecycleView
Builder.load_string('''
<MyLabel#Label>:
text_size: self.size
<RV>:
viewclass: 'MyLabel'
scroll_type: ['bars','content']
bar_width: dp(25)
RecycleBoxLayout:
default_size: None, dp(56)
default_size_hint: 1, None
size_hint_y: None
height: self.minimum_height
orientation: 'vertical'
''')
class RV(RecycleView):
def __init__(self, **kwargs):
super(RV, self).__init__(**kwargs)
self.data = [{'text': str(self.get_random())} for x in range(100)]
def get_random(self):
# generate some random ASCII content
random_ascii = ''.join( [random.choice('0123456789abcdefghijklnmnoqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ') for i in range(0,900)] )
random_ascii = 'START|' + random_ascii + '|END'
print( random_ascii)
return random_ascii
class TestApp(App):
def build(self):
return RV()
if __name__ == '__main__':
TestApp().run()
How can I display a vertical RecycleView of Labels such that the text contents of the Labels is not truncated, and there is no extra padding/margin between each row of Labels?
If you want the Label to stretch up as its text content, you can bind its width to its texture width. This will enable you to scroll horizontally within RecycleView. Again if you want to scroll vertically, you need to explicitly specify the height of each content (here Label).
Here's a modified version (of the last one) of your kvlang,
<MyLabel#Label>:
size_hint_x: None
width: self.texture_size[0]
# Canvas added for visual purpose.
canvas.before:
Color:
rgb: 0.5, 0.5, 1
Rectangle:
size: self.size
pos: self.pos
<RV>:
viewclass: 'MyLabel'
scroll_type: ['bars','content']
bar_width: dp(25)
RecycleBoxLayout:
spacing: dp(1) # Adjust to your need (atyn).
padding: dp(2) # atyn.
default_size: None, dp(20) # atyn.
default_size_hint: None, None
size_hint: None, None
size: self.minimum_size
orientation: 'vertical'
Depending on the sample size (due to hardware) it may or may not be able to render the text. If so, try with smaller sample size (like in your examples 500/600 instead of 900).
I'm creating an mp3 player using kivy recycleview, the app has a lot of buttons in the playlist screen and whenever you click on a button, icon of that button change from 'play' to 'pause' and vice versa.
I would like to know how to make it be in a way that clicking another button changes all the other buttons icon to 'play' only that selected button should be with icon of 'pause'.
.py file:
from kivy.lang import Builder
from kivymd.app import MDApp
from kivy.core.window import Window
from kivy.properties import StringProperty, ObjectProperty
from kivymd.theming import ThemableBehavior
from kivymd.uix.boxlayout import MDBoxLayout
from kivymd.uix.screen import MDScreen
from kivymd.uix.behaviors import RectangularRippleBehavior
from kivy.uix.behaviors import ButtonBehavior
from kivy.clock import Clock
Builder.load_file('playlist.kv')
KV = """
#:import FadeTransition kivy.uix.screenmanager.FadeTransition
ScreenManager:
transition: FadeTransition()
Playlist:
name: "playlist screen"
"""
class Playlist(ThemableBehavior, MDScreen):
rv = ObjectProperty()
def __init__(self, **kwargs):
super().__init__(**kwargs)
Clock.schedule_once(self._finish_init)
def music_list(self):
return ['audio '+str(i) for i in range(1, 121)]
def _finish_init(self, dt):
self.set_list_musics()
def set_list_musics(self):
"""Builds a list of audios for the screen Playlist."""
print(self.ids)
def add_music_item(num, sura, secText, icon):
self.ids.rv.data.append(
{
"viewclass": "MusicListItem",
"number": num,
"text": sura,
"secondary_text": secText,
"icon": icon,
"callback": lambda x:x})
for i in range(len(self.music_list())):
music = self.music_list()
add_music_item(str(i+1), music[i], '00:00:00', 'play')
class MusicListItem(ThemableBehavior, RectangularRippleBehavior, ButtonBehavior, MDBoxLayout):
text = StringProperty()
secondary_text = StringProperty()
number = StringProperty()
icon = StringProperty()
def on_release(self, *args):
if self.icon == "play":
self.icon = "pause"
else:
self.icon = "play"
class Mp3Player(MDApp):
def __init__(self, **kwargs):
super().__init__(**kwargs)
def build(self):
self.theme_cls.primary_palette = "Purple"
self.theme_cls.theme_style = "Dark"
return Builder.load_string(KV)
if '__main__' == __name__:
Mp3Player().run()
.kv file:
#: import gch kivy.utils.get_color_from_hex
#: import StiffScrollEffect kivymd.effects.stiffscroll.StiffScrollEffect
<Playlist>
md_bg_color: gch("#5D1049")
MDGridLayout:
cols: 1
MDToolbar:
left_action_items: [["menu", lambda x: x]]
right_action_items: [["magnify", lambda x: x]]
elevation: 10
md_bg_color: 75/255, 6/255, 54/255, 1
title: 'Playlist'
pos_hint: {'top':1}
MDBoxLayout:
orientation: 'vertical'
RecycleView:
id: rv
effect_cls: 'ScrollEffect'
viewclass: 'MusicListItem'
RecycleBoxLayout:
padding: dp(10)
default_size: None, dp(60)
default_size_hint: 1, None
size_hint_y: None
height: self.minimum_height
orientation: 'vertical'
<MusicListItem>
size_hint_y: None
padding: dp(14)
height: dp(60)
canvas:
Color:
rgba:
self.theme_cls.divider_color
Line:
points: (root.x+dp(10), root.y, root.x+self.width-dp(10)-0, root.y)
MDBoxLayout:
orientation: "horizontal"
pos_hint: {"center_x": .5, "center_y": .5}
MDBoxLayout:
orientation: 'horizontal'
MDBoxLayout:
orientation: 'vertical'
size_hint_x: .2
MDLabel:
text: root.number
font_style: "H6"
adaptive_height: True
MDLabel:
size_hint_y: .3
MDBoxLayout:
orientation: 'vertical'
MDLabel:
text: root.text
font_style: "Subtitle2"
adaptive_height: True
MDLabel:
text: root.secondary_text
font_style: "Caption"
theme_text_color: "Hint"
adaptive_height: True
MDIconButton:
icon: root.icon
Thank you
So, as I've understood, you want to set an icon as 'pause' while all other as 'play'. One way of doing this could be like, you have to reload the RecyclView data each time the icon changes.
Now to provide data with icon reference (i.e. 'play' or 'pause') I found the number property suitable, so I change it to NumericProperty. Thus number = NumericProperty().
Also this requires some change in kv,
MDLabel:
text: str(int(root.number))
font_style: "H6"
adaptive_height: True
To let Playlist know about the number reference,
def set_list_musics(self, music_no = 0):
"""Builds a list of audios for the screen Playlist."""
print(self.ids)
self.ids.rv.data = [ ] # Since you are appending data and we need to reload everytime.
Make required changes in data,
for i in range(len(self.music_list())):
new_icon = 'pause' if i+1 == music_no else 'play'
music = self.music_list()
add_music_item(str(i+1), music[i], '00:00:00', new_icon)
Now the final part, trigger the change via the button,
def on_release(self, *args):
if self.icon == "play":
self.icon = "pause"
pl = self.parent.parent.parent.parent.parent # Accessing the Playlist according to your design pattern.
pl.set_list_musics(self.number)
else:
self.icon = "play"
Note that I made this change in 'pause' icon (i.e. in if self.icon == "play"), thus you can also freely toggle this icon. Placing it otherwise could not make it possible.
Perhaps this could have been done more systematically with other design styles. I've found some issues with your design pattern. This (such as calling function in for loop repeatedly etc.) may make it a little bit slower as the data increases.
The idea is to create a texting app that works like Messenger. I am having a problem with the chat history which is a "BoxLayer (or GridLayer)" containing all previous text. I want when I insert a new text, it's will appear as a new label or a box and stay below the previous text like this, but when I run the code and insert input text, it's not appearing. I spent hours to find the answer both myself and on the internet, but it's kind of hard for a beginner like me.
.Py file
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.gridlayout import GridLayout
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.button import Button
from kivy.uix.label import Label
from kivy.core.image import Image
from kivy.properties import StringProperty
from kivy.core.window import Window
from kivy.graphics.context_instructions import Color
class MainWidget(Widget):
request = StringProperty("This is a previous text, don't mind")
insert_text = StringProperty("Insert Here")
window_size = (305,400)
refresh_key = False
def __init__(self,**kwargs):
super().__init__(**kwargs)
self.Window_Minimum()
def on_size(self,*args):
print(self.width,self.height)
def on_text_validate(self,widget): #<<<<<<<<<<<<<<<<<<<<<<<<<<< input text
request=widget.text
Chat_history_update().chat_history(request)
def Window_Minimum(self):
Window.minimum_width,Window.minimum_height=self.window_size
class Chat_history_update(BoxLayout):
def __init__(self,**kwargs):
super().__init__(**kwargs)
l = Label(text="This is a previous text, don't mind",size_hint=(1, None),height=("30dp"))
self.add_widget(l)
def chat_history(self,request): # <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< Add Label Function
l = Label(text=request, size_hint=(1, None),height=("30dp"))
self.add_widget(l) # <<<<<<<<<<<<< This won't update my app screen
class Assistant(App):
pass
if __name__ == "__main__":
Assistant().run()
Kv file
MainWidget:
<MainWidget>:
BoxLayout:
size: root.size
orientation: "vertical"
GridLayout:
cols: 3
size_hint: 1,None
height: "50dp"
spacing: "10dp"
padding: "10dp"
Label:
text:"Erza Assistant"
Button:
text:"Edit Path"
Button:
text:"Setting"
GridLayout:
size: self.size
rows: 2
spacing: "10dp"
padding: "10dp"
ScrollView: #<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< Here my text display
Chat_history_update:
orientation: "vertical"
size_hint: 1, None
height: self.minimum_height
TextInput:
size_hint: 1, None
height: "40dp"
text: root.insert_text
multiline: False
on_text_validate: root.on_text_validate(self)
Your code:
Chat_history_update().chat_history(request)
is creating a new instance of Chat_history_update, and calling chat_history() for that new instance. That new instance is not part of your GUI, so you will see no effect. The fix is to access the correct instance of Chat_history_update (the one that is in your GUI). To do that, you can add an id in your kv:
ScrollView: #<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< Here my text display
Chat_history_update:
id: chu
orientation: "vertical"
size_hint: 1, None
height: self.minimum_height
And then use that id in your py code:
def on_text_validate(self,widget): #<<<<<<<<<<<<<<<<<<<<<<<<<<< input text
request=widget.text
self.ids.chu.chat_history(request)
I think this here might help. You have to reference widgets in the kivy language by using id or ids.
If you do not yet i strongly suggest you learn how to reference widgets by their ids.
I am making a selection app. I am using a spinner for multiple choises. After spinner selection I want to add 3 different buttons, which are related to spinner selection. In every selection in spinner those old buttons replace with new ones.
So far I can add different buttons after every selection. However, the buttons are keep adding. I need to clear the old buttons first after every spinner selection.
My class, which contains buttons is "ModelSpecifications".
Long story short, there is something wrong in clear_widgets(). It cant reach "ModelSpecifications".
Here is my main.py;
from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.uix.widget import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.scrollview import ScrollView
from kivy.uix.spinner import Spinner
from kivy.uix.button import Button
from kivy.uix.label import Label
from kivy.properties import ObjectProperty, StringProperty, BooleanProperty
from kivy.properties import ListProperty
from collections import OrderedDict
data1=["mother","father","son"]
data2=["uncle","aunt","grandfather"]
data3=["jack","mike","simon"]
data4=["1898","1975","1985","1885"]
class MainWidget(Widget):
an0=tuple(list(OrderedDict.fromkeys(data1)))
cal5= ObjectProperty()
def btn10(self,text):
#----------here is the part I want to clear the buttons first:
#ModelSpecifications.clear_widgets(ModelSpecifications)
# or
#self.ids["anss"].clear_widgets()
# after that I will add new buttons:
self.cal5 =ModelSpecifications()
a=data2
b=data3
c=data4
mi=[]
n=0
while n < len(a):
aba=(str(a[n])+"\n"+str(b[n])+"\n"+str(c[n]))
mi.append(aba)
n+=1
for i in mi:
self.b1=Button(text=str(i),size_hint=(1,None),height="100dp")
self.cal5.add_widget(self.b1)
self.ids.scd.add_widget(self.cal5, index=3) #here id.scd is the class that ModelSpecifications class is added. And it works fine.
class SecondPage(ScrollView):
pass
class ModelSpecifications(BoxLayout): #this is the class I want add after my spinner selection
pass
class Calculation(GridLayout):
pass
class MyApp(App):
pass
MyApp().run()
And here is my.kv ;
MainWidget:
<MainWidget>:
ScreenManager:
id: scmanager
size: root.width, root.height
Screen:
id: scndpage
name: "second"
SecondPage:
Calculation:
id:scd
cols:1
height: self.minimum_height
row_default_height: "70dp"
size_hint_y: None
spacing:"10dp"
canvas.before:
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
size_hint: 1, None
height: "50dp"
pading:"10dp"
spacing:"10dp"
orientation: "vertical"
BoxLayout:
orientation: "horizontal"
Label:
text:"Name:"
color: 0,0,0,1
TextInput:
text:"---"
color: 0,0,0,1
Label:
text:"Surname:"
color: 0,0,0,1
TextInput:
text:"-----"
color: 0,0,0,1
BoxLayout:
id:scdd
size_hint: 1, 1
height: "100dp"
orientation: "vertical"
BoxLayout:
size_hint: 1, None
height: "50dp"
orientation: "horizontal"
Label:
text: " Sellection:"
color: 0,0,0,1
Spinner:
text: 'Home'
values: root.an0
on_text: app.root.btn10(self.text)
Button:
text:" Calculate"
Button:
text:"Sellect"
Button:
text:"Back"
<ModelSpecifications>:
id:anss #HERE IS MY CLASS THAT I WANT TO CLEAR AND ADD AFTER EVERY SPINNER SELECTION
pading:"10dp"
spacing:"10dp"
size_hint: 1, None
height: "100dp"
orientation: "horizontal"
When you run this code sellect something in spinner. You will see in every selection, app keeps add more buttons;
In your btn10() method, just add:
if self.cal5:
self.cal5.parent.remove_widget(self.cal5)
before the line:
self.cal5 = ModelSpecifications()
I have a ListView containing customized buttons for the listitems. How can I format the scrollbar in such a way that it is always visible (in case there is something to scroll...), make it wider (10 pts instead of the default 2) and give it a different color?
The DoScroll.py file:
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.listview import ListItemButton
class ShowItems(BoxLayout):
def get_list(self):
self.results.item_strings = {"A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"}
def show_capital(self, capital):
print capital
class CapitalButton(ListItemButton):
pass
class DoScrollApp(App):
pass
if __name__ == '__main__':
DoScrollApp().run()
And here is the DoScroll.kv file.
#: import DoScroll DoScroll
#: import ListAdapter kivy.adapters.listadapter.ListAdapter
<CapitalButton>:
text_size: self.width - 50, None
halign: 'left'
valign: 'middle'
font_size: 16
on_press: app.root.show_capital(self.text)
ShowItems:
<ShowItems>:
results: results_list
orientation: "vertical"
BoxLayout:
height: "40dp"
size_hint_y: None
Button:
text: "Get the list"
on_press: root.get_list()
ListView:
id: results_list
adapter:
ListAdapter(data=[], args_converter=lambda row_index,
an_obj: {'text': an_obj,'size_hint_y': None,'height': 40}, cls=DoScroll.CapitalButton)
ListView contains a ScrollView, which in turn holds the GridView holding the list items. The corresponding kv rules are these (from listview.py):
<ListView>:
container: container
ScrollView:
pos: root.pos
on_scroll_y: root._scroll(args[1])
do_scroll_x: False
GridLayout:
cols: 1
id: container
size_hint_y: None
ScrollView has properties bar_width, bar_color, bar_inactive_color. These could be accessed through lv.container.parent.bar_width etc., for lv = ListView().