英文:
SwiftUI - TabView - How to update $selectedPage from a swipe?
问题
I'm struggling with getting SwiftUI to work with swipes as well as a button for a TabView to scroll and track its order.
So, I have a button that the user can touch to advance the page and the text in the button will change when they get to the end.
However, when they change the page using a swipe the button text doesn't change.
如何让它能够在点击和/或滑动时工作?
英文:
I'm struggling with getting SwiftUI to work with swipes as well as a button for a TabView to scroll and track its order.
So, I have a button that the user can touch to advance the page and the text in the button will change when they get to the end.
However, when they change the page using a swipe the button text doesn't change.
struct MyPageView: View
{
@State private var selectedPage: Int = 0
@State private var buttonLabel : String = "Next"
var body: some View
{
ZStack
{
Color.black
VStack
{
TabView(selection: $selectedPage)
{
Page1().tag(0)
Page2().tag(1)
Page3().tag(2)
Page4().tag(3)
Page5().tag(4)
}
.tabViewStyle(.page)
.indexViewStyle(.page(backgroundDisplayMode: .always))
Button(buttonLabel)
{
withAnimation
{
selectedPage += 1
if self.selectedPage > 4
{
selectedPage = 0
buttonLabel = "Next"
}
else if self.selectedPage == 4
{
buttonLabel = "Continue"
}
else
{
buttonLabel = "Next"
}
}
}
.buttonStyle(.borderedProminent)
}.padding(.all)
}
.edgesIgnoringSafeArea(.all)
}
}
How can I get that working so they can tap AND/OR swipe?
答案1
得分: 1
Sure, here's the translated code:
而不是将 `buttonLabel` 设为 `@State` 变量,可以将其设置为计算变量:
```swift
@State private var selectedPage: Int = 0
var buttonLabel: String {
selectedPage == 4 ? "继续" : "下一页"
}
这样,它会在任何地方修改 selectedPage
时都提供正确的值。
完整代码:
struct MyPageView: View {
@State private var selectedPage: Int = 0
var buttonLabel: String {
selectedPage == 4 ? "继续" : "下一页"
}
var body: some View {
ZStack {
Color.black
VStack {
TabView(selection: $selectedPage) {
Text("页面 1").tag(0)
Text("页面 2").tag(1)
Text("页面 3").tag(2)
Text("页面 4").tag(3)
Text("页面 5").tag(4)
}
.tabViewStyle(.page)
.indexViewStyle(.page(backgroundDisplayMode: .always))
Button(buttonLabel) {
withAnimation {
selectedPage += 1
if self.selectedPage > 4 {
selectedPage = 0
}
}
}
.buttonStyle(.borderedProminent)
}.padding(.all)
}
.edgesIgnoringSafeArea(.all)
}
}
请注意,已将引号内的 HTML 实体代码翻译为中文。
这样,它会在任何地方修改 `selectedPage` 时都提供正确的值。
完整代码:
```swift
struct MyPageView: View {
@State private var selectedPage: Int = 0
var buttonLabel: String {
selectedPage == 4 ? "继续" : "下一页"
}
var body: some View {
ZStack {
Color.black
VStack {
TabView(selection: $selectedPage) {
Text("页面 1").tag(0)
Text("页面 2").tag(1)
Text("页面 3").tag(2)
Text("页面 4").tag(3)
Text("页面 5").tag(4)
}
.tabViewStyle(.page)
.indexViewStyle(.page(backgroundDisplayMode: .always))
Button(buttonLabel) {
withAnimation {
selectedPage += 1
if self.selectedPage > 4 {
selectedPage = 0
}
}
}
.buttonStyle(.borderedProminent)
}.padding(.all)
}
.edgesIgnoringSafeArea(.all)
}
}
请注意,已将引号内的 HTML 实体代码翻译为中文。
英文:
Instead of having buttonLabel
be a @State
variable, it can just be a computed variable:
@State private var selectedPage: Int = 0
var buttonLabel: String {
selectedPage == 4 ? "Continue" : "Next"
}
That way, it provides the correct value no matter where selectedPage
was modified from.
Full:
struct MyPageView: View
{
@State private var selectedPage: Int = 0
var buttonLabel: String {
selectedPage == 4 ? "Continue" : "Next"
}
var body: some View
{
ZStack
{
Color.black
VStack
{
TabView(selection: $selectedPage)
{
Text("Page 1").tag(0)
Text("Page 2").tag(1)
Text("Page 3").tag(2)
Text("Page 4").tag(3)
Text("Page 5").tag(4)
}
.tabViewStyle(.page)
.indexViewStyle(.page(backgroundDisplayMode: .always))
Button(buttonLabel)
{
withAnimation
{
selectedPage += 1
if self.selectedPage > 4
{
selectedPage = 0
}
}
}
.buttonStyle(.borderedProminent)
}.padding(.all)
}
.edgesIgnoringSafeArea(.all)
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论