Moving views with constraints
Yes, no issue when you change the constants. The thing here is that you have to set your constraint appropriately.
Let's consider an example.
I have a UIView
in Storyboard and I would like to change its width. Its default width is 1024
.
After some animation, We will change it's width to 900
.
Follow steps below to achieve this:
- Select
UIView
in which we want to update constraints. Here we need to updatewidth
, So we will add a constraint for width.
- Now we can see new constraint added to
UIView
.
- Click on that constraint. It will show constraint properties. Here now we want to decrease width from 1024 to 900, So that in constraint property change Relation property to Less Than or Equal. Similarly, if you like to increase width from 1024 then Relation will be Greater Than or Equal.
Now create an
IBOutlet
variable forNSLayoutConstraint
and connect it with above width constraint.Change width constant
Swift 5.0
@IBOutlet weak var viewWidthConstraint : NSLayoutConstraint!
func reduceWidth() {
// Reduce width of view.
UIView.animate(withDuration: 0.35, animations: { () -> Void in
self.viewWidthConstraint.constant = 900
self.view.layoutIfNeeded()
})
}
func normalWidth() {
// Change to the default width of view.
UIView.animate(withDuration: 0.35, animations: { () -> Void in
self.viewWidthConstraint.constant = 1024
self.view.layoutIfNeeded()
})
}
Objective C
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *viewWidthConstraint;
- (void) reduceWidth {
// Reduce width of view.
[UIView animateWithDuration:0.35f animations:^{
self.viewWidthConstraint.constant = 900;
[self.view layoutIfNeeded];
}];
}
- (void) normalWidth {
// Change to default width of view.
[UIView animateWithDuration:0.35f animations:^{
self.viewWidthConstraint.constant = 1024;
[self.view layoutIfNeeded];
}];
}
Related videos on Youtube
Brosef
Updated on June 09, 2022Comments
-
Brosef almost 2 years
I have a couple views in my view controller that move up when an up swipe is detected then down when a down swipe is detected. I was forcing the views to move by adjusting the y origin using CGRectOffset. I've now applied constraints to my views with IB and I'm not sure whats the best way to move the views so that they end up in the right position on the iphone 5, 6, and 6+.
Currently I'm doing something like this:
[self.view layoutIfNeeded]; self.panFrameVerticalConstraint.constant = self.panFrameVerticalConstraint.constant +338; [UIView animateWithDuration:5 animations:^{ [self.view layoutIfNeeded]; }];
Is it better to change the constants using ratios? So for the constraint above, instead of using 338, would it be better to do this:
self.panFrameVerticalConstraint.constant = self.panFrameVerticalConstraint.constant + (self.panView.frame.size.height/1.680); //self.panView.frame.size.height = 568 //(568/1.680) = 338
-
Brosef over 9 years@Pangu I pretty much followed the steps in the answer below. I created an
IBOutlet
NSLayoutConstraint
property and connected it to the constraint I wanted to adjust in interface builder. Then when I needed to move my view up, i changed my constant like thisself.panFrameVerticalConstraint.constant = -(self.panedView.frame.size.height/1.68);
. I calledlayoutIfNeeded
before changing the constant. After changing the constant I calledanimateWithDuration
and calledlayoutIfNeeded
again in the block just like the answer below. -
Brosef over 9 years@pangu In
viewDidLoad
you need to add aUISwipeGestureRecognizer
and the method that gets called when a swipe is detected.UISwipeGestureRecognizer * swipeUpRec = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleUpSwipe:)];
Then add the gesture recognizer to whatever frame is suppose to detect the swipe[self.someView addGestureRecognizer:swipeUpRec];
-
-
Brosef over 9 yearsThis is very helpful. You say you want the width to change from 1024 to 900, but why do you change the constraint constant to 705?
-
Kampai over 9 yearsIt's just example. In code I have requirement to decrease width to 705.
-
viral over 9 yearsNice Explanation. I appreciate. +1
-
Markus over 8 yearsGreat and correct answer. I just want to add that setting the constraint does not need to be done inside the
UIView.animateWithDuration
block. You can set the constraint before the animation block and just calllayoutIfNeeded
inside the block. -
Luchi Parejo Alcazar over 3 yearsDoes someone how to capture a constraint change? I mean, the width constraint is being changed from 1024 to 900 and viceversa. What if I want to capture the moment when the constraint is equals to 1000?