I want to create a Widget changing only the text of a label inside it, but all the ways I find how to change this are by changing it in the python code instead of reusing only Kivy objects.
So I have a widget like the following:
<AmiLabel#Label>
color: .1, .5, .8, 1
font_size: 16
<AmiTextInput#TextInput>
font_size: 16
<PropertyInputForm>:
BoxLayout:
size: root.size
pos: root.pos
orientation: 'horizontal'
AmiLabel:
text: 'Folder Location'
size_hint_x: .5
AmiTextInput:
text: 'None'
size_hint_x: .5
<MainFormWidget>:
BoxLayout:
size: root.size
pos: root.pos
id: foo_bar
padding: 5
spacing: 5
canvas:
Color:
rgb: (1, 1, 1)
Rectangle:
pos: self.pos
size: self.size
orientation: 'vertical'
AmiLabel:
height: 36
size_hint_x: 1
size_hint_y: None
text: 'Project Name'
PropertyInputForm:
height: 36
size_hint_x: 1
size_hint_y: None
# I WANT TO CHANGE THE TEXT OF THE LABEL IN HERE
PropertyInputForm:
height: 36
size_hint_x: 1
size_hint_y: None
# I WANT TO CHANGE THE TEXT OF THE LABEL IN HERE
All I want to is change the text of the label from another widget in another level without touching the python code.
¿Is that possible?
One simple way would be to add a new property to your PropertyInputForm and reference or set that.
<PropertyInputForm>:
new_text_property: ''
BoxLayout:
size: root.size
pos: root.pos
orientation: 'horizontal'
AmiLabel:
text: root.new_text_property
size_hint_x: .5
AmiTextInput:
text: 'None'
size_hint_x: .5
and later
PropertyInputForm:
height: 36
size_hint_x: 1
size_hint_y: None
new_text_property: 'whatever'
You may also need to declare new_text_property in the python class to have it be a StringProperty rather than an ObjectProperty, though even that is I think not necessary in kivy 1.8.
Related
I've created an app with a main page that is going to have multiple sections with recycleView data. I have added the first but when I try to add a second (eventually adding 4 to replace the APPS, OTHER, etc sections) the second recycleView shows up on top of the first one (see top left of image) instead of next to it like I would expect. I tried putting both of the recycleView widgets inside a boxlayout but the second RV still overlays the top.
The information should be filling the second box on the right here instead of overlaying on the far top left
Screen:
MDNavigationLayout:
ScreenManager:
id: screenManager
Screen:
name: "monitor"
CoverImage:
source: 'images/monitor.png'
# Darken the photo
canvas:
Color:
rgba: 0, 0, 0, .6
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: 'vertical'
MDToolbar:
title: 'Administration'
left_action_items: [["menu", lambda x: nav_drawer.set_state('toggle')]]
elevation:5
BoxLayout:
ServerListWidget:
MountListWidget:
Please let me know if you need to see any additional code. I've also tried using a GridLayout with 2 cols
<MountListWidget>:
id: mountListWidget
recycleView: recycleView_mounts
BoxLayout:
padding: dp(20)
spacing: dp(10)
BoxLayout:
spacing: dp(10)
BoxLayout:
canvas.before:
Color:
rgba: 1,1,1,.1
# Use a float layout to round the corners
RoundedRectangle:
pos: self.pos
size: self.size
RecycleView:
id: recycleView_mounts
viewclass: 'MountWidget'
RecycleGridLayout:
cols: 1
default_size: self.parent.width, dp(60)
default_size_hint: 1, None
size_hint_y: None
height: self.minimum_height
width: self.minimum_width
spacing: dp(155), dp(0)
<ServerListWidget>:
id: serverListWidget
recycleView: recycleView
BoxLayout:
padding: dp(20)
spacing: dp(10)
BoxLayout:
orientation: "horizontal"
BoxLayout:
canvas.before:
Color:
rgba: 1,1,1,.1
# Use a float layout to round the corners
RoundedRectangle:
pos: self.pos
size: self.size
RecycleView:
id: recycleView
viewclass: 'ServerWidget'
RecycleGridLayout:
cols: 1
default_size: self.parent.width / 5, dp(60)
default_size_hint: 1, None
size_hint_y: None
height: self.minimum_height
width: self.minimum_width
spacing: dp(155), dp(0)
<CoverImage#CoverBehavior+Image>:
reference_size: self.texture_size
<MountWidget>:
BoxLayout:
#size_hint_max_x: dp(360)
size_hint_min_x: dp(150)
orientation: "horizontal"
BoxLayout:
orientation: "horizontal"
Button:
# Use the on_press to print troubleshooting info, otherwise comment out
on_press: print(self.background_color)
padding: dp(10), dp(10)
text_size: self.size
font_size: dp(18)
background_color: .5,1,1,.6
halign: "left"
valign: "top"
size: 1,1
text: str(root.name)
bold: True
color: (1,1,1)
<ServerWidget>:
BoxLayout:
#size_hint_max_x: dp(360)
size_hint_min_x: dp(150)
orientation: "horizontal"
BoxLayout:
orientation: "horizontal"
Button:
# Use the on_press to print troubleshooting info, otherwise comment out
on_press: print(self.background_color)
padding: dp(10), dp(10)
text_size: self.size
font_size: dp(22) if root.has_issue else dp(18)
background_color: .5,1,1,.6 #utils.get_random_color(alpha=.6)
halign: "left"
valign: "top"
size: 1,1
# Show last 4 of server name
text: str(root.name).upper()[-4:]
bold: True
color: utils.get_color_from_hex(warn) if root.has_issue else (1,1,1)
Button:
background_color: .5,1,1,.6
text_size: self.size
font_size: dp(22) if root.work >= 85 and root.work < 90 else dp(26) if root.work >= 90 else dp(18)
valign: "center"
halign: "center"
text: str(root.work)
padding: dp(8), dp(8)
bold: True if root.work > 90 else False
# yellow red white
color: (1,1,0) if root.work >= 85 and root.work < 90 else utils.get_color_from_hex(warn) if root.work >= 90 else (1,1,1)
I'm new to designing in kivy and I'm trying to display a listview, inputbox and label inside a Tab panel but it's showing empty panel. I'm not sure where is my mistake.
I want to do a simple search of users by just typing the username in the inputbox then the listview will automatically update the records inside the listview.
I'm using kivy 1.10.0 and python 3.6
Here is my code in kivy file:
<AdminMainScreen#Screen>:#===================MAIN SCREEN=========================
txt_search: txt_search
view_user_list: view_user_list
BoxLayout:
size_hint_y: 1
size_hint_x: 1
canvas:
Color:
rgb: .132, .232, .249
Rectangle:
size: self.size
TabbedPanel:
do_default_tab: False
TabbedPanelItem:
text:"1st Tab"
Label:
text: "Content of Admin Panel"
TabbedPanelItem:
text:"2nd Tab"
Label:
text: "Content of Second Panel"
TabbedPanelItem:
text:"Manage Users"
BoxLayout:
size_hint_y: .2
size_hint_x: 1
orientation: 'horizontal'
Label:
text: "Search User"
size_hint_x: .25
spacing: .2, .2
TextInput:
id: txt_search
text: ""
size_hint_x: .3
spacing: .2, .2
Label:
id: lbl_search
size_hint_y:None
height: 10
text: ""
ListView:
color: [0,0,0]
id: view_user_list
size_hint_x: 1
size_hint_y: .8
item_strings: []
adapters:
ListAdapter(data=[], cls = ListItemButton)
I don't think that having multiple widgets in a TabbedPanelItem is allowed, there is only one child - content. So just put an extra Layout and everything you want in the tab inside that one layout:
BoxLayout: # The only child of panel item
size_hint_y: 1
size_hint_x: 1
orientation: 'horizontal'
BoxLayout:
size_hint_y: 0.2
size_hint_x: 1
orientation: 'horizontal'
Label:
text: "Search User"
size_hint_x: .25
spacing: .2, .2
TextInput:
id: txt_searh
text: ""
size_hint_x: .3
spacing: .2, .2
Label:
id: lbl_search
size_hint_y:None
...
I would like to ask your help.
The scrollable structure under the link is what I want to generate.
As the Scrollview accept only one element, I used a GridLayout. Somehow I cannot put any Boxlayout in the GridLayout.
Could you help me? Did I made a mistake? Should I use maybe an other Layout? if yes, which one?
Thank you.
Here is the output of my .kv file: http://imgur.com/etilRPg
Here is the result, if I change cols:1 to cols:2 : http://imgur.com/ihWla4Y
Here is the code I tried in the .kv file:
#:kivy 1.8.0
RootWidget:
# import container
container: container
# fill container
BoxLayout:
id: container
orientation: 'vertical'
padding: 0
spacing: 3
ScrollView:
size_hint: 1, 1
pos_hint: {'center_x': .5, 'center_y': .5}
GridLayout:
cols: 1
padding: 0
spacing: 3
size_hint: 1, None
height: self.minimum_height
do_scroll_x: False
BoxLayout:
height: 260
orientation: 'horizontal'
canvas.before:
Color:
rgb: 0.7, 0.7, 0.9
Rectangle:
size: self.size
pos: self.pos
BoxLayout:
height: 260
orientation: 'horizontal'
canvas.before:
Color:
rgb: 0.7, 0.7, 0.9
Rectangle:
size: self.size
pos: self.pos
BoxLayout:
height: 260
orientation: 'horizontal'
canvas.before:
Color:
rgb: 0.7, 0.7, 0.9
Rectangle:
size: self.size
pos: self.pos
#type
Label:
height: 260
size_hint: 1, None
text: 'Typ'
BoxLayout:
height: 260
orientation: 'horizontal'
canvas.before:
Color:
rgb: 0.7, 0.7, 0.9
Rectangle:
size: self.size
pos: self.pos
If you want to set height or width or anything else with sizing you need to do something first in a widget you want to set it for:
size_hint: None, None
This will disable setting those properties according to parent's size and some other stuff i.e. number of widgets in parent (three widgets = parent's size / 3 for each) at least for layouts such as BoxLayout or GridLayout. Check docs for more.
Alternatively use size_hint_x: None or size_hint_y: None and let the other part be set automatically if you only want to set one of height or width.
I'm new to Kivy and still working out the best way to use it. Currently, I'm taking an example from their repo (textsize demo) and attempting to use layout concepts in a personal project.
At the end of the day, all I want is a "navbar" at the top of my screen and a content section below it. At the moment, I'm trying to accomplish this with a BoxLayout which includes a StackLayout (nav items) and a GridLayout (other content).
My Code Snippet:
<WindowWidget>:
BoxLayout:
orientation: 'vertical'
StackLayout:
Label:
text: 'Test1'
Label:
text: 'Test1.1'
Label:
text: 'Test2'
This code produces this: Kivy Screenshot.
I don't understand why label 1.1 is pushed down on top of label 2 rather than appearing beside label 1.
I added the following code taken from the kivy examples hoping the height setting would add some clarity, but I get the error below:
Code:
<StackLayout>:
size_hint_y: None
spacing: dp(6)
padding: dp(6), dp(4)
height: self.minimum_height
Error:
Warning, too much iteration done before the next frame. Check your
code, or increase the Clock.max_iteration attribute
This is caused by my inclusion of the "height: self.minimum_height" line. However, this works in the demo, so I'm not sure how I managed to screw it up. I'll include the example's kv code below for reference.
The original:
BoxLayout:
orientation: 'vertical'
HeadingLabel:
text: 'These modify all demonstration Labels'
StackLayout:
# Button is a subclass of Label and can be sized to text in the same way
Button:
text: 'Reset'
on_press: app.reset_words()
ToggleButton:
text: 'Shorten'
on_state:
app.shorten=self.state=='down'
ToggleButton:
text: 'max_lines=3'
on_state:
app.max_lines=3 if self.state=='down' else 0
Spinner:
text: 'bottom'
values: 'bottom', 'middle', 'top'
on_text: app.valign=self.text
Spinner:
text: 'left'
values: 'left', 'center', 'right', 'justify'
on_text: app.halign=self.text
GridLayout:
id: grid_layout
cols: 2
height: cm(6)
size_hint_y: None
HeadingLabel:
text: "Default, no text_size set"
HeadingLabel:
text: 'text_size bound to size'
DemoLabel:
id: left_content
disabled_color: 0, 0, 0, 0
DemoLabel:
id: right_content
text_size: self.size
padding: dp(6), dp(6)
ToggleButton:
text: 'Disable left'
on_state:
left_content.disabled=self.state=='down'
# Need one Widget without size_hint_y: None, so that BoxLayout fills
# available space.
HeadingLabel:
text: 'text_size width set, size bound to texture_size'
text_size: self.size
size_hint_y: 1
DemoLabel:
id: bottom_content
# This Label wraps and expands its height to fit the text because
# only text_size width is set and the Label size binds to texture_size.
text_size: self.width, None
size: self.texture_size
padding: mm(4), mm(4)
size_hint_y: None
# The column heading labels have their width set by the parent,
# but determine their height from the text.
<HeadingLabel#Label>:
bold: True
padding: dp(6), dp(4)
valign: 'bottom'
height: self.texture_size[1]
text_size: self.width, None
size_hint_y: None
<ToggleButton,Button>:
padding: dp(10), dp(8)
size_hint: None, None
size: self.texture_size
# This inherits Button and the modifications above, so reset size
<Spinner>:
size: sp(68), self.texture_size[1]
<DemoLabel#Label>:
halign: app.halign
valign: app.valign
shorten: app.shorten
max_lines: app.max_lines
canvas:
Color:
rgb: 68/255.0, 164/255.0, 201/255.0
Line:
rectangle: self.x, self.y, self.width, self.height
<StackLayout>:
size_hint_y: None
spacing: dp(6)
padding: dp(6), dp(4)
height: self.minimum_height
TYIA
I'm usng kivy and the kv languge to make a GUI, I'm still only new to kivy.
In the image below the the buttons were in the black bit on the right side of the GUI but the scrollview buttons on fitted half of the height of the screen to I put an extra floatlayout in the rule and indented everything but now all the buttons are on the wrong side of the screen.
#:kivy 1.9.0
GridLayout:
rows: 1
LeftArea:
RightArea:
<LeftArea#FloatLayout>:
canvas:
Color:
rgb: 0, 1, 0
Rectangle:
size: self.size
pos: self.pos
Image:
source: 'moneyswags.gif'
size: self.size
pos: self.pos
<RightArea#GridLayout>:
cols: 1
size_hint_x: 0.3
spacing: '10dp'
FloatLayout:
ScrollView:
LinksGrid:
id: links_grid
BoxLayout:
cols: 1
rows: 2
GetLinksButton:
links_grid: links_grid
Clearlinkbuttons:
links_grid: links_grid
<LinksGrid#GridLayout>:
cols: 1
spacing: '5dp'
size_hint_y: None
height: self.minimum_height
<GetLinksButton>:
size_hint_y: 0.1
text: 'get links'
on_press: self.get_links()
<Clearlinkbuttons>:
size_hint_y: 0.1
text: 'clear links'
on_press: self.clear_links()
<LinkButton>:
size_hint_y: None
height: '80dp'