如何解决自动计算填充以使用SwiftUI填充整个视图的框架
我几乎可以肯定有一个简单的解决方案,但是在使用UIKit几年之后,对我来说不是很明显。
实际上,有一个带有七个按钮的日历可以切换星期几。我在按钮之间使用了恒定的填充值,但是我需要将视图的框架分为七个相等的部分,每个按钮一个。,以使布局适合于不同的屏幕尺寸。在框架布局中,这是一项非常简单的任务,但是我无法猜测如何使用SwiftUI正确地做到这一点。 Spacer()
在这种情况下看起来不太好。
一些图片可以说明发生了什么: what I want, what I have。
谢谢!
struct WeekCalendarView: View {
@ObservedObject var selectedDay: ObservableDate
private var days: [Date] {
return selectedDay.date.currentWeek
}
var body: some View {
HStack {
ForEach(days,id: \.self) { day in
Button(action: {
self.selectedDay.date = day
}) {
VStack {
Text(day.date)
.fontWeight(.semibold)
.foregroundColor(day == self.selectedDay.date ? Color.white : Color.black)
.padding(14)
.background(day == self.selectedDay.date ? Color.green : Color.clear)
.clipShape(Circle())
.padding(.vertical,6)
Text(day.dayOfTheWeek)
.fontWeight(.light)
.font(.caption)
}
}
.buttonStyle(PlainButtonStyle())
}
}
}
}
解决方法
这是复制模型上自动平台无关布局(不带填充)的演示。
使用Xcode 12 / iOS 14准备并测试了演示
struct WeekCalendarView: View {
private var days = [23,24,25,26,27,28,29]
private var dayOfTheWeek = ["Sun","Mon","Tue","Wed","Thu","Fri","Sut"]
@State private var selectedDay = 24
var body: some View {
HStack {
ForEach(0..<days.count,id: \.self) { day in
Button(action: {
self.selectedDay = days[day]
}) {
VStack {
Circle()
.fill(days[day] == self.selectedDay ? Color.green : Color.clear)
.aspectRatio(contentMode: .fit)
.overlay(
Text("\(days[day])")
.fontWeight(.semibold).fixedSize()
.foregroundColor(days[day] == self.selectedDay ? Color.white : Color.black)
)
.padding(.vertical,6)
.frame(maxWidth: .infinity)
Text(dayOfTheWeek[day])
.fontWeight(.light)
.font(.caption)
}
}
.buttonStyle(PlainButtonStyle())
}
}
}
}
,
Roland没有测试他的解决方案,因此其中存在一些错误,这是基于Rolands答案的经过测试的解决方案:
更改:HStack中的间距必须设置为0,否则结果仍然很丑。还有一个小的类型“ with” ...
struct ContentView: View {
var days = [
Day(date: "9",dayOfTheWeek: "Su"),Day(date: "10",dayOfTheWeek: "Mo"),Day(date: "11",dayOfTheWeek: "Tu"),Day(date: "12",dayOfTheWeek: "We"),Day(date: "13",dayOfTheWeek: "Th"),Day(date: "14",dayOfTheWeek: "Fr"),Day(date: "15",dayOfTheWeek: "Sa")
]
@State var selectedDay : Day = Day(date: "10",dayOfTheWeek: "Mo")
var body: some View {
HStack(spacing:0) {
ForEach(days,id: \.self) { day in
Button(action: {
self.selectedDay = day
}) {
VStack {
Text(day.date)
.fontWeight(.semibold)
.foregroundColor(day == self.selectedDay ? Color.white : Color.black)
.padding(14)
.background(day == self.selectedDay ? Color.green : Color.clear)
.clipShape(Circle())
.padding(.vertical,6)
Text(day.dayOfTheWeek)
.fontWeight(.light)
.font(.caption)
}
.frame(width: screen.size.width / 7) // This is where I would use the screen size.
}
.buttonStyle(PlainButtonStyle())
}
}
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。