TIL 5일차

맥북을 수령한 관계로 첫 강의 내용부터 복습하기 시작했다.

언어 설정은 swift , UI는 storyboard로 진행했고 드래그&드롭으로 Button이나 Label , Image 등을 배치시켰고 배경 색이나 content mode, 폰트 등 인스팩터에서 가능한 여러 옵션들을 만져보는 시간을 가졌다.

그렇게 옵션들을 건드려본 뒤 빌드시켜 보았더니 실제 화면이 의도대로 나오지 않고 찌그러져 있었다.

옆에 경고가 나와 있는 걸 뒤늦게 확인하고 검색해보니 Auto Layout 기능이 작동하지 않았고, Auto Layout이 작동하지 않은 이유는 제약 조건이 불충분해서라고 한다. 제약 조건이라는 것은 각 UI가 다른 요소들과 어떻게 상호작용 해야하는지 설정하는 것이라고 한다. 이 제약 조건이 제대로 설정되지 않아 어떻게 배치해야 하는지 모호하게 이해해 흐트러진 모습으로 나타난 것이다. 왼쪽 경고 글에 Horizontal position is ambigous for “Switch” 라고 써있는데 이 부분이 제약 조건이 불충분해 나온 경고인 것 같다.

이 문제를 해결하기 위해 Editor의 Resolve Auto Layout Issue에서 Add Missing Constraints를 사용하니 정렬이 되었다.

정렬 되고도 왜 정렬이 된 건지 더 찾아보니 Add Misssing Constraints를 사용하면 필요한 제약 조건을 자동으로 추가하여 바로잡아준 것이라고 한다. 다음에 문제가 생겨도 이렇게 하면 되나 했더니 그래도 되지만 의도한대로 되지 않을 수도 있으니 처음부터 제약 조건을 잘 설정해야 하겠다.

이후 IBoutlet과 IBAction에 대해 실습했다.

강의 내용대로 IBOutlet 기능을 이용해 Storyboard에서 드래그&드랍으로 추가한 오브젝트인 Button과 Label을 각각 MyButton과 MyLabel 이라는 이름으로 코드에 연결시켰고, IBAction을 이용해 버튼이 눌렸을 때 프롬프트상에 “반가워요!” 라는 결과창을 띄워 정상 작동함을 확인하고자 했다.

결과적으로 시뮬레이터 상에 뒤틀림 없이 UI가 출력됐고, 버튼을 누르자 예상대로 프롬프트 창에 “반가워요!”가 뜨긴 했으나 또다시 Views with out any layout~ 으로 시작하는 경고창이 떴고, 프롬프트 창에도 에러가 발생했다.

원하는 동작과 UI 구성엔 문제가 없었으나 강의 내용엔 없는 경고나 에러가 발생하니 문제를 파악해야 했다.

화면 왼쪽에 자꾸 등장하는 경고는 또다시 Constraints, 즉 제약 조건에 대한 경고였고, 프롬프트 창에 뜬 에러는 무엇인지 다시 확인해야 하는 상황이다.

맥 없이 강의로만 볼 때는 전혀 어렵지 않은 내용이었고 실습하다 보면 당연히 뭔가 문제가 생길 수도 있다고 생각이야 하고 있었지만 하나 하나 할 때마다 강의 내용에는 없는, 왜 생기는지 모를 에러나 경고가 자꾸 발생하니 왜 발생하는지, 해결하려면 어떻게 해야 하는지, 해결한 뒤에도 왜 해결 됐고 재발하지 않으려면 어떻게 해야하는지 짚다보니 정말 간단한 내용임에도 진도가 나가질 않는다. 그러나 이것들도 전부 더 나은 기본기를 위한 발판이라 생각하고 더 정보를 찾아 볼 예정이다.