Das Einstellen des Eckenradius in UIImageView funktioniert nicht


129

Ich bin ein bisschen ratlos. Ich habe die Layer-Eigenschaft von UIView verwendet, um die Ecken mehrerer Elemente in meiner App abzurunden. Diese eine UIImageView entspricht jedoch einfach nicht. Ich bin mir nicht sicher, was mir fehlt.

Die UIImageView (VorschauImage genannt) ist in einer Tabellenansichtszelle enthalten. Ich habe versucht, die CornerRadius-Eigenschaft auf mehrere Speicherorte (in der Zelle selbst und in dem Controller, der die Zelle erstellt) festzulegen, ohne Erfolg.

static NSString *CellIdentifier = @"MyTableViewCell";

MyTableViewCell *cell = (MyTableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
    NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:CellIdentifier owner:self options:nil];
    cell = [topLevelObjects objectAtIndex:0];
    cell.previewImage.layer.cornerRadius = 20; //Made it 20 to make sure it's obvious.
}

Gibt es etwas an der Art und Weise, wie Zellen geladen werden, das mir fehlt?

Antworten:


376

Sie müssen die masksToBoundsEigenschaft der Ebene auf Folgendes festlegen YES:

cell.previewImage.layer.masksToBounds = YES;

Dies liegt daran, dass das UIImageViewSteuerelement eine Pseudo-Unteransicht erstellt, in der das UIImageObjekt gespeichert ist .


19
Sofern Sie die Ansicht nicht auch rastern (view.layer.shouldRasterize = YES), erfordert jeder Frame eine erneute Maskierung aller Pixel.
jjxtra

@jjxtra also ist es besser zu setzen shouldRasterize = false?
user924

Wenn shouldRasterize false ist, zahlen Sie den Overhead für die Maskenerstellung für jeden Frame. Wenn shouldRasterize true ist und Ihre Ebene jeden Frame ändert, zahlen Sie den Masken-Overhead und den Rasterisierungs-Overhead. Idealfall ist eine statische (sich nicht sehr oft ändernde) Ebene mit shouldRasterize = true.
jjxtra

29

Erwähnenswert ist auch das

  1. Wenn Sie AspectFit AND CornerRadius mit ClipsToBounds / MaskenToBounds verwenden, werden die abgerundeten Ecken nicht angezeigt.

dh wenn Sie dies haben

theImageView.contentMode = .scaleAspectFit

und

   theImageView.layer.cornerRadius = (theImageView.frame.size.height)/2
    theImageView.clipsToBounds = true

oder

theImageView.layer.masksToBounds = true

Es wird nicht funktionieren . Sie müssen den aspectFit-Code entfernen

//theImageView.contentMode = .scaleAspectFit
  1. Stellen Sie sicher, dass die Breite und Höhe der Bildansicht gleich sind

Kurz gesagt: Stellen Sie das Seitenverhältnis 1: 1 ein, wenn Sie AspectFit
djdance

22

Das sollte funktionieren

cell.previewImage.clipsToBounds = YES;

cell.previewImage.layer.cornerRadius = 20;

3
Nicht sicher clipsToBoundsist eine Methode für die spätere Klasse. Glaube, es ist masksToBoundswie oben.
Alfie Hanssen

4
@ AlfieHanssen Ebenen haben MaskenToBounds:, Ansichten haben ClipsToBounds:
Kevin

11

Ich glaube, Sie müssen festlegen:

cell.previewImage.layer.masksToBounds = YES;
cell.previewImage.layer.opaque = NO;

4

Wenn Sie im Xcode Interface Builder das Zeichnungsattribut "Clip-Unteransichten" für die Ansicht auswählen und den Eckenradius im Code festlegen, cell.previewImage.layer.cornerRadius = 20;erledigt dies die Aufgabe für mich!

Siehe Option "Clip-Unteransichten" in IB


2

Versuchen Sie dies unten Code

cell.previewImage.layer.cornerRadius = 20;
cell.previewImage.clipsToBounds = YES;

2

Versuchen Sie diesen Code: -

self.imgaviewName.clipsToBounds = true
self.imageviewName.layer.cornerRadius = 10

Von Nur-Code-Antworten wird abgeraten. Klicken Sie auf Bearbeiten und fügen Sie einige Wörter hinzu, die zusammenfassen, wie Ihr Code die Frage beantwortet, oder erklären Sie möglicherweise, wie sich Ihre Antwort von der vorherigen Antwort / den vorherigen Antworten unterscheidet. Danke
Nick

1

Denn imageView.contentMode = .scaleAspectFilldas cornerRadiuswird nicht angewendet, wenn das Bild je nach Hardware sehr groß ist.

Einige Tests mit vergrößerten Panoramabildern:

  • iPhone X, Bildgröße 5000x1107: 🚫 4000x886: ✅
  • iPhone 6s Plus, Bildgröße 10000 x 2215: x 5000 x 1107: ✅
  • iPhone 6s, Bildgröße 10000 x 2215: x 5000 x 1107: ✅

Die imageView-Abmessungen waren 160 x 100. Interessanterweise ist die neuere Hardware nicht unbedingt leistungsfähiger.

Fühlen Sie sich frei, diesen Beitrag mit mehr Testergebnissen zu bearbeiten!


0
-(void) viewDidAppear:(BOOL)animated{
       [super viewDidAppear:animated];
       [self setMaskTo:viewDistance 
             byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight];
           }

- (void)setMaskTo:(UIView*)view byRoundingCorners:(UIRectCorner)corners
     {
      UIBezierPath *rounded = [UIBezierPath 
                bezierPathWithRoundedRect:view.bounds
                                              byRoundingCorners:corners

                     cornerRadii:CGSizeMake(20.0, 20.0)];

          CAShapeLayer *shape = [[CAShapeLayer alloc] init];
          shape.frame = self.view.bounds;
         [shape setPath:rounded.CGPath];
          view.layer.mask = shape;
       }

0

Swift 4.2 Antwort:

Damit der Eckenradius funktioniert, fügen Sie das Bild zu a hinzu, UIViewund setzen Sie die masksToBoundsBildeigenschaft auf true:

planeImage.layer.masksToBounds = true
planeImage.layer.cornerRadius = 20

Hinweis: Ersetzen Sie 20 durch das gewünschte cornerRadius


0

Nichts aus den vorherigen Antworten funktioniert?

Es kann vorkommen, dass die Größe von UIImageView größer als die Bildgröße ist. Der Eckenradius kann gut eingestellt werden, ist in diesem Fall jedoch nicht sichtbar.

Schnelle Überprüfung der UIImageView-Größe nach Code: (oder verwenden Sie das Tool "UI-Hierarchie anzeigen" in XCode)

self.imageView.backgroundColor = [UIColor greenColor]; 

In diesem Szenario sollten Sie sicherstellen, dass UIImageView das gleiche Seitenverhältnis wie das Bild hat.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.