'야매로배우기'에 해당되는 글 1건

  1. 2012.12.06 아이폰 강좌 0.3 야매로 배우기! 스토리보드에 탭바 추가하기! (2)

아이폰 강좌 0.3 야매로 배우기! 스토리보드에 탭바 추가하기!

View Comments

0.3 아이폰 강좌  야매로 배우기!

-스토리보드에 탭바를 추가하자!


yenos!

조금씩.. 나도 모르게 바뻐지는 삶 때문에.. ㅋㅋㅋ 

조금씩 포스팅도 느려지네용..

그럼에도 불구하고.

헹 :) 

오늘 은 간단히 스토리보드에 탭바를 추가해보도록 하겠읍니다..

HEre We Go!



추천 부탁드려요:)

감사합니다!



0.1 탭바가 뭐랍니까??

Tap Bar 말그대로 간단히 탭으로만 뷰를 움직일 수 있는 아주 편한녀석ㅎㅎㅎ

예전쓰던 프로젝트로 ~~ 쭉 이어서 갈게요!

시작해볼가요?

왼쪽 네비게이션 리스트에서..

MainStoryboard를 클릭합니다.. 다음?  우리가 처음 만들었던 viewController 를 선택해줍니다!! 



view Controller가 선택이되면 요롷게 오른쪽 아래처럼 파랑라인이 뜨아! 뜨게 되구요!(view를 선택하면 아마 TabbarCotroller가 선택이 안될것이에요 ㅠㅠ 꼭~ ViewController를 누러서 파란라인 확인!) 

이상태에서 위에 Menu에 - Editor -Embed In - Tab Bar Controller 순으로 클릭해주세욯ㅎㅎㅎ

완료가 됬다면!ㅎㅎㅎㅎㅎ



요기 이그림처럼 스토리보드 상에 Tab Bar Controller가 추가 되있을겁니다!! 

잘 보였나요 ? 성공!!!

다음으로



사진과 같이  오른쪽 아래 object에서 ViewController를 하나 추가해줍니다~!

간단간단~ 빠르게 야매로~

추가가 완료되었다면 저번 시간에 했던 아울렛 연결하기를 스토리보드상에서 해봅니다!

Tab BarController 창에서 Control 좌버튼을 누르고 파란 선으로 쭉 땡겨서!

새로 만들어진 ViewController에 꽂아 줍니다! 팍!!!!



그럼 위에 사진처럼 Manual Segue가 나오게 되구요!  요 목록중에! 

가장 아래있는 view Controllers 를 클릭하게 되면 완료!!



짜잔! 어쩄든.

완성!! 이렇게 탭바가 2개 생겼습니다.. 한번 자신있게 돌려볼까요.

cmd + R

탭바를 누르면 자연스럽게 구동이 되지요??

그렇다면.. 이제 두번째 탭을 코딩할 뭔가 창을만들어야겠는데..




없어!!! 

이런.. AppDelegate,Storyboard는 처음에 기본적 basic으로 깔렸고..

ViewController는 첫번째 뷰만을 코딩 할 때 이용했는데!! 

도대체가!!!

어떻게 2번째 창에 코딩하고 편집하느냐??? 

갑시다~



보기와 같이 YenosViewController.m 마지막 파일에서 우 클릭합니다!

New File을 눌러주세요(단추기 cmd+n)



아마 바로 요로케 나올겁니다.. ios - cocoa Touch - Objective -c Class ! 

요 라인데로 next! next!


호홓 class 이름은 그냥 구분하기 쉽게 YesnosSecondViewControoler라고 하였구요!

중요한건 저 subClass인데요.. 저희는 지금 간단히 Viewconroller창만을 이용했잖아요?

그러니 UIViewCOntroller를 선택합니다!

아래 두개는 모두 체크해제합니다.. 

우린 스토리보드를 사랑하는 야매 클럽이니깐요...ㅋㅋㅋㅋㅋ



뚜둥.. 깔끔하네여..

깔끔하게 추가됬어요! 이제

스토리보드로 돌아가서! 우리의 view와 방금만든 따끈 따근한 파일을 연결해줍시다!ㅎㅎㅎㅎ



Storyboard로 오셨나요?? ㅎㅎ

먼저 내가 새로 만든 controller를 위에 처럼 클릭해줍니다!! 

controller를 선택해야지 View를 선택하면 안됩니다! 노란 박스에서 보이듯이 선택되어야해요ㅎㅎㅎㅎ

다음으로..

조기 푸른 박스 보이나요?  푸른박스를 선택하시고! 

Custom class에서 .. 우리가 만들었던..YenosSecondViewController를 선택해줍니닿!!!

고러면 연결 끝! 

한번 테스트해볼까요?



저번과 마찬가지 방법으로 두번쨰 image삽입 성공!! 

햐 완벽한뎨??

이제 탭바는 별거 아니졍? 

근데.. 탭바가 참 허전하네요.. 모양도 없고.. 이름도 Item이래...

바꿔봅시다! 



이름은.. 스토리보드가서  더블클릭.. 편집모드로 편짐하시면..

쉽죠?

근데 저 모양은 어케하지..;;; 하하핳 해봅시다. 

저는 1번째 탭바의 모양을 추가할거에요.. 먼저 적당한 사진을 추가해줍니다.. 

우리가 저~ 번에 만들어 놓았던 이미지 그룹에 말이죠!



전 구여운 손모양을 추가했습니다.. 헤헤

완료? 하셨나욥?

다음으로 YenosViewController.m파일로 들어가셔서..

View did Road 안에..



이거 하나 코딩해주세요i   imageNamed은 당연히! 아까추가안 이름이랑 같아야하겟지요???

+ 사이즈도 중요합니다.. 사이즈가 너무 크면 화면에 안담기고.. 너무작으면 안보이겠지요?? 

어쨌든

요롷콤 코딩하고 런을하면!



짜자잔!

어? 안나오시는 분들?

아이콘 사이즈를 확인하세요!

사이즈관련 포스팅을 따로 할거구요!

사이즈 바꾸는 관련 앱은 !  지금!! 오른쪽!!   카테고리 Mac에 추천어플 중 Iconifiy라는 녀석이 있습니다! 


[맥 추천 어플] iconify    ---요고 눌러도 새창으로 가고..



쉽죠? 여기까지가 Tap bar를 만들고!  탭바에 모양까지 추가해보았습니다!!

만약 탭을 더 추가하고싶다??  같은방법으로 하시면되요!  새로 View Controller를 만들고!

Tab Bar Controller에서 파란선을 쭉~~ 끌어서 view Controllersㅎㅎㅎ

별거 아닌데.. 요즘 보통 앱들을 보면

Tap은 왠만큼 필수가 되버린거 같아요

다음시간엔 지금 만들어 놓은 탭바로!

Mapview를 다뤄보겠습니다!! 



2 Comments (+add yours?)

Leave a Reply

Tracbacks (+view to the desc.)

Newer Entries Older Entries