标签和文本输入对齐斗争

Question

我想将左侧的标签对齐到右对齐，并将右侧的相应项目（标签文本和文本输入）对齐到左侧，以便在视觉上呈现更好的屏幕。

session input screen

以下是屏幕的kv代码：

<SessionInput>:
    name: 'sessionInput'
    BoxLayout:
        spacing: 5
        padding: 5, 5, 0, 5
        canvas.before:
            Color:
                rgba: 0, 0, 1, 1  # blue
            Rectangle:
                pos: self.pos
                size: self.size

        orientation: 'vertical'

        Label:
            id: sessionScreen
            text: 'Session Input Screen'

        GridLayout:
            cols: 2
            Label: 
                id: foodCatLabel
                text: "Selected Food Category: "
            Label:
                id: foodCat
                text: root.foodCategory
            Label:
                id: cutNameLabel
                text: "Selected Cut: "
            Label:
                id: cutName
                text: root.cutName
            Label:
                id: cutWeightLabel
                text: 'Cut Weight:'
            TextInput:
                text: 'Enter cut weight'
                id: cutWeight

            Label:
                id: grillTempLabel
                text: 'Target Grill Temp:'
            TextInput:
                text: 
                id: grillTemp

            Label:
                id: foodTempLabel
                text: 'Target Food Temp:'
            TextInput:
                text: root.foodTemp
                id: foodTemp

            Label: 
                id: prepNoteLabel
                text: 'Food Prep Notes:'
            TextInput:
                text:
                id: prepNote
                multiline: True

        Button:
            text: 'Preview'
            pos_hint: {"center_x": .5, "center_y": .5}
            size_hint: None, None
            size: 75, 50

            on_press: 
                root.manager.get_screen('sessionPreview').Preview(foodCat.text, cutName.text,
                cutWeight.text, grillTemp.text, foodTemp.text, prepNote.text)

        Widget:

我附上了当前显示的屏幕图像。

Answer 1

在您的Labels（在kv）中，您可以添加：

            text_size: self.size
            halign: 'right'
            valign: 'center'

这会设置绘制 Label 文本的框的大小，并允许 halign 和 valign 实际产生效果。

标签和文本输入对齐斗争

Label and Textinput Alignment Struggle

label

alignment

textinput

kivy