В этой статье мы погрузимся в мир SwiftUI и рассмотрим различные методы реализации горизонтального выбора. Мы предоставим примеры кода для каждого метода, чтобы помочь вам понять и реализовать их в ваших проектах SwiftUI. Итак, начнем!
Метод 1: использование средства выбора
Первый метод предполагает использование встроенного представления Pickerв SwiftUI. Однако по умолчанию Pickerотображает параметры в раскрывающемся списке. Чтобы сделать его горизонтальным, нам нужно обернуть его HStackи изменить его стиль.
struct ContentView: View {
@State private var selectedOption: String = "Option 1"
let options = ["Option 1", "Option 2", "Option 3"]
var body: some View {
HStack {
Picker(selection: $selectedOption, label: Text("")) {
ForEach(options, id: \.self) { option in
Text(option).tag(option)
}
}
.pickerStyle(SegmentedPickerStyle())
}
}
}
Метод 2: использование ScrollView и LazyHStack
Второй метод предполагает использование комбинации ScrollViewи LazyHStackдля создания горизонтального средства выбора. Такой подход дает вам больше гибкости в настройке внешнего вида и поведения средства выбора.
struct ContentView: View {
@State private var selectedOption: String = "Option 1"
let options = ["Option 1", "Option 2", "Option 3"]
var body: some View {
ScrollView(.horizontal) {
LazyHStack(spacing: 20) {
ForEach(options, id: \.self) { option in
Text(option)
.padding()
.background(selectedOption == option ? Color.blue : Color.gray)
.foregroundColor(.white)
.onTapGesture {
selectedOption = option
}
}
}
}
}
}
Метод 3: использование TabView
Третий метод предполагает использование TabViewдля создания горизонтального средства выбора с поведением, похожим на вкладку. Каждая вкладка представляет собой опцию, и вы можете настроить внешний вид вкладок в соответствии со своими потребностями.
struct ContentView: View {
@State private var selectedTabIndex = 0
let options = ["Option 1", "Option 2", "Option 3"]
var body: some View {
TabView(selection: $selectedTabIndex) {
ForEach(0..<options.count) { index in
Text(options[index])
.tabItem {
Text(options[index])
}
.tag(index)
}
}
}
}
В этой статье мы рассмотрели три различных метода реализации горизонтального средства выбора в SwiftUI. Мы узнали, как использовать представление Pickerс сегментированным стилем выбора, создавать собственные средства выбора с использованием ScrollViewи LazyHStackи реализовывать панель выбора на основе вкладок. сборщик с помощью TabView. Благодаря этим методам у вас есть возможность выбрать тот, который лучше всего соответствует требованиям вашего проекта. Приятного кодирования!