UIViewContentModeScaleAspectFill schneidet nicht ab

144

Ich versuche, einige Miniaturbilder in einer festen Größe (100 x 100) mit zu zeichnen UIImageView. Ich habe die Bildgröße meiner Bildansicht auf 100 x 100 festgelegt und contentModeauf UIViewContentModeScaleAspectFill.

Mein Verständnis ist, dass dies dazu führen sollte, dass das Bild in der von mir festgelegten Größe gezeichnet wird und das Bild den Bereich des Bildes ausfüllt und alle Teile des Bildes ausschneidet, die außerhalb der für die Bildansicht festgelegten Größe liegen. Das Bild wird jedoch immer noch größer oder kleiner als die von mir festgelegte Größe von 100 x 100 gezeichnet.

Wenn ich das contentModeauf setze UIviewContentModeScaleToFill, wird das Bild mit genau 100 x 100 gezeichnet, aber es ist verzerrt, um in diese Dimensionen zu passen. Irgendwelche Ideen, warum die Aspektfüllung nicht wie erwartet abgeschnitten wird?

Hier ist mein Code:

_photoView = [[UIImageView alloc] initWithImage:photoImage];
_photoView.contentMode = UIViewContentModeScaleAspectFill;
[self addSubview:_photoView];

CGRect photoFrame = _photoView.frame;
photoFrame.size = CGSizeMake(100, 100);
_photoView.frame = photoFrame;

Zur besseren Veranschaulichung hier ein Screenshot von dem, was ich sehe. Die grünen Quadrate UIViewenthalten die, mit denen UIImageViewich arbeite. Ich habe ihre Hintergrundfarbe auf Grün und den Rahmen der Ansicht auf 100x100 eingestellt. Als Test sind die UIImageViewsauf 50x50 dimensioniert. Wie Sie sehen können ...AspectFill, sind die Bilder bei Verwendung von nicht auf 50 x 50 dimensioniert und in einigen Fällen von der gewünschten Stelle versetzt. Bei Verwendung ...ScaleToFillhaben sie die richtige Größe, aber das Bild ist verzerrt.

Screenshot zur Veranschaulichung des Problems

Josh Bühler
quelle

Antworten:

352

Können Sie versuchen, den Clip auf Grenzen zu setzen?

[_photoview setClipsToBounds:YES];

Oder direkt in Ihrem Storyboard / Xib, wenn Sie können:

Geben Sie hier die Bildbeschreibung ein

imthi
quelle
10
Das war es - danke. (Ich habe den Screenshot oben hinzugefügt, um besser zu zeigen, was ich gesehen habe, eher als Beispiel, wenn jemand anderes auf dieses Problem stößt.)
Josh Buhler
3
In InterfaceBuilder, umbenannt (nicht hilfreich) in "Clips-Unteransichten" umbenannt (Hinweis: In diesem Fall werden keine "Unteransichten" angezeigt, der Name ist falsch: Es werden SELBST- UND Unteransichten abgeschnitten)
Adam
3
Das Aktivieren der Option "Clip-Unteransichten" in der NIB-Datei bewirkt dasselbe. Prost.
Codeburn
Aber was ist, wenn Sie einen Schatten mit der CALayer-Eigenschaft hinzufügen möchten :( Das Hinzufügen einer weiteren Ansicht dahinter ist für mich nicht ideal
Rambatino
Wenn Sie Auto Layout wie ich verwenden, gibt es eine andere mögliche Ursache, nämlich NSLayoutConstraint "UIView-Encapsulated-Layout-Height", das die Größenbeschränkungen von UIImageView verletzt.
ewiinnnnn
8

Wenn Sie Ihr Wissen erweitern möchten, gibt es einen wirklich guten Artikel darüber, wie der iOS UIView-Stack gerendert wird . Es gibt auch einen ausführlicheren Artikel über die gesamte Zeichnungspipeline .

Zusammenfassend:

  1. Rasterisierung - Der gesamte Inhalt der Ansicht wird im Koordinatenraum der Grenzen der Ansicht gerastert (gezeichnet oder ein Pixelpuffer außerhalb des Bildschirms). Dies können Bilddaten oder benutzerdefinierte Zeichnungen (dh drawRect:) sein, aber Unteransichtsinhalte. Diese Rasterung berücksichtigt die contentModeEigenschaft.

    Alles, was außerhalb der Grenzen einer Ansicht liegt, wird verworfen.

  2. Zusammensetzung - Die Ergebnisse werden von der Unteransicht bis zur Übersicht zusammengesetzt (übereinander gezeichnet). Dies verwendet die Rahmeneigenschaft der Unteransicht.

    Wenn sich die clipsToBoundsEigenschaft YESin der Übersicht befindet, werden Inhalte der Unteransicht außerhalb ihrer Grenzen verworfen .

Robert
quelle
2

hatte das gleiche Problem und es wurde durch Aktivieren von "Clip Subviews" behoben.

Das Bild wurde in der Storyboard-Vorschau für alle Ansichten (3.5,4,4.7,5.5, ipad) korrekt angezeigt, jedoch nicht im Simulator.

Nachdem ich "Clip Subviews" angekreuzt hatte, wurde das Problem behoben. :) :)

Brackston Mayhall
quelle
1

Das Aktivieren von "Clip-Unteransichten" direkt im Storyboard / Xib hat auch bei mir funktioniert. Geben Sie hier die Bildbeschreibung ein

Maxime T.
quelle
0

Die Größe meiner Unteransichten wurde geändert, und mir wurde klar, dass für das xib das automatische Layout festgelegt war: Geben Sie hier die Bildbeschreibung ein

Alistair
quelle
0

Wenn alles fehlschlägt,

Führen Sie die Clips in der viewDidLayoutSubviews-Methode bis an die Grenzen aus.

Beispiel:

  override func viewDidLayoutSubviews() {

    imageProfile.layer.cornerRadius = imageProfile.bounds.size.width/2
    imageProfile.clipsToBounds = true
    imageProfile.layer.masksToBounds = true
 }
Bharathi Kumar
quelle