SwiftUI ScrollView 水平 RTL 无法正常工作
SwiftUI ScrollView horizontal RTL not working correctly
我正在尝试在我的 ios 上支持 RTL 模式,它是使用 swiftUI 构建的
这样做可以改变布局方向,一切都很好:
.environment(\.layoutDirection, .rightToLeft)
只有水平 ScrollView ,它不能正常工作
当我这样做时:
ScrollView(.horizontal) {
HStack{
Text("b1")
Text("b2")
Text("b3")
}
} .environment(\.layoutDirection, .rightToLeft)
项目位置会旋转,但 HSTACK 将始终保持在左侧,如下面的屏幕截图所示:
有任何解决方案或技巧可以使其向右移动吗?
作为 hack,你可以从这个开始:
var body: some View {
GeometryReader { geom in
ScrollView(.horizontal) {
HStack {
Text("b1")
Text("b2")
Text("b3")
}.environment(\.layoutDirection, .rightToLeft)
.padding(.leading, geom.size.width - 100) // adjust for the number of items
}
}
}
我找到了使用 .flipsForRightToLeftLayoutDirection(true)
和 .rotation3DEffect
执行此操作的技巧
这样 scrollview 将被翻转,比你需要将 HStack 的每个项目翻转到 .rotation3DEffect
ScrollView(.horizontal) {
HStack{
Text("b1")
.rotation3DEffect(Angle(degrees: 180), axis: (x: CGFloat(0), y: CGFloat(10), z: CGFloat(0)))
Text("b2")
.rotation3DEffect(Angle(degrees: 180), axis: (x: CGFloat(0), y: CGFloat(10), z: CGFloat(0)))
Text("b3")
.rotation3DEffect(Angle(degrees: 180), axis: (x: CGFloat(0), y: CGFloat(10), z: CGFloat(0)))
}
}.flipsForRightToLeftLayoutDirection(true)
.environment(\.layoutDirection, .rightToLeft)
我正在尝试在我的 ios 上支持 RTL 模式,它是使用 swiftUI 构建的 这样做可以改变布局方向,一切都很好:
.environment(\.layoutDirection, .rightToLeft)
只有水平 ScrollView ,它不能正常工作
当我这样做时:
ScrollView(.horizontal) {
HStack{
Text("b1")
Text("b2")
Text("b3")
}
} .environment(\.layoutDirection, .rightToLeft)
项目位置会旋转,但 HSTACK 将始终保持在左侧,如下面的屏幕截图所示:
有任何解决方案或技巧可以使其向右移动吗?
作为 hack,你可以从这个开始:
var body: some View {
GeometryReader { geom in
ScrollView(.horizontal) {
HStack {
Text("b1")
Text("b2")
Text("b3")
}.environment(\.layoutDirection, .rightToLeft)
.padding(.leading, geom.size.width - 100) // adjust for the number of items
}
}
}
我找到了使用 .flipsForRightToLeftLayoutDirection(true)
和 .rotation3DEffect
这样 scrollview 将被翻转,比你需要将 HStack 的每个项目翻转到 .rotation3DEffect
ScrollView(.horizontal) {
HStack{
Text("b1")
.rotation3DEffect(Angle(degrees: 180), axis: (x: CGFloat(0), y: CGFloat(10), z: CGFloat(0)))
Text("b2")
.rotation3DEffect(Angle(degrees: 180), axis: (x: CGFloat(0), y: CGFloat(10), z: CGFloat(0)))
Text("b3")
.rotation3DEffect(Angle(degrees: 180), axis: (x: CGFloat(0), y: CGFloat(10), z: CGFloat(0)))
}
}.flipsForRightToLeftLayoutDirection(true)
.environment(\.layoutDirection, .rightToLeft)