7f703024d8
룰렛 설정에서 입력 필드 포커스 시 항목을 중앙으로 이동한다. 키보드에 가려지지 않도록 입력 가시성을 높인다. 프로필 메뉴 오버레이의 하단 안전영역 패딩을 제거한다.
99 lines
3.3 KiB
Swift
99 lines
3.3 KiB
Swift
//
|
|
// RouletteSettingsOptionView.swift
|
|
// SodaLive
|
|
//
|
|
// Created by klaus on 2023/12/05.
|
|
//
|
|
|
|
import SwiftUI
|
|
|
|
struct RouletteSettingsOptionView: View {
|
|
|
|
@ObservedObject var option: RouletteOption
|
|
|
|
let index: Int
|
|
var focusedField: FocusState<RouletteSettingsFocusField?>.Binding
|
|
let onClickDelete: () -> Void
|
|
let calculateTotalPercentage: () -> Void
|
|
|
|
var body: some View {
|
|
VStack(spacing: 6.7) {
|
|
HStack(spacing: 0) {
|
|
Text("옵션 \(index + 1)")
|
|
.appFont(size: 14.7, weight: .medium)
|
|
.foregroundColor(Color(hex: "eeeeee"))
|
|
|
|
Spacer()
|
|
|
|
if index > 1 {
|
|
Text("삭제")
|
|
.appFont(size: 14.7, weight: .medium)
|
|
.foregroundColor(Color(hex: "ff5c49"))
|
|
.onTapGesture { onClickDelete() }
|
|
}
|
|
}
|
|
|
|
HStack(spacing: 8) {
|
|
TextField("옵션을 입력하세요", text: $option.title)
|
|
.autocapitalization(.none)
|
|
.disableAutocorrection(true)
|
|
.appFont(size: 13.3, weight: .medium)
|
|
.foregroundColor(Color(hex: "eeeeee"))
|
|
.keyboardType(.default)
|
|
.focused(focusedField, equals: .optionTitle(option.id))
|
|
.padding(.horizontal, 13.3)
|
|
.padding(.vertical, 16.7)
|
|
.frame(maxWidth: .infinity)
|
|
.background(Color(hex: "222222"))
|
|
.cornerRadius(6.7)
|
|
|
|
HStack(spacing: 0) {
|
|
TextField("0.00", text: $option.percentage)
|
|
.autocapitalization(.none)
|
|
.disableAutocorrection(true)
|
|
.appFont(size: 13.3, weight: .medium)
|
|
.foregroundColor(Color(hex: "eeeeee"))
|
|
.keyboardType(.decimalPad)
|
|
.focused(focusedField, equals: .optionPercentage(option.id))
|
|
.onChange(of: option.percentage) { newValue in
|
|
if newValue.count > 5 {
|
|
option.percentage = String(newValue.prefix(5))
|
|
}
|
|
|
|
calculateTotalPercentage()
|
|
}
|
|
|
|
Text("%")
|
|
.appFont(size: 13.3, weight: .medium)
|
|
.foregroundColor(Color(hex: "eeeeee"))
|
|
}
|
|
.padding(.horizontal, 13.3)
|
|
.padding(.vertical, 16.7)
|
|
.frame(maxWidth: 85)
|
|
.background(Color(hex: "222222"))
|
|
.cornerRadius(6.7)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
struct RouletteSettingsOptionView_Previews: PreviewProvider {
|
|
static var previews: some View {
|
|
PreviewContainer()
|
|
}
|
|
}
|
|
|
|
private struct PreviewContainer: View {
|
|
@FocusState private var focusedField: RouletteSettingsFocusField?
|
|
|
|
var body: some View {
|
|
RouletteSettingsOptionView(
|
|
option: RouletteOption(title: "옵션1", percentage: ""),
|
|
index: 2,
|
|
focusedField: $focusedField,
|
|
onClickDelete: {},
|
|
calculateTotalPercentage: {}
|
|
)
|
|
}
|
|
}
|