NavigationView {
VStack{
Spacer()
logo()
Spacer()
Text("电话号码")
.frame(maxWidth: .infinity, alignment: .leading)
.padding(.bottom, 10)
HStack{
CountryPicker(selectedCountry: $selectedCountry)
TextField("Phones Number", text: $phoneNumber)
.keyboardType(.numberPad)
.textFieldStyle(RoundedBorderTextFieldStyle())
}
.padding(.bottom, 14)
.frame(maxWidth: .infinity, alignment: .leading)
Text("验证码")
.frame(maxWidth: .infinity, alignment: .leading)
.padding(.bottom, 10)
TextField("Verification Code", text: $phoneNumber)
.keyboardType(.numberPad)
.textFieldStyle(RoundedBorderTextFieldStyle())
NavigationLink(destination: login()) {
Text("登陆")
.foregroundColor(.white)
.padding()
.background(Color.black)
.cornerRadius(10)
.frame(maxWidth: .infinity, alignment: .center)
.bold()
}
.buttonStyle(PlainButtonStyle())
.padding(.top,36)
Spacer()
}
.navigationTitle("")
.navigationBarItems(
trailing:
NavigationLink(destination: Text("Second View")) {
Text("遇到问题")
}
// Vstack Line
)
.padding()
.frame(maxWidth: .infinity)
// Navigation Stack
}
.padding(.vertical, 5)
Hi, I'm new to swift ui, I tried to make the
Text("登陆")
.foregroundColor(.white)
.padding()
.background(Color.black)
.cornerRadius(10)
.frame(maxWidth: .infinity, alignment: .center)
.bold()
}
this navigationLink expand the whole width of the Vstack, so I tried to use .frame(maxWidth: infinity) on it but it still doesn't work
Can any one helps me on this problem, Thank you
Hi @Ting_Qu ,
The order of your modifiers is the issue here. Instead of:
.background(Color.black)
.cornerRadius(10)
.frame(maxWidth: .infinity, alignment: .center)
You need
.frame(maxWidth: .infinity, alignment: .center)
.background(Color.black)
.cornerRadius(10)
Right now, the background color is being applied to the text, which has a very small width. You then set the frame, but the background color won't change based on that since it's already been applied. Set the frame first, then the background color.
