diff --git a/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Controls/EditTextComponent.swift b/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Controls/EditTextComponent.swift index e605652..c9dba08 100644 --- a/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Controls/EditTextComponent.swift +++ b/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Controls/EditTextComponent.swift @@ -9,24 +9,42 @@ import SwiftUI struct EditTextComponent: View { let explanation: LocalizedStringKey - @State private var name: String - - init(explanation: LocalizedStringKey, value: String) { - self.explanation = explanation - self._name = State(initialValue: value) - } + @Binding var name: String var body: some View { - Form { - Section(header: Text(explanation)) { - TextField("", text: $name) - } + VStack(alignment: .leading) { + Text(explanation) + .font(.caption) + .foregroundColor(.gray) + + TextField("", text: $name) + .padding(10) + .background(Color(.systemGray6)) + .cornerRadius(5) + .placeholder(when: name.isEmpty) { + Text(explanation).foregroundColor(.gray) + } + } + } +} + +extension View { + func placeholder( + when shouldShow: Bool, + alignment: Alignment = .leading, + @ViewBuilder placeholder: () -> Content) -> some View { + + ZStack(alignment: alignment) { + placeholder().opacity(shouldShow ? 1 : 0) + self } } } + struct EditTextComponent_Previews: PreviewProvider { static var previews: some View { - EditTextComponent(explanation: LocalizedStringKey("Nom du Joueur 1"), value: "Joueur 1") + EditTextComponent(explanation: "Nom du Joueur 1", name: .constant("Joueur 1")) } } + diff --git a/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Visuals/ProfileEdit.swift b/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Visuals/ProfileEdit.swift index 6cf8b76..1fe27f0 100644 --- a/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Visuals/ProfileEdit.swift +++ b/ArkitDoushiQi/ArkitDoushiQi/Views/Components/Visuals/ProfileEdit.swift @@ -7,16 +7,19 @@ import SwiftUI -struct ProfileEdit: View { +struct ProfileEdit: View, KeyboardReadable { let color: Color let profileWidth: CGFloat let profileHeight: CGFloat let defaultImage: Image let imageTextChange: LocalizedStringKey let playerNameKey: LocalizedStringKey + @Binding var playerName: String + @State private var keyboardHeight: CGFloat = 0 + @State private var isKeyboardVisible: Bool = false var body: some View { - VStack(alignment: .leading, spacing: 10) { + VStack(alignment: .leading) { EditImageComponent( color: color, profileWidth: profileWidth, @@ -24,16 +27,17 @@ struct ProfileEdit: View { defaultImage: defaultImage, imageTextChange: imageTextChange ).padding(.horizontal) - - VStack(alignment: .leading, spacing: 5) { - Text(playerNameKey) - .font(.headline) - .foregroundColor(.gray) - TextField("", text: .constant("")) // Modifier ici selon votre logique - .textFieldStyle(RoundedBorderTextFieldStyle()) - .font(.title3) // Taille de police augmentée + + EditTextComponent(explanation: playerNameKey, name: $playerName) + .padding(.horizontal) + } + .padding(.bottom, isKeyboardVisible ? keyboardHeight : 0) + .animation(.easeOut(duration: 0.3), value: keyboardHeight) + .onReceive(keyboardPublisher) { height in + withAnimation { + self.keyboardHeight = height + self.isKeyboardVisible = height > 0 } - .padding(.horizontal) } } } @@ -41,11 +45,13 @@ struct ProfileEdit: View { struct ProfileEdit_Previews: PreviewProvider { static var previews: some View { ProfileEdit(color: Color(.red), - profileWidth: 80, - profileHeight: 80, + profileWidth: 100, + profileHeight: 100, defaultImage: Image("profil"), - imageTextChange: "Changer d'avatar", - playerNameKey: "Nom du Joueur 1" + imageTextChange: "Changer l'avatar", + playerNameKey: "Nom du Joueur 1", + playerName: .constant("Joueur 1") ) } } + diff --git a/ArkitDoushiQi/ArkitDoushiQi/Views/GameParametersMenuView.swift b/ArkitDoushiQi/ArkitDoushiQi/Views/GameParametersMenuView.swift index e17f2a3..c8ec5d8 100644 --- a/ArkitDoushiQi/ArkitDoushiQi/Views/GameParametersMenuView.swift +++ b/ArkitDoushiQi/ArkitDoushiQi/Views/GameParametersMenuView.swift @@ -9,58 +9,53 @@ import SwiftUI import PhotosUI struct GameParametersMenuView: View, KeyboardReadable { - @State private var selectedGameType: GameType = .PvP @State private var selectedAIOption: AI = .RandomAction @State private var selectedRulesOption: Rules = .Regular + @State private var selectedGameType: GameType = .PvP + @State private var isKeyboardVisible = false + @State private var playerName1 = NSLocalizedString("Nom du Joueur 1", comment: "") + @State private var playerName2 = NSLocalizedString("Nom du Joueur 2", comment: "") @State private var keyboardHeight: CGFloat = 0 var body: some View { - NavigationStack { - VStack(alignment: .leading, spacing: 15) { - Text(LocalizedStringKey("Paramètres de partie")) - .bold() - .font(.largeTitle) - .padding(.top, 20) - - PickerComponent(title: LocalizedStringKey("Sélectionne le type de partie :"), - selectedOption: $selectedGameType, - options: GameType.allCases) - .padding(.horizontal) - - PickerComponent(title: LocalizedStringKey("Sélectionne les règles :"), - selectedOption: $selectedRulesOption, - options: Rules.allCases) - .padding(.horizontal) - - if selectedGameType == .PvAI { - PickerComponent(title: LocalizedStringKey("Sélectionne une IA :"), - selectedOption: $selectedAIOption, - options: AI.allCases) - .padding(.horizontal) - } - - ProfileEdit(color: Color(.red), profileWidth: 80, profileHeight: 80, defaultImage: Image("profil"), imageTextChange: LocalizedStringKey("changer l'avatar du joueur 1"), playerNameKey: LocalizedStringKey("Nom du Joueur 1")) - - if selectedGameType == .PvP { - ProfileEdit(color: Color(.blue), profileWidth: 80, profileHeight: 80, defaultImage: Image("profil"), imageTextChange: LocalizedStringKey("changer l'avatar du joueur 2"), playerNameKey: LocalizedStringKey("Nom du Joueur 2")) - } - - Spacer() - - ButtonComponent(title: LocalizedStringKey("Lancer la partie")) { - GameView() + GeometryReader { geometry in + ScrollView { + VStack(alignment: .leading) { + Text("Paramètres de partie") + .bold() + .font(.title) + .padding() + + PickerComponent(title: "Sélectionne le type de partie :", selectedOption: $selectedGameType, options: GameType.allCases) + PickerComponent(title: "Sélectionne les règles :", selectedOption: $selectedRulesOption, options: Rules.allCases) + + if selectedGameType == .PvAI { + PickerComponent(title: "Sélectionne une IA :", selectedOption: $selectedAIOption, options: AI.allCases) + } + + ProfileEdit(color: Color(.red), profileWidth: 100, profileHeight: 100, defaultImage: Image("profil"), imageTextChange: "Changer l'avatar du joueur 1", playerNameKey: "Nom du Joueur 1", playerName: $playerName1) + + if selectedGameType == .PvP { + ProfileEdit(color: Color(.blue), profileWidth: 100, profileHeight: 100, defaultImage: Image("profil"), imageTextChange: "Changer l'avatar du joueur 2", playerNameKey: "Nom du Joueur 2", playerName: $playerName2) + } + + if !isKeyboardVisible { + ButtonComponent(title: "Lancer la partie") { + GameView() + } + .padding(EdgeInsets(top: 10, leading: 32, bottom: 10, trailing: 32)) + } } - .padding(.horizontal, 32) - .padding(.bottom, 20) - } - .onReceive(keyboardPublisher) { height in - withAnimation { - self.keyboardHeight = height + .padding(.bottom, isKeyboardVisible ? keyboardHeight : 0) + .animation(.easeOut(duration: 0.3), value: keyboardHeight) + .onReceive(keyboardPublisher) { height in + withAnimation { + self.keyboardHeight = height - geometry.safeAreaInsets.bottom + self.isKeyboardVisible = height > 0 + } } + .frame(minHeight: geometry.size.height) } - .padding(.horizontal, 20) - .padding(.bottom, keyboardHeight) // Ajouter le padding en bas pour éviter le clavier - .padding(.top, 20) // Ajuster le padding en haut si nécessaire } } }