본문 바로가기
iOS App Developing

Xcode12 버튼 모양 바꾸기

by 긍열! 2020. 12. 23.
728x90

2020/12/10 - [iOS App Developing] - [iOS 앱 개발 기초] 버튼 클릭으로 팝업창 띄우기

 

저번 글까지 버튼 위 글자의 모양, 색깔을 바꾸는 방법에 대하여 다루었다면

이번 글에서는 버튼의 모양과 색깔을 바꾸는 방법에 대해 정리해 보고자 한다.

 

-이미지 넣기.    .backgorund(Image("~~"))

-버튼 위에 도형 겹치기.     .overlay(~~)

 

이외에도 버튼 자체의 모양을 바꾸는 방법이 있는지 궁금했지만 아직 그 방법은 찾지 못했다. 

더 조사하고 공부하던 중 알게 된다면 추가해 정리해 둬야겠다.


방법 1. 이미지 넣기

코딩 부분의 왼쪽 칸의, 여러 파일들 중 Assets.xcassets 를 누르면 옆에 나타나는 화면에 넣고 싶은 이미지를 드래그해 넣는다. 

 

 



그리고 다시 코딩 부분으로 돌아와

Button(action :{버튼을 눌렀을 때 }){아이콘, 글자 등 버튼 위 속성 변경 부분}.background(Image("~~"))

 

~~부분에 이미지 이름을 넣으면 된다.

 

이미지는 인터넷에 검색하여 샘플을 얻어 사용하거나 

자신이 원하는 디자인에 맞게 제작하여야 한다.

 


방법 2. 버튼 위에 도형 겹치기

 

Button(action :{버튼을 눌렀을 때 }){아이콘, 글자 등 버튼 위 속성 변경 부분}.overlay(~~)

~~부분에는 어떤 도형을 위에 겹칠 것인지와 위치, 디자인 등을 결정하는 부분이다.

 

모서리가 둥근 사각형의 경우 모서리 부분에 원을 자리하는 것이기에 그 원의 반지름을 결정해 주어야 한다.

 

.stroke는 도형의 테두리 디자인을 결정하는 메소드로 테두리의 색깔과 두께를 결정해 주어야 한다.

색깔을 입력할 때는 Color.(색깔)이라고 입력하는 게 정해진 형태이다. 

 

728x90