4주차_iOS 앱 개발 입문_3일차_UIView 연습

---

---

<TIL>
오늘은 어제 공부한 UIView 컴포넌트 한 번씩 직접 쳐보면서 연습하고,
다음 주까지 해야 하는 과제로 넘어가기 전에
배운 내용을 토대로 내가 만들고 싶은 대로 만들어봤다!

푸바오 러버라 역시나 또 푸바오 등장..😂

오늘 오전에는 알고리즘 문제 풀고,
나머지 오후에는 하루 종일 이것만 했다...ㅎㅎ....

아직 아는 게 별로 없어서 구현할 수 있는 한계가 있었지만,
지난주까지는 문법 위주로만 공부하다가
이렇게 직접 원하는 대로 디자인하고 만들어보니 너무 재밌었다.

지난번 야구 숫자 게임에 이어서 푸바오 나이 맞추기ㅋㅋㅋ....

아래 내용은 만든 결과물과 구현한 코드에 대해서 설명이다.☺️

---

---

먼저 결과물 영상!!

결과물 시뮬레이터

---

만들면서 배운 내용 말고,
추가적으로 하고 싶었던 부분이 몇 가지 있었다.

textField에 입력값이 없으면, Enter 버튼이 뜨지 않도록 하는 것!
Enter 버튼 모서리를 둥글게 만드는 것! 
숫자를 입력하고, 결과를 띄우는 것!

전체 코드를 올리기 전에
코드를 구현했던 과정을 아래에 정리해서 적어봤다. 

---

처음에 각각의 UIView 컴포넌트들을 코드로 만든 후,
Enter Button은 눌렀을 때, 눌린 표시가 육안으로 보일 수 있도록
setTitleColor를 두 번 사용하여 각각 다른 색상으로 만들었다.

다음으로 cornerRadius를 사용하여
Enter Button의 모서리를 둥글게 처리해줬다.

그런 후, buttonTapped()라는 오브젝 함수를 만들어주고, 

Button이 눌렸을 때 무언가 작동할 수 있도록 addTarget을 사용해줬다.

addTarget은 UIButton이나 UIField와 같이
사용자가 직접 컨트롤 할 수 있는 객체에 접근하여
특정 이벤트가 발생할 때 마다 내가 작성한 메서드를 동작할 수 있도록 만들어주는 녀석이다!
→ 엔터버튼명.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)

연결한 후,
함수 안에 textField가 비어있으면, Enter버튼 비활성화를 시키기 위해
isEmpty으로 비어있는지 확인하고,
true라면, isHidden으로 button을 비활성화 시켜줬다.

마지막으로
나이를 틀리게 입력했을 때, 숫자가 아닌 타입을 입력했을 때, 정답을 입력했을 때
해당 문구가 출력되도록 만들었다.

---

---

아래는 위에 정리한 대로 구현한 전체 코드이다.😃

위 코드에서 주석 처리된 부분은 처음에 적었던 코드이다.
그런데,  ageText.isEmpty는 bool 타입이니까

enterButtion.isHidden = ageText.isEmpty

이렇게 한 줄로 줄일 수 있었다.

위 코드도 마찬가지로 삼항 연산자를 사용하여
아래와 같이 줄일 수 있었다.

 

---