따라하며 공부하기 1.1 - Memo App 프로젝트 생성

KxCoding 메모앱 따라 하며 공부하기
( 영상과 공부시점의 버전차이가 있어 UI 등 다른 부분이 있음 )

 

 

Xcode를 실행하고 Create a new Xcode project 클릭

 

ios - App 클릭 후 Next 클릭 ( 휴대폰 어플 )

 

프로젝트 이름과 기관이름(?) 적어주고 Interface는 Storyboard로 하고 Next

 

저장할 위치를 골라주고 Create 클릭

 

Identity 에서 ios 최소 버전을 설정해 주고 화면에 보이는 어플의 이름을 Memo로 변경해 준다 ( Display Name )

 

실행해 보니 위와 같이 Memo 앱이 만들어졌다

 

어플의 이미지 등록하기

 

www.flaticon.com  사이트에서 무료로 다운로드하였다

 

사이즈가 512x512여서 1024x1024로 변경해주어야 한다

 

www.appiconmaker.co  사이트에서 사진을 크기별로 만들어서 다운로드했다

 

1024 사이즈만 필요해서 1개만 따로 클릭해 다운로드를 했다

 

사이즈가 일치하니 위 모습처럼 화면에 보인다

 

앱의 이미지가 만들어졌다

 

다음으로 512 사이즈의 이미지를 드래그해서 Appicon 아래에 추가했다

그리고 1x 에 있는 이미지를 3x인 기기에서 사용하면 해상도가 1/3 되어버리기 때문에 2x로 옮겨줬다

( 이미지를 따로따로 해주는 것이 좋지만 공부하는 목적이기에 중요하지 않아서 2x만 해놓고 넘어갔다 )

 

메모 앱을 실행하면 처음에 보이는 이미지를 설정해 주었다

명령어는 cmd + shift + L 이고 검색을 통해 image를 찾아준 뒤 드래그해서 화면 위에 배치해 준다

 

이미지를 클릭하면 위와 같이 이미지를 설정할 수 있고 내가 원하는 이미지와 Content Mode를 Aspect Fit으로 설정한다

 

이미지와 글자를 1개의 영역으로 묶기 위해 Embed in View 에서 Stack View를 클릭했다

 

위와 같이 1개의 영역으로 묶였다
( 왼쪽 흰색 영역에 Stack View 아래에 그림과 Memo가 있다 )

 

묶인 영역에서 그림을 클릭해서 사이즈를 조정해 줬다
( 설정을 다 하고 맨 아래 Add 2 Constraints를 클릭하면 적용된다 )

 

선택 영역을 화면의 중간으로 옮기기 위해 Add New Alignment Constraints 에서 Horizontally와 Vertically를 선택하고 적용했다

 

앱이 실행될 때 위와 같은 화면이 나타난다

 

 

KxCoding
https://www.youtube.com/watch?v=vHM_D8sbLEY