Animieren eines UIImage oder UIImageView?

Question

Ich versuche, die Höhe eines Bildes zu animieren (von einer Höhe von 0 Pixeln auf 480 Pixel), um den Effekt zu erzeugen, dass das Bild von oben nach unten gerendert wird.

Bei einer UIImageView ist mir aufgefallen, dass sie im Interface Builder korrekt erscheint. Aber wenn es im Simulator läuft, wird die Größe (Breite und Höhe) immer auf die Größe des Bildes eingestellt. Das heißt, wenn ich die Höhe der Bildansicht auf 50 % der ursprünglichen Höhe einstelle, wird das Bild immer noch in voller Höhe gerendert.

Ich habe auch versucht, diesen Effekt mit einem UIImage zu erzielen. Doch obwohl die Größe des Bildes korrekt erscheint, wird das Bild so skaliert, dass es die Größe/das Seitenverhältnis widerspiegelt.

Frage: Wie kann ich diese dynamische Größenanpassung (d.h. Animation der Größe eines Bildes) erreichen, ohne das Bild zu skalieren? Ich dachte über die Verwendung von CGImageCreateWithMask, aber im ziemlich sicher, dass würde riesige Leistung Schluckauf erstellen.

* Aktualisieren *

Der Effekt, den ich suche, ist der folgende: Animieren Sie ein Bild, indem Sie es in der Höhe wachsen lassen, von unten nach oben (wie eine Reihe von Jalousien an einem Fenster gezogen werden). Dieses Bild kann nicht skaliert werden (da es sonst den visuellen Effekt einer "Jalousie" verlieren würde). Dieses Bild muss außerdem über einem anderen Bild gerendert werden. Es gibt also insgesamt 2 Bilder.

* ANTWORT *

Für die oberste Bildansicht habe ich den Inhaltsmodus auf Oben gesetzt (damit sie nicht skaliert). Dann in Code, ich setze die clipsToBounds auf True. Jetzt bin ich in der Lage, die oberste imageview Höhe so geben mir den Effekt, den ich suche zu animieren.

Answer 1

Verwenden Sie einen Animationsblock wie diesen:

imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 320, 0)];
imageView.image = ...;
[imageView setClipsToBounds:YES];
[imageView setContentMode:UIViewContentModeTop];

[self.view addSubview:imageView];
[imageView release];

[UIView animateWithDuration:4.0f
                      delay:1.0f
                    options:UIViewAnimationOptionCurveEaseIn
                 animations:^(void) {
                     imageView.frame = CGRectMake(0, 0, 320, 480);
                 }
                 completion:NULL];

Answer 2

Sie sollten sich auch Animation Blocks ansehen. Sie sind hier recht ausführlich dokumentiert:

http://developer.apple.com/library/ios/#documentation/WindowsViews/Conceptual/ViewPG_iPhoneOS/AnimatingViews/AnimatingViews.html

Der gesamte Code dort ist relevant, weil UIImageView eine Unterklasse von UIView ist.

Viel Spaß beim Kodieren.

Answer 3

Nur ein Vorschlag: Nehmen Sie an, Sie haben zwei Bilder: A und X (das Röntgenbild):

+-------+               +-------+
|       |               |       |
|       |               |       |
|   A   |               |   X   |
|       |               |       |
|       |               |       |
+-------+               +-------+

Sie können dynamisch ein Bild mit einer Höhe von einem Pixel (temp) erstellen, den Inhalt von X teilweise kopieren und über A legen:

+-------+   +-------+   +-------+
|       |   | temp1 | < |       |
|       |   +-------+   |       |
|   A   |               |   X   |
|       |               |       |
|       |               |       |
+-------+               +-------+

In einer Schleife das temporäre Bild dynamisch erstellen/vergrößern und weitere Inhalte aus X kopieren:

+-------+   +-------+   +-------+
|       |   | temp2 | < |       |
|       |   |       |   |       |
|   A   |   +-------+   |   X   |
|       |               |       |
|       |               |       |
+-------+               +-------+

+-------+   +-------+   +-------+
|       |   | temp3 | < |       |
|       |   |       |   |       |
|   A   |   |       |   |   X   |
|       |   +-------+   |       |
|       |               |       |
+-------+               +-------+
+-------+   +-------+   +-------+
|       |   | temp4 | < |       |
|       |   |       |   |       |
|   A   |   |       |   |   X   |
|       |   |       |   |       |
|       |   +-------+   |       |
+-------+               +-------+

+-------+   +-------+   +-------+
|       |   | tempX | < |       |
|       |   |       |   |       |
|   A   |   |       |   |   X   |
|       |   |       |   |       |
|       |   |       |   |       |
+-------+   +-------+   +-------+

Answer 4

Wie im ursprünglichen Beitrag erwähnt, ist hier die Antwort, über die ich scheinbar gestolpert bin:

Für die oberste Bildansicht habe ich den Inhaltsmodus auf Oben gesetzt (damit sie nicht skaliert). Dann in Code, ich setze die clipsToBounds auf True. Jetzt bin ich in der Lage, die oberste imageview Höhe so geben mir den Effekt, den ich suche zu animieren.

Answer 5

Versuchen Sie, die UIImageView's contentMode Eigenschaft auf einen der folgenden Werte. Ich denke, was Sie brauchen ist UIViewContentModeScaleAspectFit :

typedef enum {
    UIViewContentModeScaleToFill,
    UIViewContentModeScaleAspectFit,      // contents scaled to fit with fixed aspect. remainder is transparent
    UIViewContentModeScaleAspectFill,     // contents scaled to fill with fixed aspect. some portion of content may be clipped.
    UIViewContentModeRedraw,              // redraw on bounds change (calls -setNeedsDisplay)
    UIViewContentModeCenter,              // contents remain same size. positioned adjusted.
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
} UIViewContentMode;