Wie animiere ich die Breite und Höhe eines UIView in Xcode?
Ich habe diese Unteransicht, die ich meiner Hauptansicht hinzufügen möchte, sie aber vom Ursprung aus erweitern lassen. Ich habe einige Apple-Dokumentationen gelesen, weiß aber nicht, wo ich Fehler mache. Ich kann den Ursprung des Rahmens animieren, d. H., Um ihn von überall her einzuschieben, aber die Breite/Höhe scheint nicht zu animieren. Code wie folgt:
[UIView beginAnimations:@"animateAddContentView" context:nil];
[UIView setAnimationDuration:0.4];
customView.frame= CGRectMake(self.view.frame.Origin.x +5, self.view.frame.Origin.y +5, 0, 150);
[self.view addSubview:customView];
customView.frame= CGRectMake(self.view.frame.Origin.x +5, self.view.frame.Origin.y +5, 310, 150);
[UIView commitAnimations];
Ich habe auch versucht, nur den setFrame-Teil wie folgt in die Animation einzufügen:
customView.frame= CGRectMake(self.view.frame.Origin.x +5, self.view.frame.Origin.y +5, 0, 150);
[self.view addSubview:customView];
[UIView beginAnimations:@"animateAddContentView" context:nil];
[UIView setAnimationDuration:0.4];
customView.frame= CGRectMake(self.view.frame.Origin.x +5, self.view.frame.Origin.y +5, 310, 150);
[UIView commitAnimations];
Aber es funktioniert immer noch nicht!
BEARBEITEN:
Gemäß den Vorschlägen habe ich es in eine blockbasierte Animationslösung verschoben, und dies ist der genaue Code:
NSLog(@"yourview : %@",customView);
customView.frame= CGRectMake(self.view.frame.Origin.x +5, self.view.frame.Origin.y +5, 0, 150);
NSLog(@"yourview : %@",customView);
[self.view addSubview:customView];
NSLog(@"yourview : %@",customView);
// [customView setFrame:CGRectMake( 0.0f, 480.0f, customView.frame.size.width, customView.frame.size.height)];
[UIView animateWithDuration:0.4
delay:0
options:UIViewAnimationCurveEaseInOut
animations:^ {
NSLog(@"yourview : %@",customView);
customView.frame = CGRectMake(self.view.frame.Origin.x +5, self.view.frame.Origin.y +5, 310, 150);
NSLog(@"yourview : %@",customView);
}completion:^(BOOL finished) {
}];
Was aus irgendeinem Grund immer noch nicht funktioniert. Mögliche Probleme, die ich sehe, sind:
- Ich lade diese customView von einer
nib, die spezifisch 310 von 150 ist, was vielleicht ein Problem verursacht. - Ich importiere nicht die richtigen Frameworks, aber da ich den frame.Origin-Teil dieser Ansicht animieren kann, bin ich nicht sicher, ob das der Fall ist ... Ich habe
QuartzCoreundCore Graphicsalles importiert und so.
An jedem Punkt im Protokoll wird der richtige Inhalt angegeben: Vor dem Zielframe ist die Größe beispielsweise 0, 150, und nachdem ich den Frame auf 310, 150 eingestellt habe, funktioniert die Animation nicht.
Animieren Sie den Rahmen nicht, um die Ansicht zu vergrößern. Animieren Sie die Transformation.
Laden Sie Ihre Unteransicht von der Spitze. Setzen Sie die Transformation auf eine Skala von 0:
view.transform = CGAffineTransformMakeScale(0,0);
Dann fügen Sie es zu Ihrer Übersicht hinzu.
Setzen Sie die Transformation im Animationsblock auf "Identität":
view.transform = CGAffineTransformIdentity;
Und die Ansicht wird normal groß. Möglicherweise müssen Sie mit dem Ankerpunkt arbeiten, damit er vom richtigen Punkt wächst.
Sie können auch den Frame innerhalb des Blocks ändern. Um jedoch nur eine Ansicht zu verschieben, ziehe ich es vor, die Center-Eigenschaft zu ändern, sollten Sie nicht versuchen, den Frame festzulegen, wenn Sie auch eine Transformation haben.
Für Bonuspunkte können Sie auch eine etwas größere Skala als 1,0 animieren und dann in einer verketteten Animation aus dem Abschlussblock wieder zur Identitätsumwandlung animieren. Dadurch wird die Ansicht wie eine Alarmansicht aus dem Bildschirm herausgefahren.
Versuchen Sie es mit einem Block, es wird klarer.
// First create the view if you haven't already
UIView *myView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 100.0f, 100.0f)];
// Add it as a subview.
[myViewController.view addSubview:myView];
CGRect newFrameOfMyView = CGRectMake(0.0f, 0.0f, 200.0f, 200.0f);
/*
* Alternatively you could just set the width/height or whatever you'd like with this:
* CGRect newFrameOfMyView = myView.frame;
* newFrameOfMyView.size.height = 200.0f;
* newFrameOfMyView.size.width = 200.0f;
*/
[UIView animateWithDuration:0.3f
animations:^{
myView.frame = newFrameOfMyView;
}
completion:^(BOOL finished){
NSLog( @"woo! Finished animating the frame of myView!" );
}];
Versuche dies:
customView.frame= CGRectMake(self.view.frame.Origin.x +5,self.view.frame.Origin.y+5,0, 150);
[self.view addSubview:customView];
CGRect frame = customView.frame;
frame.size.width = 310;
[UIView animateWithDuration:0.4
animations:^{
customView.frame= frame;
}];
Oder wenn Sie die beginAnimation-Methode anstelle des Methos-Blocks verwenden möchten, verwenden Sie Folgendes:
UIView *customView=[[UIView alloc]initWithFrame:CGRectMake(self.view.frame.Origin.x +5,self.view.frame.Origin.y+5,0, 150)];
[self.view addSubview:customView];
CGRect frame = customView.frame;
frame.size.width = 310;
[UIView beginAnimations:@"animateAddContentView" context:nil];
[UIView setAnimationDuration:0.4];
customView.frame= frame;
[UIView commitAnimations];
Hier können Sie Ihre Ansichten auf unterhaltsame Weise animieren. In meinem Beispiel habe ich eine Berührungsaktion, mit der die Blockanimationen ausgeführt werden, und eine BOOL, um sicherzustellen, dass die Ansichten auf ihren ursprünglichen Zustand zurückgesetzt werden.
Zuerst legen Sie zwei UIViews auf einen UIViewController (Sie können sie für Kontrast in verschiedenen Farben einfärben). Verbinden Sie sie mit Ihrer "MainViewController.h" -Datei, die Sie erstellen, um die große Ansicht zu steuern. Die Datei .h sollte folgendermaßen aussehen:
#import <UIKit/UIKit.h>
@interface MainViewController : UIViewController
@property (weak, nonatomic) IBOutlet UIView *topView;
@property (weak, nonatomic) IBOutlet UIView *bottomView;
@end
und Ihre .m-Datei sollte folgendermaßen aussehen:
#import "MainViewController.h"
#define kViewAnimateWithDuration 0.35f
#define kViewDelay 0.05f
@interface MainViewController ()
@property (nonatomic) BOOL setTouch;
@end
@implementation MainViewController
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
// Custom initialization
self.setTouch = NO;
}
return self;
}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch *touch = [touches anyObject];
CGPoint touchLocation = [touch locationInView:self.view];
float width_tp = self.topView.frame.size.width;
float height_tp = self.topView.frame.size.height;
float width_b = self.bottomView.frame.size.width;
float height_b = self.bottomView.frame.size.height;
if ((CGRectContainsPoint(self.bottomView.frame, touchLocation)) && !self.setTouch){
[UIView animateWithDuration:kViewAnimateWithDuration
delay:kViewDelay
options:UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionAllowUserInteraction
animations:^{
//Move frame or transform view
[self.topView setFrame:CGRectMake(self.topView.frame.Origin.x, self.topView.frame.Origin.y, width_tp, height_tp + 171)];
[self.bottomView setFrame:CGRectMake(self.bottomView.frame.Origin.x, self.bottomView.frame.Origin.y +171, width_b, height_b -171)];
} completion:^(BOOL finished) {
self.setTouch = YES;
}];
}
if ((CGRectContainsPoint(self.bottomView.frame, touchLocation)) && self.setTouch) {
[UIView animateWithDuration:kViewAnimateWithDuration
delay:kViewDelay
options:UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionAllowUserInteraction
animations:^{
//Move frame or transform view
[self.topView setFrame:CGRectMake(self.topView.frame.Origin.x, self.topView.frame.Origin.y, width_tp, height_tp - 171)];
[self.bottomView setFrame:CGRectMake(self.bottomView.frame.Origin.x, self.bottomView.frame.Origin.y -171, width_b, height_b +171)];
} completion:^(BOOL finished) {
self.setTouch = NO;
}];
}
}
Stellen Sie also sicher, dass das topView einige kleine Dimensionen wie x: 0, y: 0 width: 320 height: 43 und bottomView wie x: 0 y: 40 width: 320 height: 528 hat. Denken Sie daran, die Hintergründe in verschiedenen Farben zu färben. Dann starten Sie einfach das Programm und Sie sollten Animationen sehen.
Ich denke, eine der wichtigsten Zeilen im Code ist setFrame: Damit kann der Frame das Rechteck automatisch neu anzeigen, ohne die DrawRect-Methode verwenden zu müssen. Durch das Festlegen der Eigenschaft werden der durch die center-Eigenschaft angegebene Punkt und die Größe im Begrenzungsrechteck entsprechend geändert.
Natürlich gibt es auch andere lustige Möglichkeiten, aber ich hoffe, dass dies jemandem helfen kann, iOS magisch aussehen zu lassen, so wie es sein sollte! Glückliche Reisen!
Wenn Ihr Viewcontroller viewWillLayoutSubviews (oder so) den "anfänglichen" Frame Ihrer View setzt, wird dieser scheinbar während des Animationszyklus aufgerufen und würde daher den durch die Animation gesetzten Frame zurücksetzen.
Swift 4
UIView.animate(withDuration: 0.3, animations: {
self.whiteBackgroundView.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)
self.view.layoutIfNeeded()
}) { (finished) in
// end of animation
}
Wichtige Punkte
1) Fügen Sie Ihrer parentView vor der Animation eine Ansicht hinzu, mit dem Startbild.
2) Dann geben Sie einfach den Zielrahmen in den Animationsblock ein
Sie benötigen dies nicht mehr, da Sie die Ansicht von der Spitze aus hinzufügen.
//UIVIew yourView = [[UIView alloc] initWithFrame:YOUR_STARTING_FRAME];
//[self.view addSubview:yourView];
.........
.........
.........
geben Sie einfach den Animationscode in Ihrer Ansicht ein. Stellen Sie sicher, dass yourView nicht gleich Null ist (scheint mir der Fall zu sein ..)
NSLog(@"yourview : %@",yourView);
[UIView animateWithDuration:your_duration
delay:your_starting_delay
options:UIViewAnimationCurveEaseInOut
animations:^ {
yourView.frame = YOUR_TARGET_FRAME;
}completion:^(BOOL finished) {
}];