Computer >> 컴퓨터 >  >> 프로그래밍 >> iOS

iOS 버튼 커스터마이징하기: 텍스트와 색상 설정하는 두 가지 방법

이번 포스트에서는 iOS 앱에서 버튼(Button)을 자유롭게 커스터마이징하는 방법을 알아보겠습니다. 스토리보드(Storyboard)를 활용하는 방법과 코드로 직접 설정하는 방법, 총 두 가지 방식을 단계별로 살펴봅니다.

프로젝트 준비하기

1단계 – Xcode를 실행한 뒤 New Project → Single View Application을 선택하고, 프로젝트 이름을 "CustomiseButton"으로 지정합니다.

2단계 – Main.storyboard 파일을 열고 아래 그림과 같이 버튼 하나를 화면에 배치합니다. 이 버튼을 대상으로 커스터마이징을 진행할 예정입니다.

iOS 버튼 커스터마이징하기: 텍스트와 색상 설정하는 두 가지 방법

방법 1: 스토리보드에서 버튼 꾸미기

가장 간단한 방법은 인터페이스 빌더의 속성 설정을 이용하는 것입니다.

  • 1단계 – 스토리보드에서 커스터마이징할 버튼을 클릭해 선택합니다.
  • 2단계 – 오른쪽 패널의 Attribute Inspector(속성 검사기)를 열면 버튼의 텍스트, 글자 색상, 배경색 등을 자유롭게 변경할 수 있습니다.

iOS 버튼 커스터마이징하기: 텍스트와 색상 설정하는 두 가지 방법

설정이 끝나면 프로젝트를 실행(Run)해 보세요. 아래와 같이 변경된 버튼이 시뮬레이터에 나타납니다.

iOS 버튼 커스터마이징하기: 텍스트와 색상 설정하는 두 가지 방법

방법 2: 코드로 버튼 커스터마이징하기

동적으로 버튼의 모양을 바꾸고 싶다면 Swift 코드로 직접 설정할 수 있습니다.

  • 1단계 – 버튼에 대한 @IBOutlet을 생성하고 이름을 customButton으로 지정합니다.
  • 2단계viewDidLoad 메서드 안에서 다음과 같이 버튼의 텍스트와 배경색을 설정합니다.
override func viewDidLoad() {
    super.viewDidLoad()
    customButton.setTitle("My Custom Button", for: .normal)
    customButton.backgroundColor = UIColor.green
}

setTitle(_:for:) 메서드는 특정 상태(여기서는 .normal)일 때 버튼에 표시될 텍스트를 지정하며, backgroundColor 속성으로 배경색을 변경합니다.

프로젝트를 실행하면 아래와 같이 초록색 배경에 새로운 텍스트가 적용된 버튼을 확인할 수 있습니다.

iOS 버튼 커스터마이징하기: 텍스트와 색상 설정하는 두 가지 방법

마무리

지금까지 스토리보드와 Swift 코드 두 가지 방식으로 iOS 버튼의 텍스트와 색상을 변경하는 방법을 알아보았습니다. 간단한 정적 UI는 스토리보드로, 런타임 조건에 따라 변화가 필요한 경우에는 코드로 구현하는 것이 효율적입니다. 여기에 더해 폰트, 코너 라운드(layer.cornerRadius), 그림자 등을 추가하면 더욱 세련된 버튼을 만들 수 있습니다.