如何解决如何在 SwiftUI 中使用文本旋转或类似的东西构建可滚动的侧边菜单?
我想构建一个如下图所示的菜单,我可以在其中滚动菜单。我确实尝试了 ScrollView 中的 HStack/vstack 和文本和/或堆栈上的旋转修饰符的多种组合。但是,我的任何尝试都没有真正按预期工作。
尝试 1
代码
struct ContentView: View {
let sections = ["Exclusives","Apple","Android","Videos","Got a leak ?"].reversed()
var body: some View {
vstack(spacing: 0) {
// Header
Rectangle()
.fill(Color(UIColor.quaternaryLabel))
.frame(height: UIScreen.main.bounds.width * 0.2)
// Vertical Menu + Content
HStack(spacing: 0) {
// Menu using vstack and rotation on Text
ScrollView(.vertical) {
vstack(spacing: 32) {
ForEach(sections,id: \.self) { section in
Text(section)
// padding added on workingdog suggestion.
// But steal not producing exactly what I'm looking for. ?
.padding()
.rotationEffect(.degrees(-90),anchor: .center)
}
}
}
// Content Placeholder
Rectangle()
.fill(Color(UIColor.tertiarySystemFill))
.frame(maxWidth: .infinity,maxHeight: .infinity)
}
.ignoresSafeArea(.all,edges: .bottom)
}
}
}
结果
尝试 2
代码
struct ContentView: View {
let sections = ["Exclusives","Got a leak ?"].reversed()
var body: some View {
vstack(spacing: 0) {
// Header
Rectangle()
.fill(Color(UIColor.quaternaryLabel))
.frame(height: UIScreen.main.bounds.width * 0.2)
// Vertical Menu + Content
HStack(spacing: 0) {
// Menu using rotation on HStack
ScrollView(.vertical) {
HStack(spacing: 32) {
ForEach(sections,id: \.self) { section in
Text(section)
}
}
.rotationEffect(.degrees(-90),anchor: .center)
}
// Content Placeholder
Rectangle()
.fill(Color(UIColor.tertiarySystemFill))
.frame(maxWidth: .infinity,edges: .bottom)
}
}
}
结果
问题
我确实尝试了其他方法,但对这两个概念进行了细微更改。但据我所知,问题来自使用旋转修饰符,它旋转内容,而不是视图本身(导致不需要的行为)。
感谢您的帮助!
解决方法
也许这更接近图片:
var--
,
我确实找到了一个很好的解决方案,使用 Attempt 2 并使用 @robniper 旋转整个 Text 视图,详细答案在这里:https://stackoverflow.com/a/59802487/5541378
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。