2

我是 Kivy 的新手,我想为我的应用制作一个登录屏幕。我有两个问题。首先,在我的 Gridlayout 中,我有 3 个 MDIconbuttons,无论我尝试什么,它们似乎都无法居中。其次,我想要带有文本“忘记您的密码/用户名?”的 MDLabel。更接近我上面的 MDTextFieldRound,但放置负填充会移动文本,但不会移动按钮行为。

主文件

import kivy 
from kivy.uix.widget import Widget
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.behaviors.button import ButtonBehavior
from kivymd.app import MDApp
from kivymd.theming import ThemeManager

class SignInScreen(Screen):
    pass

class ButtonGrid(ButtonBehavior, BoxLayout):
    pass

class AttendanceApp(MDApp):
    def build(self):
        self.theme_cls.primary_palette = "LightBlue"
        self.theme_cls.accent_palette = "Red"
        return SignInScreen()
    def change_theme(self, primary_palette, accent_palette):
        pass
        #theme_cls = ThemeManager()
    def signin_pressed(self, instance):
        pass

if __name__ == "__main__":
    AttendanceApp().run()

考勤.kv

# Filename: Attendance.kv

#:import utils kivy.utils

#screens

<SignInScreen>
    #change_theme: app.change_theme("Bright Blue", "Red")
    BoxLayout:
        orientation: "vertical"
        pos_hint: {"center_x": .5, "center_y": .75}
        size_hint: .8, 1
        spacing: dp(25)


        MDTextFieldRound:
            id: username
            icon_right: "email"
            helper_text: "Email"
            normal_color: .4, .4, .4, .4

        MDTextFieldRound:
            id: password
            icon_right: "key"
            helper_text: "Password"
            password: True
            normal_color: .4, .4, .4, .4

        ButtonGrid:
            size_hint: .9, None
            height: 10
            pos_hint: {"center_x": .5}
            on_press: print(self.pos)

            BoxLayout:

                MDLabel:
                    valign: "top"
                    text: "Forgot your password/username?"
                    halign: "center"
                    theme_text_color: "Custom"
                    font_style: "Caption"
                    text_color: .4, .4, .4, .4

        MDFillRoundFlatButton:
            text: "Sign In"
            custom_color: .17, .24, .98, 1
            pos_hint: {"center_x": .5}

        BoxLayout:
            size_hint: .9, None
            height: 25
            pos_hint: {"center_x": .5}
            padding: 0, 0, 0, -50

            MDLabel:
                text: "Or sign in with"
                halign: "center"
                theme_text_color: "Custom"
                font_style: "Caption"
                text_color: .4, .4, .4, 1


        GridLayout:
            padding: 0, 10, 0, 0
            spacing: dp(25)
            size_hint: 1, None
            height: 1
            cols: 3
            halign: "center"
            canvas:

                Color:
                    rgba: .4, .4, .4, 1

                Rectangle:
                    size: self.size
                    pos: self.pos

            MDIconButton:
                icon: "google"
                user_font_size: "32sp"
                elevation_normal: 12
                md_bg_color: .4, .4, .4, .2

            MDIconButton:
                icon: "facebook-box"
                user_font_size: "32sp"
                elevation_normal: 12
                md_bg_color: .4, .4, .4, .2

            MDIconButton:
                icon: "twitter"
                user_font_size: "32sp"
                elevation_normal: 12
                md_bg_color: .4, .4, .4, .2

现在应用程序看起来像这样: 应用程序屏幕登录

4

1 回答 1

1

具有MDIconButton固定大小,并且GridLayout将根据宽度设置其列宽MDIconButton,最终将所有列放在MDIconButtons左侧。

您可以使用AnchorLayout没有固定大小的 来包含每个MDIconButton. 将AnchorLayouts各自获得相同的GridLayout宽度份额,并且默认情况下,将其内容放置在其区域的中心。

我已将其更改GridLayout heightself.minimum_height,因此它height根据孩子进行计算heights。并canvas更改指令以处理此问题。

    GridLayout:
        padding: 0, 10, 0, 0
        spacing: dp(25)
        size_hint: 1, None
        height: self.minimum_height
        cols: 3
        canvas:
            Color:
                rgba: .4, .4, .4, 1
            Rectangle:
                size: self.width, 1
                pos: self.x, self.y+self.height-1

        AnchorLayout:
            size_hint_y: None
            height: but1.height
            MDIconButton:
                id: but1
                icon: "google"
                user_font_size: "32sp"
                elevation_normal: 12
                md_bg_color: .4, .4, .4, .2

        AnchorLayout:
            size_hint_y: None
            height: but2.height
            MDIconButton:
                id: but2
                icon: "facebook-box"
                user_font_size: "32sp"
                elevation_normal: 12
                md_bg_color: .4, .4, .4, .2

        AnchorLayout:
            size_hint_y: None
            height: but3.height
            MDIconButton:
                id: but3
                icon: "twitter"
                user_font_size: "32sp"
                elevation_normal: 12
                md_bg_color: .4, .4, .4, .2
于 2020-07-22T23:25:15.060 回答