正在开发用于费用跟踪的Kivy应用程序.无法对齐网格布局



我正在为自己开发一个费用应用程序。在第二个屏幕中,我想移动"一月"one_answers";year-to-date"上面的标签接近"可用余额";然后移到上面的部分下面。我花了几天时间,但还是找不到解决办法。我在想你是否有人能帮我这个忙。

from kivymd.app import MDApp
from kivy.lang.builder import Builder
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.scrollview import ScrollView
from kivymd.uix.label import MDLabel
from kivy.uix.gridlayout import GridLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.widget import Widget
screen_helper = """
<GoButton>:
Button:
font_size: 12
text: "Search"
background_color: app.theme_cls.primary_color
size_hint: 0.1, 0.05
pos_hint: {'x': 0.2, 'y':0.7}
#on_release: app.run_test()
<MonthYear@MDTextField>:
font_size: 20
hint_text: "Enter Month/Year"
helper_text: "MM/YYYY"
helper_text_mode: 'on_focus'
size_hint: None, None
width:120
ScreenManager:
MainPage:
IndividualExpense:
UploadScreen:
<MainPage>:
name: 'main'
BoxLayout:
orientation: 'vertical'
spacing: '8dp'

MDToolbar:
title: 'Home'
MDLabel:
text: "  Expenses" 
font_style: 'Subtitle1'
size_hint_y: None
height: self.texture_size[1]   

ScrollView:
MDList:
OneLineListItem:
text: 'Cell phone'
OneLineListItem:
text: 'Grocery'


MDToolbar:

left_action_items: [["home", lambda x: app.mainPageScreen()],   ["file-table-outline", lambda x: app.IndivdualExpenseScreen()], ["view-compact", lambda x: app.listOfStocksScreen()],]



<IndividualExpense>:
name: 'indExp'
BoxLayout:
orientation: 'vertical'
spacing: '8dp'
MDToolbar:
title: 'Cell Phone'


GridLayout:
cols: 3
FloatLayout:
MonthYear
pos_hint: {'x':0.025, 'y': .7}
FloatLayout:
Button:
font_size: 14
size_hint: 0.4,0.15
text: "Submit"
background_color: app.theme_cls.primary_color
pos_hint: {"x":0.01, "top":0.93}
GridLayout:
cols: 1
size: root.width-300, root.height-300
FloatLayout:
MDLabel:
text: '  Available Balance'
pos_hint: {'x': 0.0, 'y':1}
GridLayout:
cols: 2
size: root.width-300, root.height-300
FloatLayout:
MDLabel:
text: ' January'
pos_hint: {'x': 0.0, 'y':1}
FloatLayout:
MDLabel:
text: 'Year-to-Date'
pos_hint: {'x': 0.0, 'y':1}
GridLayout:
cols: 1
MDLabel:
text: '  Monthly Budget: '
MDLabel:
text: '  MTD Expense: '
MDLabel:
text: '  YTD Budget: '
MDLabel:
text: '  YTD Expense: '







MDToolbar:

left_action_items: [["home", lambda x: app.mainPageScreen()],   ["file-table-outline", lambda x: app.IndivdualExpenseScreen()], ["view-compact", lambda x: app.listOfStocksScreen()],]


<UploadScreen>:
name: 'upload'
MDLabel:
text: 'Upload'
halign: 'center'
MDRectangleFlatButton:
text: 'Back'
pos_hint: {'center_x':0.5,'center_y':0.1}
on_press: root.manager.current = 'main'

"""

class MainPage(Screen):
pass

class IndividualExpense(Screen):
pass

class UploadScreen(Screen):
pass
class GoButton(FloatLayout):
pass
# Create the screen manager
sm = ScreenManager()
sm.add_widget(MainPage(name='main'))
sm.add_widget(IndividualExpense(name='indExp'))
sm.add_widget(UploadScreen(name='upload'))

class DemoApp(MDApp):
def mainPageScreen(self):
self.root.current = 'main'
self.root.transition.direction = 'left'

def IndivdualExpenseScreen(self):
self.root.current = 'indExp'
self.root.transition.direction = 'right'
def build(self):
screen = Builder.load_string(screen_helper)
return screen

DemoApp().run()

见第二屏

以下是kv<IndividualExpense>:规则的修改版本:

<IndividualExpense>:
name: 'indExp'
BoxLayout:
orientation: 'vertical'
spacing: '8dp'

MDToolbar:
title: 'Cell Phone'

GridLayout:
cols: 4
size_hint_y: 0.15
MonthYear:

Widget:
size_hint_x: 0.3
Button:
font_size: 14
size_hint: 0.3,0.15
text: "Submit"
background_color: app.theme_cls.primary_color

Widget:
size_hint_x: 0.1
GridLayout:
cols: 1
size_hint_y: 0.1
MDLabel:
text: '  Available Balance'
pos_hint: {'x': 0.0, 'y':1}

GridLayout:
cols: 2
size_hint_y: 0.8
MDLabel:
text: ' January'
pos_hint: {'x': 0.0, 'top':1}
size_hint_y: 0.2
MDLabel:
text: 'Year-to-Date'
pos_hint: {'x': 0.0, 'top':1}
size_hint_y: 0.2

GridLayout:
size_hint_y: 0.8
cols: 1
MDLabel:
text: '  Monthly Budget: '
MDLabel:
text: '  MTD Expense: '
MDLabel:
text: '  YTD Budget: '
MDLabel:
text: '  YTD Expense: '
MDToolbar:
left_action_items: [["home", lambda x: app.mainPageScreen()],   ["file-table-outline", lambda x: app.IndivdualExpenseScreen()], ["view-compact", lambda x: app.listOfStocksScreen()],]

我已经删除了几个FloatLayouts,似乎没有任何目的。我还删除了一些size属性(除非size_hintsNone,否则它们没有效果)。由于此规则中的基本布局是BoxLayout,因此该BoxLayout的每个子节点将根据其size_hint_y值分配垂直空间的份额。对GridLayouts采用类似的方法。

最新更新