[Mission/#2-Tina] 1일차 미션

[gorgeouseowoo]

티나입니다. git hub remote에 브랜치 생성을 잊지 마세요! git push origin mission/#2-Tina

Done xcode 프로젝트 생성했습니다.

[gorgeouseowoo]

1️⃣ 위 화면을 구성하기 위한 학습 키워드 나열

View Controller View Safe Area Text Field Button Label Constraints UIKeyboardType

2️⃣ 해당 화면 구성 시 고려해야 할 엣지 케이스 서술 (ex_ 자릿수 마다 ',' 기입)

숫자 키보드를 사용하는 경우

1. “이오바보”와 같은 문자열을 복사해서 붙여넣는 경우
2. ‘00001’ 처럼 0으로 시작하는 숫자를 입력하는 경우 → 버튼을 누르면 레이블에 1원으로 나타난다
3. 텍스트필드에 입력하는 숫자의 길이가 텍스트필드 너비를 초과하는 경우 → 최대 길이 제한을 두거나 전체 숫자 일부를 생략해서 보여주기
4. 숫자를 입력하지 않고 버튼을 누르는 경우 → 버튼을 비활성화 해두거나 ‘금액을 입력해 주세요’ 작은 메시지 띄우기
5. 입력된 숫자가 있는 상태에서 새로운 숫자를 입력하고 버튼을 누르는 경우 → 새롭게 입력한 숫자로 바뀜
6. 숫자를 입력하고 버튼을 1초 간격으로 2번 누르는 경우 → 2번째 버튼에 해당하는 숫자가 라벨에 적힘
7. 1,000 단위마다 ‘,’ 기입

[gorgeouseowoo]

TextField와 Label 역할 차이로 생긴 오해 😮

화면을 구성할 때 다음과 같은 과정을 생각했어요.

1. 첫번째 TextField에서 숫자를 입력한 다음
2. 지출 버튼을 누르면
3. 두번째 TextField에 입력한 숫자가 나온다

그런데 제가 틀렸다는 것을 발견했어요. TextField에서 입력한 숫자는 Label에 등장하는 거였어요. 즉, TextField에 입력한 숫자가 보여지는 곳이 TextField가 아니라 Label이었던 거죠!

이런 오해가 생긴 이유를 생각해 보면, TextField는 입력 내용을 화면에 보여주고, 입력 중일 때도 사용자가 값을 볼 수 있어서 마치 결과가 표시되는 곳도 TextField라고 느껴졌어요. '입력한 값이 보여지는 곳은 입력 필드'라고 오해한 것이죠.

과정을 수정해 볼게요!

1. TextField에서 숫자를 입력한 다음
2. 지출 버튼을 누르면 3Label에 입력한 숫자가 나온다

이번 삽질을 통해 TextField는 사용자 입력을 받는 입력 창이고, Label은 입력된 값을 표시하는 출력 창이라고 확실히 이해하게 되었어요. 다음에는 틀리지 않을거에요 😛

[gorgeouseowoo]

📱구현화면

👿 문제발생 텍스트필드에 숫자가 무한정으로 적혀요.. 다들 어떻게 해결하셨나요!?

https://github.com/user-attachments/assets/ac84fbe4-5ccb-486e-82ba-8032011fcf7d

[anjiniii]

📱구현화면

👿 문제발생 텍스트필드에 숫자가 무한정으로 적혀요.. 다들 어떻게 해결하셨나요!?

Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-10-31.at.13.56.35.mp4

저도 비슷한 내용을 다루는 중입니다!!

저는 Int로 변경하여 NumberFormatter를 사용하고 있어요! 그래서 입력 값이 Int의 최대최소 범위에 영향을 받게 됩니당,, 그런데 Swift의 Int는 최댓값이 9,223,372,036,854,775,807 이기 때문에, 이 값보다 작은 값까지 입력할 수 있도록, 입력 숫자 길이의 제한을 둘까 고민중이었습니다. 혹은 이 이상의 값이 입력되었을 때, 최대 입력 가능 숫자를 넘어갔다고 알리거나?!?!

[shippingpark]

📱구현화면

👿 문제발생 텍스트필드에 숫자가 무한정으로 적혀요.. 다들 어떻게 해결하셨나요!?

Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-10-31.at.13.56.35.mp4

UITextField는 text가 들어올 때 마다 그 input에 맞는 화면을 보여주는 역할을 수행하죠! 그건 UIKit에서 이미 만들어준 기능이에요. 달리 말하면, UITextField는 사용자가 한자 한자 입력할 때 마다 반응하고 있어요! 우리가 그 반응하는 상황에 접근할 수 있다면, UITextField에 보여질 text를 조작할 수도 있을 것 같습니다!

그렇다면 사용자가 텍스트를 한 자 한 자 입력할 때 마다 반응하는 action 메서드가 있을까요? 있을 것이라는 믿음 하에 인스펙터 창을 뒤져보았습니다

오 ! 명칭 상으로는 Editing Change 가 유력해 보이는데요?!

ㅎㅎ 해당 이벤트에서 입력 받은 text가 20(임의)자리를 초과한다면 초과한 자릿수 만큼을 잘라서 textField.text에 직접 먹여줄 수도 있을 것 같아요!

정리하자면, 만약 textField의 input으로 들어오는 값에 output 제한이 생기길 바란다면 UITextField가 가지고 있는 메서드를 통해 적절한 시점에 보여지는 모습을 변경해줄 수 있지 않을까요?!