I'm trying to expand a Container view. But I can't figure out why the elements it contains are not resizing too... They stay with the base sizes they had.
Here's what I tried (tell me if I do something bad or if it could be done easier)
[UIView animateWithDuration:1.5
delay:0.0 usingSpringWithDamping:1
initialSpringVelocity:0
options:UIViewAnimationCurveLinear | UIViewAnimationOptionCurveLinear
animations:^{
_heightConstraint.constant = [[UIScreen mainScreen] bounds].size.height;
_widthConstraint.constant = [[UIScreen mainScreen] bounds].size.width;
_posYConstraint.constant = -20;
_posXConstaint.constant = 0;
// I tried desperately the following mess :)
for (UIView* i in _container.subviews) {
[i layoutIfNeeded];
}
[_container layoutIfNeeded];
[self.view layoutIfNeeded];
} completion:nil];
Elements i.e sub views don't transform if you re size frame. you need to change the transform of the view and it will be applied to transform of all sub views.
<your view>.transform=CGAffineTransformMakeScale(2, 2);
Related
I have a problem that I can't find the errors as titled. And I have searched so many times that similar or related questions, that can't solve.
I am building an App that can change the Image of A UIImageView with a button. everything is fine until I use another button to change the size of imageView (with UIView animateWithDuration + CGAffineTransformMakeRotation), then use that button for changing image.
strange output with no errors happen! the imageview size change back and the position move to other places.
Sorry about my poor english.
with graphics,
I have this view [no size changed view][1]
I use animateWithDuration + CGAffineTransformMakeRotation change the size & orientations, to make the view fullscreen like this [size changed view][2]
Then I change this image of this view by imageView.image = newImage(UIImage)
However, the view change to this [strange view][3] either the size or position are changed!
But, there's nothing if I change the image at Step 1 (no orientation & set frame)
Please help, I can't find the errors because there only one place that change the size&orientation of the view.
I wonder there is something UIImage would affect the UIImageView. But I can't find the answer.
(the photos are down below)
this is the code to rotate the image ivew
if there is already set image, after rotation, the image is also fine
But problem get after rotation, and then set the new image to the image view
-(void)transformToDirection:(NSInteger)dir
{
rotation = M_PI_2;
CGFloat screenW = [[UIScreen mainScreen] bounds].size.width;
CGFloat screenH = [[UIScreen mainScreen] bounds].size.height;
CGRect portraitFrame = _imageVIew.frame;
CGRect landscapeFrame = CGRectMake(0, 0, screenW, screenH);
switch (dir) {
case UIInterfaceOrientationPortrait:
{
[UIView animateWithDuration:1 delay:0 options:0 animations:^{
_imageVIew.transform = CGAffineTransformMakeRotation(3/4 * rotation);
[_imageVIew setFrame:portraitFrame];
}completion:^(BOOL finished){
isFullScreen = false;
}];
}
break;
case UIInterfaceOrientationLandscapeRight:
{
[UIView animateWithDuration:1 delay:0 options:0 animations:^{
_imageVIew.transform = CGAffineTransformMakeRotation(rotation);
[_imageVIew setFrame:landscapeFrame];
}completion:^(BOOL finished){
isFullScreen = true;
}];
}
break;
case UIInterfaceOrientationLandscapeLeft:
{
[UIView animateWithDuration:TIME_ANIMATE_FULLSCREEN delay:0 options:0 animations:^{
_imageVIew.transform = CGAffineTransformMakeRotation(-rotation);
[_imageVIew setFrame:landscapeFrame];
}completion:^(BOOL finished){
isFullScreen = true;
}];
}
break;
default:
break;
}
}
this is the image view set image (all new images are the same size), which is called by a button.
dispatch_async(dispatch_get_main_queue(), ^{
if (loadedimage) {
self.imageVIew.image = loadedimage;
} else {
self.PBMainImageVIew.image = nil;
dlog(#"request image failed");
}
});
There is a button that horizontally shifts my table.
- (void)togglePreferencePageVisibility:(id)sender {
int translation = [self preferencesVisible] ? -PREFERENCE_TRANSLATION_HEIGHT : PREFERENCE_TRANSLATION_HEIGHT;
//animate tableview down
[UIView animateWithDuration:0.3
delay:0
options: UIViewAnimationCurveEaseOut
animations:^{
_table.center = CGPointMake(_table.center.x, _table.center.y+translation);
}
completion:^(BOOL finished){
}];
}
When I call [_table reloadData], the table reverts to its original position. I tried manually readjusting the table position, like so
NSLog(#"before %#", NSStringFromCGRect(_table.frame));
[_table reloadData];
_table.frame = CGRectMake(initialTablePosition.x, initialTablePosition.y+PREFERENCE_TRANSLATION_HEIGHT, _table.frame.size.width, _table.frame.size.height);
NSLog(#"after %#", NSStringFromCGRect(_table.frame));
but no luck. Also the frame's have the same y position before and after.
You need to also adjust the auto layout constraints using the NSLayoutConstraint class. You can add, remove or change the values of NSLayoutConstraints. This is a VERY common question on stack overflow right now, due to the change from iOS 7 to iOS 8.
If you do not adjust the layout constraints then the view will be repositioned back to its original location. reloadData redraws the UITableView which causes the view hierarchy to reexamine its positions e.t.c.
As an example of making a view with a width constraint narrower:
CGRect frame = myView.frame;
frame.size.width -= 100;
//Next line now needed in iOS 8
myWidthConstraint.constant -= 100;
[UIView animateWithDuration:0.5 animations:^{
[myView setFrame:frame];
}];
EDIT: moving back example:
CGRect frame = myView.frame;
frame.size.width += 100;
//Next line now needed in iOS 8
myWidthConstraint.constant += 100;
[UIView animateWithDuration:0.5 animations:^{
[myView setFrame:frame];
}];
When using auto layout, you should not set any frames. If you do, when the view needs to redraw itself, the frame will be reset to the frame defined by its constraints. You should add an IBOutlet to a constraint between your table view and the top (or bottom what ever works for your use) of its superview (I'll call it topCon in the example below).
- (void)togglePreferencePageVisibility:(id)sender {
int translation = [self preferencesVisible] ? -PREFERENCE_TRANSLATION_HEIGHT : PREFERENCE_TRANSLATION_HEIGHT;
//animate tableview down
self.topCon.constant += translation; // this might need to be "-=" depending on whether your constraint is to the top or bottom
[UIView animateWithDuration:0.3
delay:0
options: UIViewAnimationCurveEaseOut
animations:^{
[self.view layoutIfNeeded];
}
completion:^(BOOL finished){
}];
}
I have embedded all my views in a UIScrollView from xib. The scrollview contents cover all screen below status bar. Now when the textfield is tapped, I am able to move the scrollview little up. But I want it to be completely scrollable till the bottom most view is also visible above the keyboard. Also when the scrollview is scrolled till top , it should come to normal original positions. Hence, Overall I want a completely scrollable functionality like mentioned above for my scrollview.
I am done with following tricks but with no luck:
Trick 1: Change the height of the scrollview so that the content is more than scrollview height and hence the view is scrollable:
-(void)keyboardWillAppear:(NSNotification *)sender
{
CGFloat y_offset=0;
if([UIScreen mainScreen].bounds.size.height == 480){
y_offset = 80;
} else {
y_offset = 70;
}
NSDictionary* userInfo = [sender userInfo];
CGRect keyboardEndFrame;
[[userInfo objectForKey:UIKeyboardFrameEndUserInfoKey] getValue:&keyboardEndFrame];
keyboardHeight = keyboardEndFrame.size.height;
[UIView animateWithDuration:0.5f animations:^{
[self.view setFrame:CGRectMake(0, - y_offset, self.view.frame.size.width, self.view.frame.size.height)];
}];
[self.loginScrollView setFrame:CGRectMake(self.loginScrollView.frame.origin.x, self.loginScrollView.frame.origin.y, self.loginScrollView.frame.size.width, [UIScreen mainScreen].bounds.size.height - keyboardHeight)];
}
-(void)keyboardWillDisappear:(NSNotification *)sender
{
[UIView animateWithDuration:0.5f animations:^{
[self.view setFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
}];
[self.loginScrollView setFrame:CGRectMake(self.loginScrollView.frame.origin.x, self.loginScrollView.frame.origin.y, self.loginScrollView.frame.size.width, [UIScreen mainScreen].bounds.size.height)];
}
Trick 2: As per other suggestions, I changed the contentInset of the UIScrollView.
In keyboardWillAppear method I added following code:
CGSize kbSize = [[userInfo objectForKey:UIKeyboardFrameBeginUserInfoKey] CGRectValue].size;
UIEdgeInsets contentInsets = UIEdgeInsetsMake(0.0, 0.0, kbSize.height+100, 0.0);
self.loginScrollView.contentInset = contentInsets;
self.loginScrollView.scrollIndicatorInsets = contentInsets;
and in keyboardWillDisappear method I set the contentInset back to zero values.
Hence, let me know if there needs to be any other way to sort this out or any other possible changes I need to make in scrollview frame. Moreover , if I turn on the bouncesVertically functionality it is able to bounce even when complete subviews are visible onscreen which I don't want. So basically I want it to freeze when keyboard is not there and scrollable till viewable area when it is up. Hence, give me any other suggestions? Thanks in advance.
From a conceptual point of view when "scrollView Size == scrollView ContentSize", it does not scroll. To make it scrollable we need to increase the contentSize. In your problem you need to adjust the contentSize of scrollView along with frame. This can be done in your first approach.
As for the second approach, changing the edge insets will create a sort of padding for the content drawable area. This can make the bottom content visible, but it won't affect the contentSize, hence view will not be scrollable.
-(void)textFieldDidBeginEditing:(UITextField *)textField
{
[self animateTextField:textField up:YES];
}
-(void)textFieldDidEndEditing:(UITextField *)textField
{
[self animateTextField:textField up:NO];
}
-(void)animateTextField:(UITextField*)textField up:(BOOL)up
{
const int movementDistance = -60; // change this size if you need
const float movementDuration = 0.3f; // change this size if you need
int movement = (up ? movementDistance : -movementDistance);
[UIView beginAnimations: #"animateTextField" context: nil];
[UIView setAnimationBeginsFromCurrentState: YES];
[UIView setAnimationDuration: movementDuration];
self.view.frame = CGRectOffset(self.view.frame, 0, movement);
[UIView commitAnimations];
}
it is useful for me
I can really recommend this library:
https://github.com/michaeltyson/TPKeyboardAvoiding
It's very very easy to use, and works for ScrollView, TableView and CollectionView!
I am trying to reproduce an effect like the iOS 7 app switcher where I can scroll between smaller, transformed views. My current obstacle is getting the contentOffset
In order to do this, I have added a scrollView to my view, and sized it to the bounds of the view. I then create a container view that holds on to all the 'cards' -- it is this container view to which I apply the transform.
Anyway, the issue I am having is with adjusting where a particular card appears after it has the transform applied -- right now, I am unable to adjust the contentOffset during the transform in a manner that is smooth.
Anyway, code would help! Here it is:
NSInteger idx = selectedCardIndex;
if (TransformApplied)
{
[UIView animateWithDuration:0.5 animations:^{
[self.container setTransform:CGAffineTransformIdentity];
[self.container setFrame:CGRectOffset(self.container.frame, (1-ScaleFactor)/2 * NumCards * ScreenWidth, 0)];
[self.scrollView setContentSize:self.container.frame.size];
[self.scrollView setContentOffset:CGPointMake(ScreenWidth * idx, 0) animated:NO];
[self.scrollView setPagingEnabled:YES];
} completion:^(BOOL finished) {
TransformApplied = NO;
}];
}
else
{
[UIView animateWithDuration:0.5 animations:^{
[self.container setTransform:CGAffineTransformMakeScale(ScaleFactor, ScaleFactor)];
[self.container setFrame:CGRectOffset(self.container.frame, (-1)*((1-ScaleFactor)/2) * NumCards * ScreenWidth, 0)];
[self.scrollView setContentSize:CGSizeMake(ScreenWidth * ScaleFactor * NumCards, ScreenHeight * ScaleFactor)];
[self.scrollView setContentOffset:CGPointMake(ScaleFactor * ScreenWidth * idx, 0) animated:NO];
[self.scrollView setPagingEnabled:NO];
} completion:^(BOOL finished) {
TransformApplied = YES;
}];
}
More
I am noticing that everything is smooth when applying the identity transform, but not when applying the smaller transform, I get a weird 'jump' in the frame before the animation.
If i comment out the content offset adjustment in the scale transform (the bottom block) then everything runs smoothly, but the contentOffset is wrong after the scale transform.
Lastly, calling setContentOffset:animated: results in a wonky animation so that is a no-go.
Any help greatly appreciated!!!!
UPDATE
I've looked in to anchor point/ position properties on CALayer, and I've got the animation effects working perfectly with this:
NSInteger idx = selectedCardIndex;
if (TransformApplied)
{
[UIView dd_AnimateWithDuration:0.5 animations:^{
[self.container setTransform:CGAffineTransformIdentity];
[self.scrollView setContentOffset:CGPointMake(ScreenWidth * idx, 0) animated:NO];
[self.scrollView setPagingEnabled:YES];
} completion:^(BOOL finished) {
TransformApplied = NO;
}];
}
else
{
CGPoint anchor = CGPointMake((idx * ScreenWidth + ScreenWidth/2)/CGRectGetWidth(self.container.frame), 0.5f);
[self.container.layer setAnchorPoint:anchor];
CGPoint position = CGPointMake((anchor.x) * self.container.frame.size.width, self.container.layer.position.y);
[self.container.layer setPosition:position];
[UIView dd_AnimateWithDuration:0.5 animations:^{
[self.container setTransform:CGAffineTransformMakeScale(ScaleFactor, ScaleFactor)];
[self.scrollView setPagingEnabled:NO];
} completion:^(BOOL finished) {
TransformApplied = YES;
}];
}
However, now i've got to figure out a way to get rid of all the extra space in the scrollview without allowing the position of the container to change....
I have had a similar issue a long time ago about the position of a view. After a long research, I ended up with the UIView documentation. It says about transform and frame properties of a UIView with a warning:
Warning:
If the transform property is not the identity transform, the value of this property is undefined and therefore should be ignored.
Changing the frame rectangle automatically redisplays the receiver without invoking the drawRect: method. If you want the drawRect: method invoked when the frame rectangle changes, set the contentMode property to UIViewContentModeRedraw.
Changes to this property can be animated. However, if the transform property contains a non-identity transform, the value of the frame property is undefined and should not be modified. In that case, you can reposition the view using the center property and adjust the size using the bounds property instead.
So, the basic idea is that, you shouldn't rely on or change frame when your view's transform contains a non-identity transform.
And the more important idea, always give a chance to the official documentation before looking elsewhere.
I hope this helps.
I have a UILabel called "nameLabel" and I have it inside an animation block so that this happens:
_nameLabel.alpha = 1;
CGAffineTransform translate = CGAffineTransformMakeTranslation(50, 50);
_nameLabel.transform = translate;
I thought that animates the UILabel to the spot I specify but it just animates from the above spot to the place where I have it in the Interface Builder. Any help here?
Can you post the animation block and other associated code? I am not sure what CGAffineTransformMakeTranslation does with the label, but if you want to animate the frame location, you can use this:
CGRect frame = _nameLabel.frame;
frame.origin.y = 100; //Desired height, origin.x can be modified as well.
//You can also change the frame size here but it wont work on UILabels, you will need `CGAffineTransformScale` for that.
[UIView animateWithDuration: 1.5
delay:0.0
options:UIViewAnimationCurveEaseInOut | UIViewAnimationOptionBeginFromCurrentState
animations:^ {
[_nameLabel setFrame:frame];
}
completion:^ (BOOL finished) {
}];
Edit: The other way:
CGRect frame = _nameLabel.frame;
frame.origin.y = 100;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:0.5];
[_nameLabel setFrame: newFrame];
[UIView commitAnimations];
Current state is probably the current location of the label, try that first but if nothing happens, remove UIViewAnimationOptionBeginFromCurrentState or set the frame of the label to another location before the animation, and move it to its initial (the one in the xib file) position in the animation block, its your call.
Watch out because Autolayout cause a lot of problems.
Try to deselect 'Use Autolayout'
It solves to me all the problems trying to translate objects.