UIButton에서 이미지와 텍스트의 상대적인 위치 및 정렬을 조정하는 방법을 알아봅니다.

1. 기본 이미지 및 텍스트 추가

기본적으로 이미지와 텍스트는 공백으로 구분되어 표시되며, 이미지가 텍스트 앞에 위치합니다.

// 버튼 생성 및 프레임 설정
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(30, 200, 300, 50)];
button.backgroundColor = [UIColor grayColor];

// 이미지 설정
[button setImage:[UIImage imageNamed:@"but"] forState:UIControlStateNormal];

// 텍스트 설정 (앞에 공백 추가)
[button setTitle:@"  But 텍스트" forState:UIControlStateNormal];
[button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
button.titleLabel.font = [UIFont boldSystemFontOfSize:40];

// 뷰에 버튼 추가
[self.view addSubview:button];

2. 전체 위치 및 개별 텍스트 위치 설정

contentHorizontalAlignment 속성을 사용하여 이미지와 텍스트의 전체적인 수평 정렬을 조정할 수 있습니다. titleEdgeInsets를 사용하면 텍스트의 위치를 개별적으로 조정할 수 있습니다. UIEdgeInsetsMake(top, left, bottom, right) 값은 다음과 같이 동작합니다:

• top: 양수 값은 아래로, 음수 값은 위로 이동합니다.
• left: 양수 값은 오른쪽으로, 음수 값은 왼쪽으로 이동합니다.
• bottom: 양수 값은 위로, 음수 값은 아래로 이동합니다.
• right: 양수 값은 왼쪽으로, 음수 값은 오른쪽으로 이동합니다.

// 버튼 생성 및 프레임 설정
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(30, 200, 300, 50)];
button.backgroundColor = [UIColor grayColor];

// 텍스트 설정
[button setTitle:@"But 텍스트" forState:UIControlStateNormal];
[button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
button.titleLabel.font = [UIFont boldSystemFontOfSize:40];

// 이미지 설정
[button setImage:[UIImage imageNamed:@"but"] forState:UIControlStateNormal];

// --- 위치 조정 ---
// 수평 가운데 정렬
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;

// 텍스트 위치 조정 (이미지 높이만큼 아래로, 이미지 너비만큼 왼쪽으로)
// 텍스트는 버튼 뷰 영역 밖으로 표시될 수 있으나, 클릭 이벤트는 해당 영역 내에서만 처리됩니다.
[button setTitleEdgeInsets:UIEdgeInsetsMake(button.imageView.frame.size.height, -button.imageView.frame.size.width, 0.0, 0.0)];
// ----------------

// 뷰에 버튼 추가
[self.view addSubview:button];

3. 이미지와 텍스트 위치 예시

contentHorizontalAlignment와 imageEdgeInsets를 사용하여 이미지와 텍스트의 위치를 조정하는 예시입니다.

// 버튼 생성 및 프레임 설정
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(30, 200, 300, 50)];
button.backgroundColor = [UIColor grayColor];

// 텍스트 설정
[button setTitle:@"But 텍스트" forState:UIControlStateNormal];
[button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
button.titleLabel.font = [UIFont boldSystemFontOfSize:40];

// 이미지 설정
[button setImage:[UIImage imageNamed:@"xia"] forState:UIControlStateNormal];

// --- 위치 조정 ---
// 왼쪽 정렬
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;

// 이미지 위치 조정 (상, 좌, 하, 우) - 버튼 너비에서 이미지 크기를 뺀 만큼 왼쪽으로 이동
button.imageEdgeInsets = UIEdgeInsetsMake(0, 300 - 50, 0, 0); 

/*
// 텍스트 위치 조정 (상, 좌, 하, 우)
// button.titleEdgeInsets = UIEdgeInsetsMake(0, 300 - 50, 0, 0); 
*/
// ----------------

// 뷰에 버튼 추가
[self.view addSubview:button];

4. 주의사항

이미지 크기가 클 경우 레이아웃이 틀어질 수 있습니다. 이 경우 imageEdgeInsets 또는 titleEdgeInsets 값 조정이 필요합니다.