앨런 Swift 앱 만들기 UIKit | 네비게이션바/탭바 코드없이 구현하기

안녕하세요

오늘은 제가 강의를 보며 배웠던걸 정리하고자 합니다

 

 

 

⭐️인프런에서 앨런님의 swift 앱 만들기⭐️

를 통해서 정리하였습니다

 

정말 정말 잘 설명해주기 때문에 제가 정리해놓은것 보다 보시는걸 추천드립니다

 

자료제공은 절대 불가합니다

 

---

 

네비게이션바

|

애플에서 미리 만들어 놓은 기능이기 때문에 몇 가지 설정만 하게되면 복잡한 기능을 쉽게 사용가능 합니다

하지만 제약도 많기 때문에 커스텀해서 사용해야하는 경우도 있습니다

상단바를 눈에 안보이게 가릴 수도 있는 기능은 숨김처리로 가능합니다

네비게이션바에 들어가있는 버튼인 Bar Button Item은 조금 특별한 버튼인데 이곳저곳 남발하여 사용하는것이 아니라

한정적인 위치에서만 사용이 가능합니다

네비게이션바도 화면전환이 가능한데 present (밑에서 위로 올라오는)화면 전환이랑은 좀 다른 성격을 지니고 있습니다 

네비게이션바 같은 경우 show로 가능하답니다

 

스토리보드 / 코드로만 UI를 짰을 때 설정이 살짝 다를 수 있으므로 유의해야 하는 점이 있습니다

 

 

네비게이션 바/탭바를 만드는 방법은 2가지 방법이 있습니다

 

첫 번째로 우선 네비게이션 컨트롤을 만들고 싶은 화면을 클릭한 후

Editor -Embed In - Navigation Controller / Tab Bar Controller

 

 

두 번째로는 우측 하단에 우리가 자주 사용했던 스택뷰로 묶었던 아이콘을 클릭하게되면

아래쪽에서 네비게이션 컨트롤러와 탭바 컨트롤러를 볼 수 있습니다

 

 

그리고 버튼을 누르고 Control을 누른채 드래그를 한 후 직접 세그웨이를 만들어 준 후 

Stroyboard Segue - kind(show - e.g. push)를 선택해줍니다

 

 

present modally도 있지만 show를 클릭해야 네비게이션 컨트롤러를 사용할 수 있습니다

 

 

show를 클릭하면 상단에 기본적으로 Back이 나오게 됩니다

 

 

그리고 Back이 아닌 다른 단어를 사용하고 싶고 상단에 어떤화면인지 작성하고 싶다면

상단 컨트롤러를 누르고 타이틀을 작성하면 됩니다

저는 '메인화면'으로 작성했습니다

 

 

작성하고 Enter 하는 순간 Back이 아닌 메인화면으로 변경되는걸 볼 수 있습니다

 

 

 

Navigation Bar에 들어가게 되면

Scroll Edge를 선택하고 - Background white를 선택하게되면

아무리 화면 배경 색이 변경되어도 네비게이션 바 부분은 우리가 지정한 색깔로만 나오게 되어있습니다

 

 

그리고 이제 탭바를 추가해 보겠습니다

 

 

탭바는 네비게이션 컨트롤러를 추가한것과 동일하게 위에서 설명한 대로 추가하시면 됩니다

 

 

그리고 빈 화면을 만든 후에 탭바 컨트롤러를 클릭한 후 Control을 클릭한 채로 빈화면을 드래그 한 후

Relationship Segue - view Controllers를 선택해줍니다

 

 

그리곤 탭바 아이템에 들어가면 여러가지 항목들을 보게됩니다

거기서 색상 및 이미지 그리고 위치도 설정이 가능하게됩니다

 

 

저는 MyProfile로 Title을 설정하였더니 탭바에 변경된걸 확인할 수 있습니다

 

그리고 Tab Bar에서

백그라운드 색상을 설정하게되면

네비게이션바와 동일하게 이미지 색상이 탭바 부분에 생기는걸 볼 수 있습니다

 

그렇게 탭바 아이콘 이름 및 이미지를 다 설정한 후 확인하면

이렇게 쉽게 구현이 가능합니다