Obecny ekran, bazując na 2 wartości

0

Pytanie

Mam 2 liczby całkowite: Xcode i Ycode. To powiązanie z poprzednich ekranów. Teraz chcę przedstawić nowa koncepcja, opierająca się na tych całych liczbach.

Aplikacja jest mały quiz. W ten sposób, Xcode i Ycode-to ocena. Ale chcę przedstawić nowy wygląd, gdy naciśniesz na przycisk "Kliknij mnie" na podstawie Xcode i Ycode.

Na przykład:

Value X = between 8-15 and value Y = between 8-23 -> present screen1
Value X = between 8-15 and value Y = between 24-40 -> present screen2
Value X = between 16-23 and value Y = between 8-17 -> present screen3
And so on......

This is my Code:
      @Binding var Xcode: Int
        @Binding var Ycode: Int
        @State var ShowButton: Bool = false
        @State var ButtonYes: Bool = false
        @State var ButtonNo: Bool = false
        @State var ButtonSometimes: Bool = false

    
    var body: some View {
        ZStack{
        Image("Zebras")
            .resizable()
            .ignoresSafeArea()
            .navigationBarHidden(true)
            
            
            VStack{
                Text("Wat ben ik?")
                    .font(.largeTitle)
                    .fontWeight(.heavy)
                    .padding()
                    .foregroundColor(.white)
                    .background(Color(red: 0.493, green: 0.184, blue: 0.487))
                    .cornerRadius(20)
                Spacer()
                Text("Je heb alle vragen beantwoord. Nu is de vraag: Welk dier ben ik?")
                    .foregroundColor(Color.white)
                    .font(.headline)
                    .padding()
                    .background(Color(red: 0.493, green: 0.184, blue: 0.487))
                    .cornerRadius(20)
                Spacer()
                
                Text("Your score:")
                    .foregroundColor(Color.white)
                    .font(.headline)
                    .padding()
                    .background(Color(red: 0.493, green: 0.184, blue: 0.487))
                    .cornerRadius(20)
                
                HStack (spacing:0){
                    Text("X = ")
                        .foregroundColor(.white)
                        .font(.largeTitle)
                        .padding()
                        .background(Color(red: 0.493, green: 0.184, blue: 0.487))
                        .cornerRadius(20)
                    
                Text(String(Xcode))
                    .foregroundColor(.white)
                    .font(.largeTitle)
                    .padding()
                    .background(Color(red: 0.493, green: 0.184, blue: 0.487))
                    .cornerRadius(20)
                }
                HStack (spacing:0){
                                        
                    Text("Y = ")
                        .foregroundColor(.white)
                        .font(.largeTitle)
                        .padding()
                        .background(Color(red: 0.493, green: 0.184, blue: 0.487))
                        .cornerRadius(20)
                    
                Text(String(Ycode))
                        .foregroundColor(.white)
                        .font(.largeTitle)
                        .padding()
                        .background(Color(red: 0.493, green: 0.184, blue: 0.487))
                        .cornerRadius(20)
                }
                Spacer()
                
                
                
                Button("Click here!") {
                    
                    
                }
                    
                .frame(width: 100, height: 50, alignment: .center)
                .font(.headline)
                .foregroundColor(.white)
                .padding()
                .background(ButtonYes ? Color(red: 0.272, green: 0.471, blue: 0.262) : Color(red: 0.493, green: 0.184, blue: 0.487))
                .cornerRadius(20)
                .shadow(color: .black, radius: 10, x: 10, y: 10)
                Spacer()
                
            }
        }
    }
}

Jak będę mógł to stworzyć?

integer screen swift swiftui
2021-11-23 11:05:13
3

Najlepsza odpowiedź

2

można używać ten podejście, za pomocą orszak, przełącznik i niektóre linki nawigacyjne:

struct ContentView: View {
    @State var xy = (5.0,7.0) // <-- use a tuple
    
    var body: some View {
        NavigationView {
            QuizView(xy: $xy)
        }.navigationViewStyle(.stack)
    }
}

struct QuizView: View {
    @Binding var xy: (Double, Double)
    
    // set of ranges of your scores for each screen
    let screen1X = 1.0..<4.0
    let screen1Y = 2.0..<4.0
    
    let screen2X = 3.0..<4.0
    let screen2Y = 4.0..<8.0
    
    let screen3X = 5.0..<9.0
    let screen3Y = 6.0..<8.0
    
    @State private var action: Int? = 0
    
    var body: some View {
        VStack {
            Button(action: {
                switch xy {
                case (screen1X,screen1Y): action = 1
                case (screen2X,screen2Y): action = 2
                case (screen3X,screen3Y): action = 3
                default:
                    print("---> default")
                }
            }) {
                Text("Click me")
            }
            NavigationLink(destination: Text("screen1X"), tag: 1, selection: $action) {EmptyView()}
            NavigationLink(destination: Text("screen2X"), tag: 2, selection: $action) {EmptyView()}
            NavigationLink(destination: Text("screen3X"), tag: 3, selection: $action) {EmptyView()}
        }
    }
}
2021-11-23 12:57:46

Bardzo wam dziękuję, że znalazłeś czas, aby odpowiedzieć na moje pytanie! To też to, czego szukałem! Wiele się nauczyłem z tej odpowiedzi, dziękuję!
Curiousnoes
1

Widok zawartości z 2 wartości: ValueX i valueY. Następnie zakresy, które są potrzebne. Następnie obliczona właściwość, aby zdecydować, na jaki ekran należy przejść. Przycisk jest tworzony tylko wtedy, gdy obliczana właściwość nie zwraca zero. I miejsce docelowe łącza nawigacji posiada przełącznik, który określa, jaki obraz będzie wyświetlany, i etykietę, która jest przyciskiem, na który trzeba kliknąć.

import SwiftUI

struct MContentView: View {
    @State var valueX = 17
    @State var valueY = 15
    
    @State var isNextViewActive = false
    
    private let range8_15 = 8...15
    private let range16_23 = 16...23
    private let range8_23 = 8...23
    private let range24_40 = 24...40
    private let range8_17 = 8...17
    
    private var screenToPresent: Int? {
        if range8_15.contains(valueX) && range8_23.contains(valueY) {
            return 1
        } else if range8_15.contains(valueX) && range24_40.contains(valueY) {
            return 2
        } else if range16_23.contains(valueX) && range8_17.contains(valueY) {
            return 3
        }
        
        return nil
    }
    
    var body: some View {
        NavigationView {
            if let screen = self.screenToPresent {
                NavigationLink(isActive: self.$isNextViewActive, destination: {
                    switch screen {
                    case 1:
                        MView1()
                    case 2:
                        MView2()
                    case 3:
                        MView3()
                    default:
                        EmptyView()
                    }
                }) {
                    Button(action: {
                        self.isNextViewActive = true
                    }) {
                        Text("Click me!")
                    }
                }
            }
        }
    }
}

struct MView1: View {
    var body: some View {
        Text("My View 1")
    }
}

struct MView2: View {
    var body: some View {
        Text("My View 2")
    }
}

struct MView3: View {
    var body: some View {
        Text("My View 3")
    }
}

struct MExample_Previews: PreviewProvider {
    static var previews: some View {
        MContentView()
    }
}

Nadzieja-to jest to, czego szukasz!

2021-11-23 13:19:55

Dziękuję bardzo! To jest to, czego szukałem! I dziękuję, że znalazłeś czas, aby odpowiedzieć na moje pytanie :)
Curiousnoes

Nie ma za co!
Alexander Thoren
1

U ciebie mogą być ukryte linki nawigacyjne, takie jak:

NavigationLink(destination: View1(), isActive: $condition1, label: { EmptyView() })
NavigationLink(destination: View2(), isActive: $condition2, label: { EmptyView() })
NavigationLink(destination: View3(), isActive: $condition3, label: { EmptyView() })
// note that having empty views for your links will keep them hidden on your layout

dla każdego z twoich warunków X i Y.

Tak więc, kiedy sprawdzasz wartości X i Y, można je sprawdzić w następujący sposób:

condition1 = Xcode >= 8 && Xcode <= 15 && Ycode >= 8 && Code <= 23
condition2 = Xcode >= 8 && Xcode <= 15 && Ycode >= 24 && Code <= 40
condition3 = Xcode >= 16 && Xcode <= 23 && Ycode >= 8 && Code <= 17

i to aktywuje odpowiedni link i przedstawi odpowiedni ekran.

2021-11-23 12:43:33

W innych językach

Ta strona jest w innych językach

Русский
..................................................................................................................
Italiano
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................