SwiftUI按钮文本对齐问题

jpulikkottil

我想这样在手表应用程序中创建UI

在此处输入图片说明

但是信息按钮的文本对齐方式不合适。参见下图:尝试使用文本“ i”和系统映像“ info”,仍然是同一问题

在此处输入图片说明

这是我的代码:

        VStack {
            TextField("User Name", text: $userName)
                .textContentType(.username)
                .multilineTextAlignment(.center)
            SecureField("Password", text: $password)
                .textContentType(.password)
                .multilineTextAlignment(.center)
            Spacer()
            Spacer()
            HStack {
                Button(action: {
                    //action
                }) {
                    Text("Go")
                }.disabled(userName.isEmpty || password.isEmpty)
                    .frame(width: 80, height: 40, alignment: Alignment.bottom)
                Spacer()
                
                VStack {
                    Spacer()
                    Button(action: {
                        //action
                    }) {
                        Image(systemName: "info")
                    }.frame(width: 25, height: 25, alignment: Alignment.bottom)
                        .foregroundColor(.black)
                        .background(Color.white)
                    .clipShape(Circle())
                }
                
            }
        }
他的脾气

您只需删除那些让默认居中对齐生效的框对齐和分隔符即可:

HStack(alignment: .bottom) {   // << here !!
    Button(action: {
        //action
    }) {
        Text("Go")
    }.disabled(userName.isEmpty || password.isEmpty)
        .frame(width: 80, height: 40)

    Spacer()
    
    Button(action: {
        //action
    }) {
        Image(systemName: "info")
    }.frame(width: 25, height: 25)
        .foregroundColor(.black)
        .background(Color.white)
    .clipShape(Circle())
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章