[Swift5] 버튼에 라운드 주기 (버튼 둥글게)


개발을 하다보면 버튼에 간단한 디자인을 입혀야하는 경우가 있습니다.

 

그중 버튼의 꼭짓점부분을 둥글게 해달라는 (라운드처리) 이야기가 간혹 있는데, 이럴때 사용하는 방법입니다.

 

기본 버튼에 라운드를 주는 방법은 쉽습니다.

UIButton.layer.cornerRadius = 8

 

일반적으로 생성한 버튼의 모습

 

아래는 소스입니다.

@IBOutlet weak var btn_info: UIButton!

override func viewDidLoad() {
	super.viewDidLoad()

	//버튼의 라운드 처리
	btn_info.layer.cornerRadius = 8

}

 

UIButton은 UIControl을 상속받으며, UIControl은 UIView를 상속받고 있습니다. (https://developer.apple.com/documentation/uikit/uibutton)

 

Apple Developer Documentation

 

developer.apple.com

특히 상속을 받는 UIView에는 멤버변수로 layer:CALayer를 가지고 있습니다. (https://developer.apple.com/documentation/uikit/uiview)

 

Apple Developer Documentation

 

developer.apple.com

이 layer변수에는 뷰에 그림을 그려줄때 필요한 핵심 애니메이션 정보를 가지고 있는데, 이 layer의 정보를 수정해줌으로 라운드 처리가 가능해지는겁니다.

 

소스를 통해 라운드가 적용된 버튼의 모습

 

위에서 설명한 layer변수를 이용하면 버튼의 색상, 타입지정, 이미지 등록 등 다양한 컨트롤이 가능한데, 이는 본 게시글의 제목의 성격이 달라지므로 다음에 설명하는 시간을 갖도록 하겠습니다.

 

 

버전정보 (v1.0)

 - v1.0 2020.07.02 배포

 

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

 

Karzin

abbeea@naver.com


[Swift5] 버튼 보이게 / 보이지 않게 하기

(Android와 비교)


iOS 앱 개발을 하다보면 버튼을 보이게 하거나 보이지 않게 해야하는 경우가 있습니다.

이런 경우 코드로는 어떻게 표현을 해야하는지를 알아보겠습니다.

 

우선 안드로이드에서 사용하는 버튼을 보이거나 보이지 않게하는 방법입니다. (setVisibility함수 사용)

 

Android에서 사용하는 방법(Java)

private Button btn_test

//init
btn_test = findViewById(R.id.btn_test);

//버튼을 보이지 않게
btn_test.setVisibility(View.INVISIBLE);

//버튼을 보이게
btn_test.setVisibility(View.VISIBLE);

 

iOS에서는 @IBOutlet으로 Storyboard에서 간단하게 드래그로 변수 선언을 해주시고, layer의 isHidden을 이용해 컨트롤합니다.

 

iOS에서 사용하는 방법입니다.(Swift5)

@IBOutlet weak var btn_test: UIButton!

//버튼 보이지 않게
btn_test.layer.isHidden = true

//버튼 보이게
btn_test.layer.isHidden = false

 

단, 위 코드는 UIBarButtonItem 컴포넌트에서는 먹히지 않습니다. (layer가 선언이 되는 컴포넌트는 전부 가능 - Button, View 등)

 

컴포넌트가 UIBarButtonItem인 경우(Swift5)

@IBOutlet weak var navigation_btn_test: UIBarButtonItem!

//버튼 보이지 않게
navigation_btn_test.isEnabled = false
navigation_btn_test.tintColor = UIColor.clear

//버튼 보이게
navigation_btn_test.isEnabled = true
navigation_btn_test.tintColor = UIColor.black

 

UIBarButtonItem 컴포넌트의 경우 아무래도 isHidden을 사용할 수 없는 모양입니다.

(객체 내에서 Hidden을 시킬 수 있는 함수나 멤버가 없는 모양)

따라서 위의 소스는

1. 버튼을 사용하지 못하게 막음.

2. 색상을 없애버려 없는 버튼처럼 만들어 줌.

두가지를 이용했다고 보시면 됩니다.

 

단, 이는 제가 아직 부족한 부분이 많아서 다른 좋은 방법이 있을 수 있으므로, 좋은 방법이 있다면 업데이트 해두도록 하겠습니다.

(소스의 표현방식은 각양각색이니까요!)

 

 

테스트 장비 : 맥미니(2020)

 

버전정보 (v1.0)

 - v1.0 2020.07.01 배포

 

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

 

Karzin

abbeea@naver.com

+ Recent posts