SwiftUI_id_demo.swfit

//
//  ContentView.swift
//  SwiftUI_id_demo
//
//  Created by 马超 on 2020/6/24.
//  Copyright © 2020 马超. All rights reserved.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
        Example5()
    }
}

struct Example5: View {
    @State private var theId = 0
    @State private var array = (0..<500).map { _ in String.random() }
    
    var body: some View {
        VStack {
            List(array, id: \.self) { item in
                Text("\(item)")
            }.id(theId)

            Button("Shuffle") {
                self.array.shuffle()
                self.theId += 1
            }
        }
    }
}

struct Example4: View {
    @State private var array = (0..<500).map { _ in String.random() }
    
    var body: some View {
        VStack {
            List(array, id: \.self) { item in
                Text("\(item)")
            }

            Button("Shuffle") {
                self.array.shuffle()
            }
        }
    }
}

extension String {
    static func random(length: Int = 20) -> String {
        String((0..<length).map { _ in "ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890".randomElement()! })
    }
}

struct Example3: View {
    @State private var theId = 0

    var body: some View {
        VStack(spacing: 20) {
            MyCircle()
                .transition(AnyTransition.opacity.combined(with: .slide))
                .id(theId)
                .onDisappear {
                    print("消失了")
                }

            Text("id = \(theId)    ")

            Button("Increment Id") {
                withAnimation(.easeIn(duration: 2.0)) {
                    self.theId += 1
                }
            }
        }
    }

    struct MyCircle: View {
        private let color: Color = [.red, .green, .blue, .purple, .orange, .pink, .yellow].randomElement()!

        var body: some View {
            return Circle()
                .foregroundColor(color)
                .frame(width: 180, height: 180)
        }
    }
}

struct Example2: View {
    @State private var textFieldId = 0

    var body: some View {
        VStack {
            MyCustom()
                .id(textFieldId)

            Button("重置") {
                self.textFieldId += 1
            }
        }
    }
}

struct MyCustom: View {
    @State private var text0 = ""
    @State private var text1 = ""
    @State private var text2 = ""
    @State private var text3 = ""
    @State private var text4 = ""
    @State private var text5 = ""
    @State private var text6 = ""

    var body: some View {
        VStack {
            TextField("text0", text: $text0)
            TextField("text1", text: $text1)
            TextField("text2", text: $text2)
            TextField("text3", text: $text3)
            TextField("text4", text: $text4)
            TextField("text5", text: $text5)
            TextField("text6", text: $text6)
        }
        .padding(.horizontal, 20)
        .textFieldStyle(RoundedBorderTextFieldStyle())
    }
}

struct Example1: View {
    @State private var text0 = ""
    @State private var text1 = ""
    @State private var text2 = ""
    @State private var text3 = ""
    @State private var text4 = ""
    @State private var text5 = ""
    @State private var text6 = ""
    @State private var textFieldId = 0

    var body: some View {
        VStack {
            VStack {
                TextField("text0", text: $text0)
                TextField("text1", text: $text1)
                TextField("text2", text: $text2)
                TextField("text3", text: $text3)
                TextField("text4", text: $text4)
                TextField("text5", text: $text5)
                TextField("text6", text: $text6)
            }
            .id(textFieldId)

            Button("重置") {
                self.textFieldId += 1
            }
        }
        .padding(.horizontal, 20)
        .textFieldStyle(RoundedBorderTextFieldStyle())
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}