web-dev-qa-db-fra.com

Comment ajuster la taille de l'image UIButton?

Comment puis-je ajuster la taille de l'image de l'UIButton? Je règle l'image comme ceci:

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

Cependant, cela remplit l'image jusqu'au bouton complet, comment puis-je réduire la taille de l'image?

iosobjective-cxcodeuibutton
132
adit

Si je comprends bien ce que vous essayez de faire, vous devez jouer avec les boutons image Encadré. Quelque chose comme:

myLikesButton.imageEdgeInsets = UIEdgeInsetsMake(top, left, bottom, right);
213
Tim C

La réponse de Tim est correcte, mais je souhaitais ajouter une autre suggestion car, dans mon cas, il y avait une solution plus simple.

Je cherchais à définir les incrustations d'image UIButton, car je n'avais pas réalisé que je pouvais définir le mode de contenu sur le bouton UIImageView, ce qui aurait évité d'utiliser UIEdgeInsets et des valeurs codées en dur. . Accédez simplement à la vue d'image sous-jacente sur le bouton et définissez le mode contenu:

myButton.imageView.contentMode = UIViewContentModeScaleAspectFit;

Voir IButton n'écoute pas le réglage du mode contenu?

Swift 3 

myButton.imageView?.contentMode = .scaleAspectFit
86
Kyle Clegg

Swift 3:

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

vous pouvez utiliser la propriété imageEdgeInsets Les marges d’encadrement ou de sortie du rectangle autour de l’image du bouton.

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

Une valeur positive réduit ou insère ce Edge en mouvement. Une valeur négative développe ou confine ce bord.

23
safaa elgendi

Si votre image est trop grande (et que vous ne pouvez pas/ne voulez pas simplement réduire l'image), une combinaison des deux premières réponses fonctionne à merveille.

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

À moins que les encarts d'image soient corrects, l'image sera biaisée sans changer le paramètre contentMode.

19
iosjillian

Voici la version Swift:

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

Swift 4

Vous devrez utiliser ces deux lignes de code, dans cet ordre spécifique. Tout ce dont vous avez besoin est de changer les valeurs supérieure et inférieure des incrustations Edge.

addButton.imageView?.contentMode = .scaleAspectFit
addButton.imageEdgeInsets = UIEdgeInsetsMake(10.0, 0.0, 10.0, 0.0)
7
Van Du Tran

Avec l'aide de réponse de Tim C , j'ai pu créer une extension sur UIButton à l'aide de Swift qui vous permet de spécifier le cadre de l'image à l'aide de la .setImage() fonction avec un paramètre supplémentaire 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
            )
        }
    }

}

En utilisant cela, si vous voulez définir le cadre d'un UIButton sur CGRectMake(0, 0, 64, 64), et définir l'image de celle-ci sur myImage avec un cadre de CGRectMake(8, 8, 48, 48), vous pouvez utiliser

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

Lorsque vous modifiez la taille de l'icône avec UIEdgeInsetsMake(top, left, bottom, right), gardez à l'esprit les dimensions des boutons et la capacité de UIEdgeInsetsMake à utiliser des valeurs négatives comme si elles étaient positives.

Exemple: Deux boutons de hauteur 100 et d’aspect 1: 1.

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

enter image description here

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

enter image description here

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

enter image description here

Les exemples 1 et 3 sont identiques puisque ABS (100 - (40 + 40)) = ABS (100 - (60 + 60))

6
Borys Tkachenko

Une approche consiste à redimensionner UIImage dans le code comme suit. Remarque: ce code est uniquement mis à l'échelle par la hauteur, mais vous pouvez également facilement ajuster la fonction à l'échelle par la largeur.

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!
}
2
Crashalot

Swift 3

Je règle la largeur et la hauteur de myButton sur 40 et le remplissage de EdgeInsetsMake est de 15 sur tous les côtés. Je suggère d'ajouter une couleur de fond à votre bouton pour voir le remplissage actuel.

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

Mise à jour pour Swift

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

Voici l'autre solution à l'échelle imageView of UIButton.

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