I was trying to show a scrollable text, so I put 3 MDLabel in a MDBoxLayot and put it in a ScrollView. Here is the KV string:
KV = '''
MDBoxLayout:
orientation: "vertical"
MDToolbar:
title: "Toolbar"
ScrollView:
MDBoxLayout:
orientation: "vertical"
size_hint_y: None
MDLabel:
text: "title"
font_size: 27
size_hint_y: None
MDLabel:
text: "description"
font_size: 20
size_hint_y: None
MDLabel:
text: "text"
size_hint_y: None
'''
When I run it I can't see the title and description, only the text, and when I scroll up, it goes back and I can only see the text again. How do I fix that?
By setting the height of the MDBoxLayout to self.minimum_height, it will take the height of its contents. This will ensure the labels fit correctly inside it.
MDBoxLayout:
orientation: "vertical"
MDToolbar:
title: "Toolbar"
ScrollView:
MDBoxLayout:
orientation: "vertical"
size_hint_y: None
# sets the height of the BoxLayout to the height of its contents
height: self.minimum_height
MDLabel:
text: "title"
font_size: 27
size_hint_y: None
MDLabel:
text: "description"
font_size: 20
size_hint_y: None
MDLabel:
text: "text"
size_hint_y: None
Related
I'm trying to use this id "self.ids.input_tornillo.text" and put it inside a variable in my main.py but when running this code I got this Error: "NameError: name 'self' is not define". I think the word self just work inside a function. But I don't know if it really necessary create a funcion for this or I can do it in another way. Pls someone can give me a hand? -
main.py
class FirstWindow(Screen):
#Variables Shopping Cart
var1= StringProperty("images/shoppingcart.png")
var2= StringProperty("images/shoppingcart2.png")
#Variables Items
variable= self.ids.input_tornillo.text
#Here is the problem with self, How can I put it in a variable?
main.kv
<FirstWindow>:
name: "Catalogue"
BoxLayout:
orientation:'vertical'
pos_hint: {'top': 1}
size: root.width, root.height
size_hint_y: .55
GridLayout:
size:(root.width, root.height)
size_hint_x: None
size_hint_y: None
cols:4
height: self.minimum_height
Label:
text: "Items"
#font_size: 25
Label:
text: "Number"
Label:
text: "Price"
Label:
text: "Add to Cart"
ScrollView:
size_hint_y: .80
pos_hint: {'x':0, 'y': .11}
do_scroll_x: True
do_scroll_y: True
GridLayout:
size:root.width, root.height
size_hint_x: None
size_hint_y: None
cols:4
#height: self.minimum_height
#Label:
# text: "Items"
#font_size: 25
#Label:
# text: "Number"
#Label:
# text: "Price"
#Label:
# text: "Add to Cart"
Label:
text: "Tornillos"
text_size: self.size
halign: 'center'
valign: 'bottom'
Image:
id: image_tornillos
allow_stretch: True
keep_ratio: True
size_hint: 0.2,0.2
width: 60
height: 80
#pos_hint: {'center_x':1, 'center_y':1}
source: "images/tornillo.png"
center_x: self.parent.center_x
center_y: self.parent.center_y+10
TextInput:
id: input_tornillo #I need to put this id in a variable in my main.py
text: ""
halign: "right"
font_size: 18
multiline: True
#size_hint: (1, .15)
I was thinking create a function too and make it like this
class FirstWindow(Screen):
#Variables Shopping Cart
var1= StringProperty("images/shoppingcart.png")
var2= StringProperty("images/shoppingcart2.png")
#Variables Items
def list_items(self):
tornillo= self.ids.input_tornillo.text
tornillo1= float(tornillo) * 0.10
tornillo2= str(tornillo1)
but I don't how to call my variable "tornillo2" in my main.kv either
TextInput:
id: input_tornillo
text: ""
halign: "right"
font_size: 18
multiline: True
#size_hint: (1, .15)
Label:
id: label_tornillo
#text: root.ids.input_tornillo.text*2
text: root.tornillo2
root.tornillo2 is giving me this error...
AttributeError: 'FirstWindow' object has no attribute 'tornillo2'
In the python code, define a property for the variable "tornillo2"
tornillo2 = StringProperty("")
Now you can use it in the kv file as you did it already
(text: root.tornillo2)
I am trying to add a boxlayout to a screen with a boxlayout already, but the contents of the second boxlayout keeps overlaying the contents of the first layout.
I don't think it's my indentation, is there a code I am missing, or anything.
I want the content of the second boxlayout to come last of course. I will really appreciate any help, Thanks in Advance.
here's my code:
from kivy.lang import Builder
from kivymd.app import MDApp
from kivy.core.window import Window
Window.size = (300, 530)
KV = """
MDScreen:
MDBoxLayout:
orientation: 'vertical'
ScrollView:
MDGridLayout:
cols: 1
adaptive_height: True
padding: '10dp', '15dp'
spacing: '15dp'
MDCard:
orientation: 'vertical'
size_hint: 1, None
height: label1.height
# size: 280, 200
MDLabel:
id: label1
markup: True
padding: [15, 1]
size_hint_y: None
height: self.texture_size[1] + 2*self.padding[1]
text:
'''
[size=25][b]Ford[/b][/size]
[b][i]“Make every detail perfect and limit the number of details to perfect.[/b][/i]”
– Jack Dorsey\n
'''
MDCard:
orientation: 'vertical'
size_hint: 1, None
# size: 280, 200
height: label2.height
MDLabel:
id: label2
markup: True
padding: [15, 5]
size_hint_y: None
height: self.texture_size[1] + 2*self.padding[1]
text:
'''
[size=25][b]Ford[/b][/size]
[b][i]“Make every detail perfect and limit the number of details to perfect.[/b][/i]”
– Jack Dorsey\n
'''
MDCard:
orientation: 'vertical'
size_hint: 1, None
# size: 280, 200
height: label2.height
MDLabel:
id: label2
markup: True
padding: [15, 5]
size_hint_y: None
height: self.texture_size[1] + 2*self.padding[1]
text:
'''
[size=25][b]Ford[/b][/size]
[b][i]“Make every detail perfect and limit the number of details to perfect.[/b][/i]”
– Jack Dorsey\n
'''
MDBoxLayout:
orientation: 'vertical'
ScrollView:
MDGridLayout:
cols: 9
spacing: '10dp'
padding: ['10dp', '10dp']
MDCard:
ripple_behavior: True
orientation: 'vertical'
size_hint: None, None
size: "250dp", "180dp"
elevation: 15
radius: 15
caption: 'Hello dear'
Image:
allow_stretch: True
keep_ratio: False
size_hint_y: 1
source: "C:/Users/HP USER/Downloads/bella_baron.jpg"
MDCard:
ripple_behavior: True
orientation: 'vertical'
size_hint: None, None
size: "250dp", "180dp"
elevation: 15
radius: 15
caption: 'Hello dear'
Image:
allow_stretch: True
keep_ratio: False
size_hint_y: 1
source: "C:/Users/HP USER/Downloads/bella_baron.jpg"
MDCard:
ripple_behavior: True
orientation: 'vertical'
size_hint: None, None
size: "250dp", "180dp"
elevation: 15
radius: 15
caption: 'Hello dear'
Image:
allow_stretch: True
keep_ratio: False
size_hint_y: 1
source: "C:/Users/HP USER/Downloads/bella_baron.jpg"
"""
class Example(MDApp):
def build(self):
return Builder.load_string(KV)
Example().run()
From Kivy docs:
The class RelativeLayout behaves just like the regular
FloatLayout except that its child widgets are positioned
relative to the layout.
You have to put everything inside a BoxLayout to override the default RelativeLayout behaviour of MDScreen:
from kivy.lang import Builder
from kivymd.app import MDApp
from kivy.core.window import Window
Window.size = (300, 530)
KV = """
<MyImageCard#MDCard>
source: ''
caption:''
ripple_behavior: True
orientation: 'vertical'
size_hint: None, None
size: "250dp", "180dp"
elevation: 15
radius: 15
padding: "8dp"
MDLabel:
text: root.caption
theme_text_color: "Secondary"
adaptive_height: True
MDSeparator:
height: "1dp"
Image:
allow_stretch: True
keep_ratio: False
size_hint_y: 1
source: root.source
<MyTextCard#MDCard>:
text:""
orientation: 'vertical'
size_hint: 1, None
height: child_label.height
MDLabel:
id: child_label
markup: True
padding: [15, 1]
size_hint_y: None
height: self.texture_size[1] + 2*self.padding[1]
text:root.text
MDScreen:
image: "C:/Users/HP USER/Downloads/bella_baron.jpg"
text:'[size=25][b]Ford[/b][/size][b][i]\\n"Make every detail perfect and limit the number of details to perfect."[/b][/i] \\n– Jack Dorsey'
MDBoxLayout:
orientation: 'vertical'
size_hint: 1, 1
pos_hint:{"center_x":.5,"center_y":.5}
ScrollView:
MDGridLayout:
cols: 1
adaptive_height: True
padding: '10dp', '15dp'
spacing: '15dp'
MyTextCard:
text:root.text
MyTextCard:
text:root.text
MyTextCard:
text:root.text
MyTextCard:
text:root.text
MyTextCard:
text:root.text
MDBoxLayout:
orientation: 'vertical'
size_hint: 1, None
height: 400
ScrollView:
MDGridLayout:
cols: 3
adaptive_height: True
adaptive_width: True
spacing: '10dp'
padding: ['10dp', '10dp']
MyImageCard:
source: root.image
caption: 'Hello dear'
MyImageCard:
source: root.image
caption: 'Lovely'
MyImageCard:
source: root.image
caption: 'See you'
MyImageCard:
source: root.image
caption: 'Later'
MyImageCard:
source: root.image
caption: 'Forever'
MyImageCard:
source: root.image
caption: 'Good Bye'
"""
class Example(MDApp):
def build(self):
return Builder.load_string(KV)
Example().run()
Also you were missing an indentation level after the second Scrollview, but that was not the source of the problem :)
You can use pos_hint and size_hint to get what I think you want. Start your kv with:
MDScreen:
MDBoxLayout:
size_hint: 1, 0.5 # use half the available height of the MDScreen
pos_hint: {'top':1} # position at the top of the MDSCreen
and for the second MDBoxLayout add similar code:
MDBoxLayout:
size_hint: 1, 0.5 # use half the available height of the MDScreen
pos_hint: {'y':0} # position at the bottom of the MDSCreen
I've got three buttons in a box layout in Kivy. I want each of them to have the same fontsize. Is there a way to specify the font size for all widgets within a box layout, instead of having to define the font size in the child widgets?
This box layout's part of the .kv file looks like this
BoxLayout:
id: action_buttons
orientation: "horizontal"
size_hint: 1, None
height: "100dp"
Button:
id: cust_query
text: "Send Custom Query"
font_size: 24
Button:
id: man_query
text: "Manually Check Tables"
font_size: 24
ToggleButton:
id: sched_query
text: "Start Query Schedule"
on_state: root.schedule_switch_state(self)
font_size: 24
Is there a way to do this more like so:
BoxLayout:
id: action_buttons
orientation: "horizontal"
size_hint: 1, None
height: "100dp"
font_size: 24
Button:
id: cust_query
text: "Send Custom Query"
Button:
id: man_query
text: "Manually Check Tables"
ToggleButton:
id: sched_query
text: "Start Query Schedule"
on_state: root.schedule_switch_state(self)
I think I found a solution : font_size: self.parent.font_size
in *.kv
#:kivy 2.0.0
<Main>:
BoxLayout:
id: myboxlayout
orientation: "horizontal"
size: root.size
font_size: 24
Button:
text: "Button 1"
font_size: self.parent.font_size
Button:
text: "Button 2"
font_size: self.parent.font_size
first set a font size for the boxlayout
then point the fontsize of the button to their parent's fontisze
// hope this help : )
My goal is to have Buttons which are completely filled with an image. My screen is split in half. On the right hand side I would like to have nine buttons each completely filled with a different image, all buttons with same dimensions. I would like to reshape those image to fit the button, so the ratio would possibly have to change.
This is how my GUI looks right now. The images do not fit the buttons
I tried several adjustments in my kv file, but right now I am stuck.
This is my kv file.
RadioRoot:
<RadioRoot#BoxLayout>:
BoxLayout:
BoxLayout:
BoxLayout:
orientation: "vertical"
Label:
size_hint_y: 4
text: "info about radio"
BoxLayout:
size_hint_y: 1
BoxLayout:
orientation: "vertical"
BoxLayout:
Button:
text: "Previous"
on_press: root.previous()
Button:
text: "Play/Stop"
on_press: root.play_stop()
Button:
text: "Next"
on_press: root.next()
Button:
size_hint_y: 1
text: "Shutdown"
on_press: root.shutdown()
BoxLayout:
BoxLayout:
orientation: "vertical"
BoxLayout:
Button:
text: "Channel1"
on_press: root.channel(1)
#size_hint_y: None
#size_hint_x: None
Image:
source: 'swr3.png'
size_hint_y: None
size_hint_x: None
y: self.parent.y + .5* self.parent.height -.5 * self.parent.width/self.image_ratio
x: self.parent.x
#heigth: self.parent.width/self.image_ratio
#heigth: self.parent.height
width: self.parent.width
keep_ratio: True
allow_stretch: True
Button:
text: "Channel2"
on_press: root.channel(2)
Image:
source: 'flux.png'
width: self.parent.width
size_hint_y: None
size_hint_x: None
y: self.parent.y + .5* self.parent.height -.5 * self.parent.width/self.image_ratio
x: self.parent.x
keep_ratio: True
allow_stretch: True
Button:
text: "Channel3"
on_press: root.channel(3)
BoxLayout:
Button:
text: "Channel4"
on_press: root.channel(4)
Button:
text: "Channel5"
on_press: root.channel(5)
Button:
text: "Channel6"
on_press: root.channel(6)
BoxLayout:
Button:
text: "Channel7"
on_press: root.channel(7)
Button:
text: "Channel8"
on_press: root.channel(8)
Button:
text: "Channel9"
on_press: root.channel(9)
This is the corresponding python file
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.label import Label
class PhilippsRadioApp(App):
pass
class RadioRoot(BoxLayout):
def previous(self):
print("Previous")
def play_stop(self):
print("Play/Stop")
def next(self):
print("Next")
def shutdown(self):
print("Shutdown")
def channel(self, num):
print("Channel")
if __name__ == '__main__':
PhilippsRadioApp().run()
In your Image tag you are using width but not size ...
try:
Image:
...
size: self.parent.size #I think you can remove the size hints since they don't add anything...
stretch: True #keep this one as well :)
I have been trying to make an app that have many functions associate to one buttons each. This way, if I have 70 buttons I have 70 different functions. I want to add, the respective value, when I click respective button, to a respective variable label (I am using numericproperty). As the change between this functions is only in this numeric value, I would like to make this in a more inteligent way than I did. Have anybody one suggestion of better way to do it without I have to repeat my code? Very thanks everybody, and part of my code is bellow.
.py
class SegundoScreen(Screen):
def __init__(self, **kwargs):
self.name = 'dois'
super(Screen,self).__init__(**kwargs)
def mucarela(self, *args):
screen4 = self.manager.get_screen('carrinho')
screen4.btn1 = BubbleButton(text="Muçarela", font_size='20dp', size_hint=(1,None), background_normal='1.png', background_down='2.png')
screen4.lb1 = Label(text="25,00", font_size='20dp', size_hint=(1,None))
screen4.ids.lb5.value += 25
screen4.ids.grid.add_widget(screen4.btn1)
screen4.ids.grid.add_widget(screen4.lb1)
def catupiry(self, *args):
screen4 = self.manager.get_screen('carrinho')
screen4.btn2 = BubbleButton(text="Catupiry",font_size='20dp', size_hint=(1,None), background_normal='2.png', background_down='1.png')
screen4.lb2 = Label(text="25,00",font_size='20dp', size_hint=(1,None))
screen4.ids.lb5.value += 25
screen4.ids.grid.add_widget(screen4.btn2)
screen4.ids.grid.add_widget(screen4.lb2)
def peru(self, *args):
screen4 = self.manager.get_screen('carrinho')
screen4.btn2 = BubbleButton(text="Peito de peru",font_size='20dp', size_hint=(1,None), background_normal='1.png', background_down='2.png')
screen4.lb2 = Label(text="95,00",font_size='20dp', size_hint=(1,None))
screen4.ids.lb5.value += 35
screen4.ids.grid.add_widget(screen4.btn2)
screen4.ids.grid.add_widget(screen4.lb2)
[...]
and .kv
StackLayout:
orientation: 'tb-lr'
ScrollView:
size_hint: (1, .9)
pos_hint:{'x': .0, 'y': .0}
GridLayout:
cols: 2
padding: 45, 50
spacing: 25, 50
size_hint: (1, 1)
size_hint_y: None
height: self.minimum_height
width: 500
Label:
text: "[b]Escolha[/b]\n[i]Sabor[/i]"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
Label:
text: "[b]Preço\n[/b] [i](R$)[/i]"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
Button:
text: "[b]Muçarela[/b]\n[i]Muçarela, tomate\n e orégano[/i]"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
background_normal:'1.png'
background_down:'2.png'
on_press: root.mucarela()
Label:
text: "25,00"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
Button:
text: "[b]Catupiry[/b]\n[i]Catupiry, azeitona\n e tomate[/i]"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
background_normal:'2.png'
background_down:'1.png'
on_press: root.catupiry()
Label:
text: "25,00"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
Button:
text: "[b]Peito de peru[/b]\n[i]Muçarela, peito de peru\n e tomate[/i]"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
background_normal:'1.png'
background_down:'2.png'
on_press: root.peru()
Label:
text: "35,00"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
Button:
text: "[b]Portuguesa[/b]\n[i]Muçarela, presunto,\n cebola e ovo[/i]"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
background_normal:'2.png'
background_down:'1.png'
on_press: root.portuguesa()
Label:
text: "27,00"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
Button:
text: "[b]Toscana[/b]\n[i]Calabresa moída, muçarela\ne parmesão[/i]"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
background_normal:'1.png'
background_down:'2.png'
on_press: root.toscana()
Label:
text: "35,00"
markup: True
font_size: '20dp'
size_hint_y: None
height: self.texture_size[1]
and I have more one class form that is just one label numericpropertie whose change the value when respective button has clicked. As the change is only in this label, I am locking for how can I take the price value from the text label, and flavor name from the text button. Very thanks.
for your .kv file I recommend using Classes like
<MyButton#Button>:
markup: True
font_size: '20dp'
size_hint_y: None
then in your code you could use instances of MyButton which could minify your code a little bit.