UIButton'ın imageView'ini nasıl ölçeklendirebilirim?


81

Kullanarak bir görüntü ile "button" adında bir UIButton örneği oluşturdum [UIButton setImage:forState:]. Button.frame, görüntünün boyutundan daha büyük.

Şimdi bu düğmenin görüntüsünü küçültmek istiyorum. Ben değiştirmeyi denedim button.imageView.frame, button.imageView.boundsve button.imageView.contentMode, ancak tüm etkisiz görünmektedir.

UIButtonBirinin imageView'unu ölçeklememe yardım eden var mı?

Şöyle yarattım UIButton:

UIButton *button = [[UIButton alloc] init];
[button setImage:image forState:UIControlStateNormal];

Görüntüyü şu şekilde ölçeklendirmeye çalıştım:

button.imageView.contentMode = UIViewContentModeScaleAspectFit;
button.imageView.bounds = CGRectMake(0, 0, 70, 70);

ve bu:

button.imageView.contentMode = UIViewContentModeScaleAspectFit;
button.imageView.frame = CGRectMake(0, 0, 70, 70);

Yanıtlar:


90

Orijinal poster için bulduğum çözüm şu:

commentButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;

Bu, düğmenizin yatay olarak ölçeklenmesini sağlayacaktır. Dikey bir ayar da var.

Bunu anlamam birkaç saatimi aldı (mülkün adı çok mantıksız), bu yüzden paylaşacağımı düşündüm.


iyi öneri! Sorunum, sol çubuk öğe düğmesinin boyutunu değiştirmek için uzatılmış görüntüyü ölçeklendirmekti.
Valerii Pavlov

1
Bu çalışır, ancak sınırların dışına çıkmaz, metni kenar boşluklarını geçmeyecek bir satırda hizalamak gibi düşünün. Bu nedenle, UIViewContentModeScaleAspectFill gibi etkiyi (görüntünün bir kısmı kırpılmış olarak) bundan alamazsınız.
Hlung

67

Benzer bir sorunla karşılaştım, bir arka plan Resmim (kenarlıklı) ve özel bir düğme için bir resim (bayrak). Bayrağın küçültülmesini ve ortalanmasını istedim. İmageView özniteliğini değiştirmeyi denedim ama başarılı olamadım ve bu resmi görüyordum -

görüntü açıklamasını buraya girin

Deneylerim sırasında şunları denedim:

button.imageEdgeInsets = UIEdgeInsetsMake(kTop,kLeft,kBottom,kRight)

Beklenen sonucu şu şekilde elde ettim:

görüntü açıklamasını buraya girin


42

XIB dosyasında yapılandırma için bir Ek Yol. Metin veya görüntünün UIButton'da Ölçekle tam dolgulu olmasını istiyorsanız bu seçeneği seçebilirsiniz. Kod ile aynı olacak.

UIButton *btn = [UIButton new];

btn.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;
btn.contentVerticalAlignment   = UIControlContentVerticalAlignmentFill;

görüntü açıklamasını buraya girin


UIButton için görüntüyü uzatmak istiyorsanız, o zaman görüntü varlığı ve bu görüntüyü dilimlemek için daha fazla destek kullanabilirsiniz. developer.apple.com/library/ios/recipes/…
Linh Nguyen

Bu yöntemin farkında bile değildim. Rock on
Michael McKenna

23

kullanım

button.contentMode = UIViewContentModeScaleToFill;

değil

button.imageView.contentMode = UIViewContentModeScaleAspectFit;

Güncelleme:

@Chris'in yorumladığı gibi,

Bunun setImage: forState: için çalışmasını sağlamak üzere yatay olarak ölçeklemek için aşağıdakileri yapmanız gerekir: myButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;


3
Bu, [düğme setBackgroundImage: forState:] ile birlikte harika çalışır. Teşekkürler.
Jason DeFontes

Jason'ın tam olarak ne söylediğine dikkat edin ve iyi olacaksınız. O değil setImage için çalışma: forState:
dpjanes

7
Bunun setImage: forState: için çalışmasını sağlamak üzere yatay olarak ölçeklemek için aşağıdakileri yapmanız gerekir: myButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;
Chris

15
    UIButton *button= [[UIButton alloc] initWithFrame:CGRectMake(0,0,70,70)];
    button.buttonType = UIButtonTypeCustom;
    UIImage *buttonImage = [UIImage imageNamed:@"image.png"];

    UIImage *stretchableButtonImage = [buttonImage stretchableImageWithLeftCapWidth:12 topCapHeight:0]; 
    [button setBackgroundImage:stretchableButtonImage forState:UIControlStateNormal]; 

@EEE Teşekkürler.Ama 2 sorun var: 1. Sorum UIButton'ın _imageView değişkenini kullanmak, _backgroundView değişkenini değil. Bunu backgroundView ile yapmak zorunda mıyım? 2. [UIImage stretchableImageWithLeftCapWidth: topCapHeight:] işlevi yalnızca görüntüyü büyütebilir, ancak görüntüyü küçültemez. Yine de teşekkürler, cevabınız başka bir sorumu çözüyor: Düğmenin üzerine arkasındaki resimle bir başlık çizmek istiyorum. _BackgroundImage'ın bana yardımcı olabileceğini düşünüyorum. Bu sorunun daha iyi bir cevabı var mı?
vcLwei

Ne yapmaya çalıştığını anlıyorum ve yol bu. Resminiz daha büyükse, bir araç kullanarak yeniden boyutlandırın ve yapmak istediğiniz her şey yapılacaktır. _İmageview ile zamanınızı boşa harcamayın. Bu arada, bu asnwer'ı beğendiyseniz, oylayıp kabul edebilirsiniz
EEE

Görüntünüzü MacOS'taki Önizleme programında yeniden boyutlandırabilirsiniz. Sadece resmi açın ve araçları seçin -> Adjustsize
EEE

@EEE Evet, bir araç kullanarak resmimi yeniden boyutlandırabilirim. Ancak uygulamamda bazen daha büyük resme de ihtiyacım oluyor, sadece boyut olarak farklılık gösteren iki benzer resim istemiyorum, bu da alanı boşa harcıyor. Ve sorumu çözmenin başka bir yolu da, daha küçük bir görüntü elde etmek için CGBitmapContext'i kullanabilmem, ancak sanırım bu yol, _imageview kullanmaya kıyasla daha zahmetli. Oy vermememin nedeni itibarımın 15'ten az olması, aslında bunu gerçekten yapmak istiyorum. Teşekkürler!
vcLwei

10

Bu çözümü buldum.

1) Aşağıdaki yöntemleri alt sınıflara ayırın: UIButton

+ (id)buttonWithType:(UIButtonType)buttonType {
    MyButton *toReturn = [super buttonWithType:buttonType];
    toReturn.imageView.contentMode = UIViewContentModeScaleAspectFit;
    return toReturn;
}

- (CGRect)imageRectForContentRect:(CGRect)contentRect {
    return contentRect;
}

Ve iyi çalışıyor.


- (CGRect) backgroundRectForBounds: (CGRect) arka plan görüntüsü için sınırlar.
Ricky

9

Garip, benim için çalışan tek kombinasyon (iOS 5.1) ...

button.imageView.contentMode = UIViewContentModeScaleAspectFit;

ve

[button setImage:newImage forState:UIControlStateNormal];


Başlangıçta kullandım: button.contentMode = UIViewContentModeScaleAspectFit; şimdi ayrıca button.imageView.contentMode = UIViewContentModeScaleAspectFit yazmam gerekiyor; en boy oranını iPad 3 retinasında korumak için
Enrico Detoma

8

Yapmanız gereken (Tasarımdan VEYA Koddan):

Tasarımdan

  1. Xib OR Storyboard'unuzu açın.
  2. Seç düğmesi
  3. Inside Attribute Inspector (Sağ taraf)> "Kontrol" bölümünde> hem Yatay hem de Dikey için son dördüncü seçeneği seçin .

[Nokta 3 için: Yatay ve Dikey Hizayı Değiştirin UIControlContentHorizontalAlignmentFill and UIControlContentVericalAlignmentFill]

Koddan

button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;
button.contentVerticalAlignment =  UIControlContentVerticalAlignmentFill;


5

bunun gibi sorununuzu çözebilirsiniz:

+ (UIImage*)resizedImage:(UIImage*)image
{
 CGRect frame = CGRectMake(0, 0, 60, 60);
 UIGraphicsBeginImageContext(frame.size);
 [image drawInRect:frame];
 UIImage* resizedImage = UIGraphicsGetImageFromCurrentImageContext();
 UIGraphicsEndImageContext();

 return resizedImage;
}

5

Burada okuduktan sonra yaptığım küçük testten, setImage veya setBackgroundImage kullanmanıza bağlı olarak, ikisi de aynı sonucu verdi ve görüntüyü akıttı

//for setBackgroundImage
 self.imageButton.contentMode = UIViewContentModeScaleAspectFill;
        [self.imageButton setBackgroundImage:[UIImage imageNamed:@"imgFileName"] forState:UIControlStateNormal];

//for setImage
 self.imageButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;
        self.imageButton.contentVerticalAlignment = UIControlContentVerticalAlignmentFill;
    [self.imageButton setImage:[UIImage imageNamed:@"imgFileName"] forState:UIControlStateNormal];

çok teşekkürler ... düğme boyutundan daha küçük boyutlu küçük resmi sığdırmak için mükemmel çözüm ...
Fahim Parkar

4
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;
button.contentVerticalAlignment =  UIControlContentVerticalAlignmentFill;

3

Storyboard

İçinde belirli özellik tanımlamak gerekir Runtime Attributes of Kimlik denetçisi - imageView.contentModel, sen nispeten değerini nerede rawValueenum pozisyonunda UIViewContentMode. 1, scaleAspectFit anlamına gelir .

Storyboard'da button.imageView.contentMode'u ayarlayın

Ve Özellikler denetçisinde düğmenin hizalaması :

Düğmenin tam hizalanması


2

BackgroundImage otomatik olarak ölçeklendiğinden, bu da çalışacaktır.

[button setBackgroundImage:image forState:UIControlStateNormal];


1

_İmageView ile bir çözüm kullanamıyorum, ancak CGContextRefçözmek için a kullanabilirim . Kullanımı UIGraphicsGetCurrentContextcurrentContextRef almak ve currentContextRef bir görüntü çizmek ve daha sonra ölçeklendirme veya görüntüyü döndürmek ve yeni bir imaj oluşturmak için. Ama mükemmel değil.

kod:

-(UIImage*) scaleAndRotateImage:(UIImage*)photoimage width:(CGFloat)bounds_width height:(CGFloat)bounds_height;
{
    CGImageRef imgRef = photoimage.CGImage;

    CGFloat width = CGImageGetWidth(imgRef);
    CGFloat height = CGImageGetHeight(imgRef);

    CGAffineTransform transform = CGAffineTransformIdentity;
    CGRect bounds = CGRectMake(0, 0, width, height);

    bounds.size.width = bounds_width;
    bounds.size.height = bounds_height;

    CGFloat scaleRatio = bounds.size.width / width;
    CGFloat scaleRatioheight = bounds.size.height / height;
    CGSize imageSize = CGSizeMake(CGImageGetWidth(imgRef), CGImageGetHeight(imgRef));
    CGFloat boundHeight;
    UIImageOrientation orient = photoimage.imageOrientation;
    switch(orient)
    {
        case UIImageOrientationUp: //EXIF = 1
            transform = CGAffineTransformIdentity;
            break;

        case UIImageOrientationUpMirrored: //EXIF = 2
            transform = CGAffineTransformMakeTranslation(imageSize.width, 0.0);
            transform = CGAffineTransformScale(transform, -1.0, 1.0);
            break;

        case UIImageOrientationDown: //EXIF = 3
            transform = CGAffineTransformMakeTranslation(imageSize.width, imageSize.height);
            transform = CGAffineTransformRotate(transform, M_PI);
            break;

        case UIImageOrientationDownMirrored: //EXIF = 4
            transform = CGAffineTransformMakeTranslation(0.0, imageSize.height);
            transform = CGAffineTransformScale(transform, 1.0, -1.0);
            break;

        case UIImageOrientationLeftMirrored: //EXIF = 5
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeTranslation(imageSize.height, imageSize.width);
            transform = CGAffineTransformScale(transform, -1.0, 1.0);
            transform = CGAffineTransformRotate(transform, 3.0 * M_PI / 2.0);
            break;

        case UIImageOrientationLeft: //EXIF = 6
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeTranslation(0.0, imageSize.width);
            transform = CGAffineTransformRotate(transform, 3.0 * M_PI / 2.0);
            break;

        case UIImageOrientationRightMirrored: //EXIF = 7
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeScale(-1.0, 1.0);
            transform = CGAffineTransformRotate(transform, M_PI / 2.0);
            break;

        case UIImageOrientationRight: //EXIF = 8
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeTranslation(imageSize.height, 0.0);
            transform = CGAffineTransformRotate(transform, M_PI / 2.0);
            break;

        default:
            [NSException raise:NSInternalInconsistencyException format:@"Invalid?image?orientation"];
            break;
    }

    UIGraphicsBeginImageContext(bounds.size);

    CGContextRef context = UIGraphicsGetCurrentContext();

    if (orient == UIImageOrientationRight || orient == UIImageOrientationLeft)
    {
        CGContextScaleCTM(context, -scaleRatio, scaleRatioheight);
        CGContextTranslateCTM(context, -height, 0);
    }
    else
    {
        CGContextScaleCTM(context, scaleRatio, -scaleRatioheight);
        CGContextTranslateCTM(context, 0, -height);
    }

    CGContextConcatCTM(context, transform);

    CGContextDrawImage(UIGraphicsGetCurrentContext(), CGRectMake(0, 0, width, height), imgRef);
    UIImage *imageCopy = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return imageCopy;
}

1

Umarım bu başka birine yardımcı olabilir:

Swift 3+

button.contentHorizontalAlignment = UIControlContentHorizontalAlignment.fill
button.contentVerticalAlignment =  UIControlContentVerticalAlignment.fill


0

@JosephH'den

contentHorizontalAlignment = UIControl.ContentHorizontalAlignment.fill contentVerticalAlignment = UIControl.ContentVerticalAlignment.fill


-1

Her UIButton'un kendine ait bir gizli UIImageView öğesi vardır. Bu yüzden içerik modunu aşağıdaki gibi ayarlamalıyız ...

[[btn imageView] setContentMode: UIViewContentModeScaleAspectFit];
[btn setImage:[UIImage imageNamed:imageName] forState:UIControlStateNormal];

-1

XCode 8'de ekran görüntüsü

Ekran görüntüsünün sol alt tarafında Esnetme özelliklerini görebilirsiniz. Bunları kullanmayı dene.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.