I have a Kivy app that is comprised of 3 rows. The first row is an ActionBar, the second row is a search field and button, and the last row is some text (split into two columns). My problem is that the last row of text is "overlapping" the 1st and 2nd rows. Here is a screen grab to illustrate the problem:
I used Paint to alter the image to depict what I'm trying to achieve:
I was following along to the suggestions for using nested layouts here, but I couldn't get it to work properly. Here is my main.py:
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
class ShowActionBar(BoxLayout):
pass
class ShowApp(ShowActionBar):
pass
class MyTestApp(App):
def build(self):
return ShowApp()
if __name__ == "__main__":
MyTestApp().run()
Here is my kv file:
<ShowActionBar>:
ActionBar:
ActionView:
use_seperator: True
ActionPrevious:
title: "Magic Buffet"
with_previous: False
ActionOverflow:
ActionButton:
text: "Settings"
ActionButton:
text: "Log Out"
<ShowApp>:
orientation: "vertical"
BoxLayout:
orientation: "horizontal"
height: "35dp"
size_hint_y: None
TextInput:
height: 30
width: 200
size_hint_y: None
size_hint_x: None
focus: False
multiline: False
hint_text: "What would you like to Eat?"
Button:
height: 30
width: 100
size_hint_y: None
size_hint_x: None
text: "Search Foods"
BoxLayout:
orientation: "horizontal"
MenuLeftColumn:
MenuRightColumn:
# Blank label to fill out the remaining bottom space
Label:
<MenuLeftColumn@BoxLayout>:
orientation: "vertical"
BoxLayout:
orientation: "horizontal"
height: 30
width: 400
size_hint_y: None
size_hint_x: None
Label:
text: "Menu Item 1"
font_size: "20dp"
# The same "Menu Item 1" widget is repeated multiple
# times to demonstrate a long list of widgets.
# I've removed it for brevity
BoxLayout:
orientation: "horizontal"
height: 30
width: 400
size_hint_y: None
size_hint_x: None
Label:
text: "Menu Item 1"
font_size: "20dp"
<MenuRightColumn@BoxLayout>:
orientation: "vertical"
BoxLayout:
orientation: "horizontal"
height: 30
width: 400
size_hint_y: None
size_hint_x: None
Label:
text: "Price"
font_size: "20dp"
What is the correct way to stack widgets (nested or otherwise) so that this overlapping behavior is avoided?
Aucun commentaire:
Enregistrer un commentaire