SwiftUI，水平堆栈中的按钮在构建项目时不呈现
[英]SwiftUI, buttons in horizontal stack not rendering when building project
问题描述
出于某种原因，当我在 SwiftUI 的预览/画布窗格中“恢复”我的代码时，我可以清楚地看到我的社交媒体按钮，但是当我通过按下将我带到单独的模拟器的构建按钮运行代码时，我没有查看我的社交媒体按钮。 在过去的 2 天里，我一直坚持这个问题，不确定这是否是新 SwiftUI 的错误。
注意：我在当前页面的另一个页面中调用了一个 navigationLink。
请看前者的例子：
请查看错误渲染的示例（使用 command + R）：
请看下面的实际代码。
import SwiftUI
struct CreateAccountView: View {
@State var username: String = ""
@State var password: String = ""
@State var passwordVerify: String = ""
@State private var showPassword = false
@State private var showPasswordVerify = false
@State private var current: Int? = nil
var body: some View {
NavigationView{
GeometryReader { (deviceSize: GeometryProxy) in
ZStack {
//Define a screen color
LinearGradient (gradient: Gradient(colors:[Color(ColorsSaved.gitLabDark),Color(ColorsSaved.gitLabLight)]),startPoint: .leading,endPoint: .trailing)
//Extend the screen to all edges
.edgesIgnoringSafeArea(.all)
VStack {
Text ("Create Account")
.foregroundColor(.white)
.fontWeight(.bold)
.padding ()
Group {
HStack {
Image ("user")
.resizable ()
.scaledToFit()
.padding (10)
TextField("Username", text: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Value@*/.constant("")/*@END_MENU_TOKEN@*/)
.padding(12)
.padding (.leading, -10)
.padding(.leading, -3)
Spacer ()
} .padding (.leading, 10)
Spacer ()
HStack {
Image ("mail")
.resizable ()
.scaledToFit()
.padding (10)
TextField("Email", text: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Value@*/.constant("")/*@END_MENU_TOKEN@*/)
.padding(12)
.padding (.leading, -10)
.padding(.leading, -3)
} .padding (.leading, 10)
Spacer()
HStack {
Image ("phone")
.resizable ()
.scaledToFit()
.padding (10)
TextField("Phone", text: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Value@*/.constant("")/*@END_MENU_TOKEN@*/)
.padding(12)
.padding (.leading, -10)
.padding(.leading, -3)
} .padding (.leading, 10)
Spacer()
HStack {
Image("unlock")
.resizable()
.scaledToFit()
.padding (11)
if self.showPassword == true{
TextField("Password", text: self.$password)
.padding(12)
.padding (.leading, -10)
.padding(.leading, -3)
// .frame(width: 175)// if you want to custom where the lock,passwordm and eye relation
} else {
SecureField("Password", text: self.$password)
.padding(12)
.padding (.leading, -10)
.padding(.leading, -3)
}
Button (action: {self.showPassword.toggle()}) {
if self.showPassword == true {
Image("eye-unlock")
.resizable()
.scaledToFit()
.padding (11)
.foregroundColor (.secondary)
} else {
Image("eye")
.resizable()
.scaledToFit()
.padding (11)
.foregroundColor (.secondary)
}
}// closes button
} .padding(.leading, 10)//close Hstack for lock
.padding (.trailing, 10)
Spacer()
HStack {
Image("unlock")
.resizable()
.scaledToFit()
.padding (11)
if self.showPasswordVerify == true{
TextField("Verify Password", text: self.$passwordVerify)
.padding(12)
.padding (.leading, -10)
.padding(.leading, -3)
// .frame(width: 175)// if you want to custom where the lock,passwordm and eye relation
} else {
SecureField("Verify Password", text: self.$passwordVerify)
.padding(12)
.padding (.leading, -10)
.padding(.leading, -3)
}
Button (action: {self.showPasswordVerify.toggle()}) {
if self.showPasswordVerify == true {
Image("eye-unlock")
.resizable()
.scaledToFit()
.padding (11)
.foregroundColor (.secondary)
} else {
Image("eye")
.resizable()
.scaledToFit()
.padding (11)
.foregroundColor (.secondary)
}
}// closes button
} .padding(.leading, 10)//close Hstack for lock
.padding (.trailing, 10)
}.background(Color.white)
.clipShape(RoundedRectangle(cornerRadius: 40))
.shadow(radius: 10)
.frame(maxHeight:40, alignment: .leading)
.padding(.leading, 25)
.padding (.trailing, 25)
VStack (spacing: 2) {
Button (action: {print("create Account pressed!!")}) {
Text("Create")
.fontWeight(.bold)
.padding(10)
.foregroundColor(.orange)
.padding (.leading, 75)
.padding(.trailing, 75)
} .padding (.leading, 10)
.clipShape(RoundedRectangle(cornerRadius: 50))
.overlay(
Capsule(style: .continuous)
.stroke(Color.orange, style: StrokeStyle(lineWidth: 2)))
.shadow(radius: 10)
.frame(maxHeight:40, alignment: .leading)
Spacer()
Text ("OR")
.fontWeight(.black)
.foregroundColor(.white)
Spacer()
Text ("Sign up using social accounts")
.foregroundColor(.white)
.fontWeight(.light)
Spacer ()
HStack {
Button (action: {print("Facebook Account pressed!!")}) {
Image("facebook")
.resizable()
.scaledToFit()
.padding (-3)
}
Spacer()
Button (action: {print("Twitter Account pressed!!")}) {
Image("twitter")
.resizable()
.scaledToFit()
.padding (-3)
}
Spacer()
Button (action: {print("Twitter Account pressed!!")}) {
Image("google")
.resizable()
.scaledToFit()
.padding (-3)
}
}.padding(.trailing, 45)
.padding (.leading, 45)
.offset(y: 10)
.buttonStyle(PlainButtonStyle())//allows buttons to render correclty whilein a navi view
}.padding(.top, 40)
.offset (y: -10)
}
.offset (y:-50)
}
}
}
}
}
struct CreateAccountView_Previews: PreviewProvider {
static var previews: some View {
CreateAccountView()
}
}
1 个解决方案
解决方案1
2 2019-12-01 09:23:05
考虑到在将快照复制到我的测试环境后，即使在预览中我也看不到按钮图像。 在用我的项目资产中的图像替换它们的名称后，它们出现在预览和模拟器中。
因此，我可以假设您忘记将这些按钮图像添加到您的目标资产目录中。
顺便说一句，在较小的型号上也测试高度硬编码的布局，因为在 iPhone 11（及更高版本）中它们适合屏幕，但例如在 iPhone 8 上它们不适合。
测试平台：Xcode 11.2 / iOS 13.2 / Simulator iPhone 8 & iPhone 11 Pro
MacOS 上 SwiftUI 中的按钮问题
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.