programing

UIButton의 image Size를 조정하는 방법

oldcodes 2023. 4. 19. 23:27
반응형

UIButton의 image Size를 조정하는 방법

UIButton의 이미지 크기를 조정하려면 어떻게 해야 하나요?이미지를 다음과 같이 설정합니다.

[myLikesButton setImage:[UIImage imageNamed:@"icon-heart.png"] forState:UIControlStateNormal];

그러나 이렇게 하면 이미지가 풀버튼까지 채워집니다.어떻게 하면 이미지를 작게 할 수 있을까요?


이력 노트:

이 10년 이상 된 질문의 경우 일반적으로 다음과 같은 방법으로 포인트 크기를 설정합니다.setPreferredSymbolConfiguration

내가 당신이 무엇을 하려고 하는지 정확히 이해한다면, 당신은 이미지 엣지 삽입 버튼을 가지고 놀아야 합니다.예를 들어 다음과 같습니다.

myLikesButton.imageEdgeInsets = UIEdgeInsets(top: 30, left: 30, bottom: 30, right: 30)

팀의 답변은 맞지만, 제 경우 전체적으로 더 간단한 해결책이 있었기 때문에 다른 제안을 추가하고 싶었습니다.

세팅하려고 했는데UIButton버튼의 콘텐츠 모드를 설정할 수 있는지 몰랐기 때문에 이미지가 삽입되었습니다.UIImageView따라서 UIEdgeInset 및 하드코드화된 값을 모두 사용할 필요가 없습니다.버튼의 아래 이미지 뷰에 액세스하여 콘텐츠모드를 설정하기만 하면 됩니다.

myButton.imageView.contentMode = UIViewContentModeScaleAspectFit;

'UIButton이 콘텐츠 모드를 수신하지 않음'을 참조하십시오.

스위프트 3

myButton.imageView?.contentMode = .scaleAspectFit

스위프트 3:

button.setImage(UIImage(named: "checkmark_white"), for: .normal)
button.contentVerticalAlignment = .fill
button.contentHorizontalAlignment = .fill
button.imageEdgeInsets = UIEdgeInsetsMake(10, 10, 10, 10)

다음은 UIButton의 imageView를 확장하는 다른 솔루션입니다.

button.imageView?.layer.transform = CATransform3DMakeScale(0.8, 0.8, 0.8)

인터페이스 빌더에서도 이렇게 할 수 있습니다.

여기에 이미지 설명 입력

도움이 될 것 같아요.

이미지가 너무 큰 경우(이미지 크기를 작게 할 수 없거나 축소할 수 없는 경우) 처음 두 가지 답변의 조합이 좋습니다.

addButton.imageView?.contentMode = .scaleAspectFit
addButton.imageEdgeInsets = UIEdgeInsetsMake(15.0, 15.0, 15.0, 5.0)

이미지 삽입을 올바르게 하지 않으면 이미지가 왜곡되어 버립니다.contentMode.

사용할 수 있습니다.imageEdgeInsets단추 이미지 주위의 직사각형 삽입 또는 시작 여백입니다.

 [self.btn setImageEdgeInsets:UIEdgeInsetsMake(6, 6, 6, 6)];

양의 값은 해당 에지를 축소하거나 삽입하여 이동합니다.음의 값은 해당 에지를 확장하거나 아웃셋합니다.

Swift 버전은 다음과 같습니다.

myButton.imageEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)

버튼에 심볼 이미지를 사용하고 있는 경우는, 다음의 솔루션이 좋습니다.

button.setPreferredSymbolConfiguration(UIImage.SymbolConfiguration(pointSize: 48), forImageIn: .normal)

이미지를 삽입하는 것이 좋습니다만, Type 버튼은 Custom 버튼, Style 버튼은 Default 버튼이 필요했습니다.Xcode 13에 추가된 버튼의 기본값은 System for Type, Plain for Style입니다.

self.imageEdgeInsets = UIEdgeInsets(top: 3.0, left: 3.0, bottom: 3.0, right: 3.0)

여기에 이미지 설명 입력

스위프트 4

이 두 줄의 코드를 다음 순서로 사용해야 합니다.필요한 것은 가장자리 삽입의 상단 및 하단 값을 변경하기만 하면 됩니다.

addButton.imageView?.contentMode = .scaleAspectFit
addButton.imageEdgeInsets = UIEdgeInsetsMake(10.0, 0.0, 10.0, 0.0)

Tim C의 답변에 의해, 나는 에 확장자를 만들 수 있었다.UIButton를 사용하여 이미지 프레임을 지정할 수 있습니다..setImage() 기능을 frame

extension UIButton{

    func setImage(image: UIImage?, inFrame frame: CGRect?, forState state: UIControlState){
        self.setImage(image, forState: state)

        if let frame = frame{
            self.imageEdgeInsets = UIEdgeInsets(
                top: frame.minY - self.frame.minY,
                left: frame.minX - self.frame.minX,
                bottom: self.frame.maxY - frame.maxY,
                right: self.frame.maxX - frame.maxX
            )
        }
    }

}

해, 「」의 을 가 있는 .UIButton로로 합니다.CGRectMake(0, 0, 64, 64)을 해주시면 됩니다.myImageCGRectMake(8, 8, 48, 48) , , , , , , , , , , , , , , , , , , , , , , , , , .

let button: UIButton = UIButton(frame: CGRectMake(0, 0, 64, 64))
button.setImage(
    myImage,
    inFrame: CGRectMake(8, 8, 48, 48),
    forState: UIControlState.Normal
)

를 " "로 때"UIEdgeInsetsMake(top, left, bottom, right)「UIEdgeInset」입니다.양수인 것처럼 마이너스 값으로 동작합니다.

예:높이 100과 애스펙트 1:1의 2개의 버튼.

left.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)
right.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)

여기에 이미지 설명 입력

left.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)
right.imageEdgeInsets = UIEdgeInsetsMake(45, 0, 45, 0)

여기에 이미지 설명 입력

left.imageEdgeInsets = UIEdgeInsetsMake(40, 0, 40, 0)
right.imageEdgeInsets = UIEdgeInsetsMake(60, 0, 60, 0)

여기에 이미지 설명 입력

예 1과 3은 ABS(100 - (40 + 40)) = ABS(100 - (60 + 60))이므로 동일합니다.

Swift > 5 갱신

크기를 설정합니다.

button.frame = CGRect(x: 0, y: 0, width: 44, height: 44)

여백 설정:

button.imageEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)

한 가지 방법은 다음과 같이 코드의 UIImage 크기를 조정하는 것입니다.주의: 이 코드는 높이로만 축척되지만, 폭 단위로 축척되도록 기능을 쉽게 조정할 수 있습니다.

let targetHeight = CGFloat(28)
let newImage = resizeImage(image: UIImage(named: "Image.png")!, targetHeight: targetHeight)
button.setImage(newImage, for: .normal)

fileprivate func resizeImage(image: UIImage, targetHeight: CGFloat) -> UIImage {
    // Get current image size
    let size = image.size

    // Compute scaled, new size
    let heightRatio = targetHeight / size.height
    let newSize = CGSize(width: size.width * heightRatio, height: size.height * heightRatio)
    let rect = CGRect(x: 0, y: 0, width: newSize.width, height: newSize.height)

    // Create new image
    UIGraphicsBeginImageContextWithOptions(newSize, false, 0)
    image.draw(in: rect)
    let newImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    // Return new image
    return newImage!
}

스위프트 3

myButton의 폭과 높이를 40으로 설정했고 EdgeInsetsMake의 패딩은 모두 15입니다.실제 패딩을 보려면 버튼에 배경색을 추가하는 것이 좋습니다.

myButton.backgroundColor = UIColor.gray // sample color to check padding
myButton.imageView?.contentMode = .scaleAspectFit
myButton.imageEdgeInsets = UIEdgeInsetsMake(15, 15, 15, 15)

Swift 3용으로 업데이트됨

yourButtonName.imageEdgeInsets = UIEdgeInsetsMake(10, 10, 10, 10)

이미지 삽입물을 가지고 놀고 싶지 않고 자동 레이아웃을 사용하는 경우(아마도 사용했을 것입니다), 이미지 뷰에 크기 제한을 추가하는 방법도 있습니다.구속조건의 우선순위가 999인지 확인합니다.그렇지 않으면 자동 레이아웃이 불만입니다.

guard let imageView = button.imageView else { return }

let size = CGSize(width: 20, height: 20)
let sizeConstraints = [
    imageView.widthAnchor.constraint(equalToConstant: size.width),
    imageView.heightAnchor.constraint(equalToConstant: size.height)
]
imageView.translatesAutoresizingMaskIntoConstraints = false
sizeConstraints.forEach { $0.priority = UILayoutPriority(rawValue: priority) }
NSLayoutConstraint.activate(sizeConstraints)
imageView.contentMode = .scaleAspectFit

이미지 사이즈도 버튼 사이즈와 같기 때문에, 버튼의 배경에 다음과 같이 이미지를 넣는다고 생각합니다.

[myLikesButton setBackgroundImage:[UIImage imageNamed:@"icon-heart.png"] forState:UIControlStateNormal];

당신의 마스트는 같은 크기의 이미지와 버튼을 가지고 있다. 나는 당신이 내 요점을 이해하길 바란다.

언급URL : https://stackoverflow.com/questions/10576593/how-to-adjust-an-uibuttons-imagesize

반응형