Skip to content

feat, style: [키링 만들기] - customizing, infoinput #28

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
giljihun merged 6 commits into from
Jan 28, 2026
Merged

feat, style: [키링 만들기] - customizing, infoinput #28

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
5dd97c5
style: 커마뷰 - 유료 아이콘 변경
giljihun Jan 28, 2026
7bbc537
style: 커마뷰 - 시트 하이파이 재조정 (아이콘 표시 위치 변경 등)
giljihun Jan 28, 2026
326e00b
style: 커마뷰 - 다음 버튼 색상 변경 등
giljihun Jan 28, 2026
953accc
feat: 정보입력뷰시트 - 이름 입력 초기화 버튼 추가 및 카운트 텍스트 제거
giljihun Jan 28, 2026
5ab7577
style: 태그 추가 alert 하이파이 수정 및 초기화 로직 추가
giljihun Jan 28, 2026
7f98afc
feat: 인포뷰 - 태그 alert dismiss 기능 추가
giljihun Jan 28, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion Keychy/Keychy/Presentation/KeyringMaker/Shared/Components/TemplatePreviewComponents.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -323,7 +323,7 @@ extension TemplatePreviewBody {
.foregroundColor(.black)
}
.padding(.horizontal, 16)
.padding(.vertical, 12.5)
.padding(.vertical, 10.5)
}
.buttonStyle(.plain)
.glassEffect(.regular.interactive(), in: .capsule)
Expand Down
56 changes: 2 additions & 54 deletions Keychy/Keychy/Presentation/KeyringMaker/Shared/Views/EffectSelectorView.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -267,33 +267,7 @@ struct EffectSelectorView<VM: KeyringViewModelProtocol>: View {
HStack(spacing: 4) {
// 유료 아이콘
if !sound.isFree {
if isOwned {
// 유료 + 보유
if isSelected {
Image(.whiteEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
} else {
Image(.grayEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
}
} else {
// 유료 + 미보유
if isSelected {
Image(.whiteEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
} else {
Image(.gradientEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
}
}
Image(.myCoinMini)
}

Text(sound.soundName)
Expand Down Expand Up @@ -441,33 +415,7 @@ struct EffectSelectorView<VM: KeyringViewModelProtocol>: View {
HStack(spacing: 4) {
// 유료 아이콘
if !particle.isFree {
if isOwned {
// 유료 + 보유
if isSelected {
Image(.whiteEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
} else {
Image(.grayEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
}
} else {
// 유료 + 미보유
if isSelected {
Image(.whiteEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
} else {
Image(.gradientEffectSelect)
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
}
}
Image(.myCoinMini)
}

Text(particle.particleName)
Expand Down
19 changes: 10 additions & 9 deletions .../Keychy/Presentation/KeyringMaker/Shared/Views/KeyringCustomizingView+PurchaseSheet.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ extension KeyringCustomizingView {

/// 장바구니 리스트 (스크롤 가능)
ScrollView {
VStack(spacing: 12) {
VStack(spacing: 20) {
ForEach(cartItems) { item in
purchaseItemRow(item: item)
}
Expand All @@ -43,16 +43,17 @@ extension KeyringCustomizingView {
Spacer()

// 내 보유 포인트
HStack(spacing: 4) {
HStack(spacing: 6) {
Text("내 보유 :")
.typography(.suit15M25)
.foregroundStyle(.black100)

Text("\(UserManager.shared.currentUser?.coin ?? 0)")
.typography(.nanum16EB)
.foregroundStyle(.main500)
.padding(.top, 2)
}
.padding(.bottom, 16)
.padding(.bottom, 7)

// 구매 버튼
purchaseButton
Expand Down Expand Up @@ -80,23 +81,23 @@ extension KeyringCustomizingView {
/// 구매 아이템 Row
private func purchaseItemRow(item: EffectItem) -> some View {
HStack(spacing: 0) {
// 아이콘 (유료 표시)
Image(.mainEffectSelect)
.padding(.trailing, 6)

// 아이템 이름
Text(item.name)
.typography(.suit17B)
.typography(.suit16B)
.foregroundStyle(.black100)
.padding(.trailing, 6)

// 타입 표시
Text(item.type.rawValue)
.typography(.suit12M)
.typography(.suit13M)
.foregroundStyle(.gray400)

Spacer()

// 아이콘 (유료 표시)
Image(.myCoinMini)
.padding(.trailing, 5)

// 가격
Text("\(item.price)")
.typography(.nanum16EB)
Expand Down
2 changes: 1 addition & 1 deletion Keychy/Keychy/Presentation/KeyringMaker/Shared/Views/KeyringCustomizingView.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -311,7 +311,7 @@ extension KeyringCustomizingView {
} label: {
Text(hasCartItems ? "구매 \(cartItems.count)" : "다음")
.typography(.suit17B)
.foregroundStyle(hasCartItems ? .white100 : .black100)
.foregroundStyle(hasCartItems ? .white100 : .main500)
.padding(4.5)
}
.buttonStyle(.glassProminent)
Expand Down
2 changes: 1 addition & 1 deletion Keychy/Keychy/Presentation/KeyringMaker/Shared/Views/KeyringInfoInputView+Helpers.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ extension KeyringInfoInputView {
} label: {
Text("다음")
.typography(.suit17B)
.foregroundStyle(viewModel.nameText.isEmpty || hasProfanity ? .gray300 : .black100)
.foregroundStyle(viewModel.nameText.isEmpty || hasProfanity ? .gray300 : .main500)
.padding(5)
}
.buttonStyle(.glassProminent)
Expand Down
12 changes: 8 additions & 4 deletions Keychy/Keychy/Presentation/KeyringMaker/Shared/Views/KeyringInfoInputView+Sheet.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,10 +111,14 @@ extension KeyringInfoInputView {
.typography(.notosans15M)
/// 커서 표시기 색상
.tint(.main500)

Text("\(textCount)/\(viewModel.maxTextCount)")
.typography(.suit13M)
.foregroundStyle(.gray300)

if viewModel.nameText.count > 0 {
Copy link
Copy Markdown
Member

@jini-coding jini-coding Jan 28, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

오.. 이 부분처럼 다른 곳들도 하이파이랑 다른 부분이 좀 있더라고요. 저도 주의해서 반영해둘게요!

Button {
viewModel.nameText = ""
} label: {
Image(.emptyIcon)
}
}
}
.padding(.vertical, 13.5)
.padding(.horizontal, 16)
Expand Down
48 changes: 29 additions & 19 deletions ...hy/Keychy/Presentation/KeyringMaker/Shared/Views/KeyringInfoInputView+TagManagement.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ extension KeyringInfoInputView {
}
}

// MARK: - Add Tag Alert (Glass Style)
// MARK: - Add Tag Alert
extension KeyringInfoInputView {
var addNewTagAlertView: some View {
VStack(spacing: 0) {
Expand All @@ -59,32 +59,42 @@ extension KeyringInfoInputView {
.typography(.suit17B)
.foregroundStyle(.black100)
.padding(.top, 14)
.padding(.bottom, 30)

// TextField
TextField("태그 이름을 입력해주세요", text: $newTagName)
.typography(.notosans15R)
.padding(.vertical, 14)
.padding(.horizontal, 16)
.frame(height: 52)
.background(
RoundedRectangle(cornerRadius: 12)
.fill(.white100)
)
.padding(.top, 21)
.padding(.bottom, 5)
.onChange(of: newTagName) { oldValue, newValue in
if newValue.count > 10 {
newTagName = String(newValue.prefix(10))
HStack {
// TextField
TextField("태그 이름을 입력해주세요", text: $newTagName)
.typography(.notosans16R)
.focused($isTagTextFieldFocused)
.onChange(of: newTagName) { oldValue, newValue in
if newValue.count > 10 {
newTagName = String(newValue.prefix(10))
}
showTagNameAlreadyExistsToast = availableTags.contains(newValue)
}
.tint(.main500)

if newTagName.count > 0 {
Button {
newTagName = ""
} label: {
Image(.emptyIcon)
}
showTagNameAlreadyExistsToast = availableTags.contains(newValue)
}
.tint(.main500)
}
.padding(.horizontal, 16)
.padding(.vertical, 14)
.background(
RoundedRectangle(cornerRadius: 12)
.fill(.white100)
)

HStack {
Text(showTagNameAlreadyExistsToast ? "이미 사용 중인 태그 이름입니다." : "")
.typography(.suit14M)
.foregroundStyle(.error)
.opacity(showTagNameAlreadyExistsToast ? 1 : 0)
.padding(.top, showTagNameAlreadyExistsToast ? 5 : 0)

Spacer()
}
Expand Down Expand Up @@ -139,8 +149,8 @@ extension KeyringInfoInputView {
}
}
.padding(14)
.frame(width: UIScreen.main.bounds.width - 102) // 좌우 51씩 여백
.glassEffect(.regular.interactive(), in: .rect(cornerRadius: 34))
.frame(width: 300, height: 230)
}
}

Expand Down
14 changes: 13 additions & 1 deletion Keychy/Keychy/Presentation/KeyringMaker/Shared/Views/KeyringInfoInputView.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ struct KeyringInfoInputView<VM: KeyringViewModelProtocol>: View {
@State var sheetDetent: PresentationDetent = .height(76)
@State var showSheet: Bool = true
@FocusState var isFocused: Bool
@FocusState var isTagTextFieldFocused: Bool

// MARK: - Profanity Filtering
@State var validationMessage: String = ""
Expand Down Expand Up @@ -111,9 +112,20 @@ struct KeyringInfoInputView<VM: KeyringViewModelProtocol>: View {
Color.black60
.ignoresSafeArea()
.zIndex(99)
.onTapGesture {
// 키보드가 올라와 있으면 키보드만 내림
if isTagTextFieldFocused {
isTagTextFieldFocused = false
} else {
// 키보드가 이미 내려가 있으면 Alert 닫기
newTagName = ""
showAddTagAlert = false
showTagNameAlreadyExistsToast = false
sheetDetent = .height(measuredSheetHeight)
}
}

addNewTagAlertView
.padding(.horizontal, 51)
.zIndex(100)
}

Expand Down