Thank you very much, it seems to be working. You have helped me a lot. Here is the code, what do you think?
import SwiftUI
struct SettingsView: View {
@FocusState private var selectedCategory: String?
var body: some View {
NavigationStack {
ZStack {
Color.black
.edgesIgnoringSafeArea(.all)
VStack(spacing: 0) {
// Überschrift oben in der Mitte
Text("Einstellungen")
.font(.system(size: 40, weight: .semibold))
.foregroundColor(.white)
.padding(.top, 30)
HStack {
VStack {
Spacer()
Image(systemName: "applelogo")
.resizable()
.scaledToFit()
.frame(width: 120, height: 120)
.foregroundColor(.white)
Spacer()
}
.frame(width: UIScreen.main.bounds.width * 0.4)
// Rechte Seite mit Kategorien
VStack(spacing: 15) {
ForEach(categories, id: \.self) { category in
NavigationLink(value: category) {
SettingsCategoryView(title: category)
}
.focused($selectedCategory, equals: category)
.buttonStyle(SettingsViewButtonStyle(
isSelected: selectedCategory == category
))
}
}
.frame(width: UIScreen.main.bounds.width * 0.5)
}
}
}
.navigationDestination(for: String.self) { value in
Text("\(value)-Ansicht")
.font(.title)
.foregroundColor(.white)
.navigationTitle(value)
}
}
}
private var categories: [String] {
["Allgemein", "Benutzer:innen und Accounts", "Video und Audio", "Bildschirmschoner", "AirPlay und HomeKit", "Fernbedienungen und Geräte", "Apps", "Netzwerk", "System", "Entwickler"]
}
}
struct SettingsViewButtonStyle: ButtonStyle {
let isSelected: Bool
func makeBody(configuration: Configuration) -> some View {
configuration.label
.foregroundStyle(isSelected ? .black : .white)
.padding(.horizontal, 20)
.frame(height: 50)
.background {
RoundedRectangle(cornerRadius: 8)
.fill(isSelected ? .white : .gray.opacity(0.3))
}
.scaleEffect(isSelected ? 1.05 : 1.0)
.animation(.easeInOut, value: isSelected)
}
}
struct SettingsCategoryView: View {
let title: String
var body: some View {
HStack {
Text(title)
.font(.system(size: 22, weight: .medium))
Spacer()
Image(systemName: "chevron.right")
.foregroundStyle(.gray)
}
}
}
struct SettingsView_Previews: PreviewProvider {
static var previews: some View {
SettingsView()
}
}