【Xcode/SwiftUI】信号を作ってみた

import SwiftUI

// MARK: - Signal
struct Signal: Identifiable {
    let id: Int // Identifiableにするときは必要
    let index: Int // ボタンのindex
    let name: String // 信号機色の名前
    let color: Color // 信号機の色
}

import SwiftUI

// MARK: - CircleManager
class CircleManager: ObservableObject {
    @Published var selectedIndex: Int = 0 // 選択されたボタンのindex番号
    @Published var titleText: String = "" // タイトル用のText
    @Published var selectedSignalColor: Color = Color.white // 選択された信号機の色

    // MARK: - Properties
    let signals = [
        Signal(id: 0, index: 0, name: "Green", color: Color.go),
        Signal(id: 1, index: 1, name: "Yellow", color: Color.caution),
        Signal(id: 2, index: 2, name: "Red", color: Color.stop)
    ]

    // MARK: - Methods
    // 選択された信号機の名前、色を表示させる
    func showSelectedSignal() {
        titleText = signals[selectedIndex].name
        selectedSignalColor = signals[selectedIndex].color
    }
}

import SwiftUI

// MARK: - MainView
struct ContentView: View {
    @ObservedObject var circleManager = CircleManager()

    // MARK: - Body
    var body: some View {
        ZStack {
            VStack {
                Spacer()
                HStack {
                    Text("Signal: \(circleManager.titleText)")
                        .font(.largeTitle)
                    Circle()
                        .frame(width: UIScreen.main.bounds.width / 10)
                        .foregroundColor(circleManager.selectedSignalColor)
                }
                HStack { // 信号を横並びにする
                    ForEach(circleManager.signals) { signal in
                        Circle()
                            .foregroundColor(signal.color)
                            .padding()
                            .onTapGesture { // 信号をタップしたとき
                                circleManager.selectedIndex = signal.index
                                circleManager.showSelectedSignal()
                            }
                    }
                }
                .border(Color.black, width: 3.0)
                Spacer()
                Image(systemName: "car")
                    .resizable()
                    .scaledToFit()
                    .frame(width: UIScreen.main.bounds.width / 1.5)
                Spacer()
            }
        }
        .padding()
    }
}

// MARK: - Preview
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

import SwiftUI

// MARK: - Color
extension Color {
    static let go = Color("Go") // 緑色
    static let caution = Color("Caution") // 黄色
    static let stop = Color("Stop") // 赤色
}