UIImage Animation Reverting Back To Original Position - animation

Im pretty new to coding but I'm starting to get the hang of the basics.
how to make an image stay in its new position after an animation?
Example:
I'm giving an animating object a random position, however, the animation causes the object not to animate at the random position, but instead animate at the position it was given in the view controller. This also happens when I animate a completly different object.
Code I used:
int Random1x;
int Random1y;
IBOutlet UIButton *Start;
IBOutlet UIImageview *Object2;
-(void)ObjectMoving;
-(void)Object2Animate;
-(IBAction)Start:(id)sender{
[self ObjectMoving];
[self Object2Animate];
}
-(void)Object2Animate {
Object2.animationImages = [NSArray arrayWithObjects:
[UIImage imageNamed:#"2.png"],
[UIImage imageNamed: #"3.png"],
[UIImage imageNamed: #"4.png"],
[UIImage imageNamed: #"1.png"], nil];
Object2.animationDuration = .5
[Object2 setanimationRepeatCount: 0]
[Object2 startAnimating];
}
-(void)ObjectMoving {
Random1y = arc4random() % 466;
Random1y = Random1y + 60;
Random1x = arc4random() % 288;
Object2.center = CGPointMake(Random1x, Random1y);
}
I'd greatly appreciate help, thank you!

If you go to your story board file and click on the View Controller and then file inspector you will see a box for Auto Layout
Post back if that worked.
If you do need to use auto layout then you would have to figure out a different way of moving the image.

Related

UIImageView photo transition effect Xcode 5

I want to add a transition effect between images like fade or anything else.
Here's my code:
-(IBAction)startSlideShow:(id)sender;
{
self.imageView.animationImages = [NSArray arrayWithObjects:
[UIImage imageNamed:#"slide01.png"],
[UIImage imageNamed:#"slide02.png"],
[UIImage imageNamed:#"slide03.png"],
[UIImage imageNamed:#"slide04.png"],
[UIImage imageNamed:#"slide05.png"],
nil];
self.imageView.animationDuration = 15.0;
self.imageView.animationRepeatCount = 0;
[self.imageView startAnimating];
}
Try this, I think you looking for this one,.. github.com/jberlana/JBKenBurns
(or)
I found this on someother search, try this too..
http://www.raywenderlich.com/10518/how-to-use-uiscrollview-to-scroll-and-zoom-content
Other simple way to achieve: Steps to achieve
Add all the images in one scroll view.
Enable paging for that scroll view.
Based on the content offset of the scroll view highlight the appropriate dot(indicator in the bottom).

How to set a value for an image

I am using a switch statement to fill imageviews with pictures at random.
Now I am trying to give the pictures a value. That way I can use that value to make comparison. Can somebody explain me how to give images a value?
I have used the following code to setup the array for the UIImages, but can't get it completely working: (.m file)
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
UIImage *image1 = [UIImage imageNamed:#"image-1.png"];
UIImage *image2 = [UIImage imageNamed:#"image-2.png"];
UIImage *image3 = [UIImage imageNamed:#"image-3.png"];
UIImage *image4 = [UIImage imageNamed:#"image-4.png"];
UIImage *image5 = [UIImage imageNamed:#"image-5.png"];
_imageArray = #[image1, image2, image3, image4, image5];
}
-(void)displayImageRandomlyOnView {
NSUInteger randomIndex = arc4random_uniform([_imageArray count]);
_imageToDisplay.image = [_imageArray objectAtIndex:randomIndex];
}
Have created also a button in the .h file, to call the view...but can't get the code working for the button calling the view.
If I now try to run the IS it crashes even without the button in it. Can somebody tell me what is going wrong?
The following information is in the .h file: (have left the button out)
#import <UIKit/UIKit.h>
#interface ViewController : UIViewController
#property (weak, nonatomic) IBOutlet UIImageView *imageToDisplay;
#property (strong, nonatomic) NSArray *imageArray;
That was really helpful! I have now created a button that will fill in total 10 UiImage views. 5 in the left side of the screen, UiImage view 1-5 and right side I have UiImage view 6-10. I created two separe array's to fill the right and the left side. The only thing I now want to do is to compare the UiImage view 1-5 against 6-10. If a UiImage view is filled with an image it should return value 1 and if not it should have 0. This way I can compare if the right or left side has more images filled or exactly the same. Can you point me in the right direction on how to do this? Thanks!
I would suggest storing the UIImages in an array, sorting them randomly, and then sequentially fill the UIImageViews with the images. This way you don't need to attach a value to the images as you know what position they are in the array from their position amongst your image views.
EDIT
You should replace the line
_imageArray = #[image1, image2, image3, image4, image5];
with
_imageArray = [[NSArray alloc] initWithObjects:image1, image2, image3, image4, image5, nil];
What you had would cause an error like this in the Xcode console:
* Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '* -[__NSPlaceholderArray initWithObjects:count:]: attempt to insert nil object from objects[0]'
EDIT 26/11/13
If you have a list of images on the screen and want to check programatically if they are loaded with images, I would suggest using an array of UIImageViews instead of an array of UIImages. Then,
// Initialise the 5 UIImageViews with the UIImages that you already initialised.
UIImageView *image1 = [[UIImageView alloc] initWithImage:image1];
UIImageView *image2 = [[UIImageView alloc] initWithImage:image2];
..
..
UIImageView *image5 = [[UIImageView alloc] initWithImage:image1];
// Put all the UIImageViews in an array.
_imageArray = [[NSArray alloc] initWithObjects:image1, image2, image3, image4, image5, nil];
// Make this method to count the number of images in the given array.
- (int)numberOfImagesIn:(NSArray *)array {
int count = 0;
for (UIImageView *view in array) {
if (view.image) {
count++;
}
}
return count;
}

Zoom & Pan in UIImageView inside UIScrollView

I have a UIScrollView filled with UIImageView. The UIScrollView are paging enabled to let the users to "flip" those images. Each UIImageView has UIPinchGestureRecognizer for pinch zoom, and UIPanGestureRecognizer for to pan that image when zoomed in.
As probably you have noticed, what I'd like to achieve is just like what iBooks does in its application.
However, I have difficult times to get this work.
In my "BookPageViewController", I have set up UIScrollView, then fill them with images from the folder based on data (page numbers, file names, etc) from sqlite.
_pageScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
NSUInteger pageCount = [pages count];
for (int i = 0; i < pageCount; i++) {
CGFloat x = i * self.view.frame.size.width;
// Page Settings
UIImageView *pageView = [[UIImageView alloc] initWithFrame:CGRectMake(x, 0, self.view.frame.size.width, self.view.frame.size.height)];
pageView.backgroundColor = [UIColor greenColor];
pageView.image = [pages objectAtIndex:i];
pageView.userInteractionEnabled = YES;
pageView.tag = i;
// Gesture Reocgnisers
UIPinchGestureRecognizer *pinchGr = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:#selector(pinchImage:)];
pinchGr.delegate = self;
[pageView addGestureRecognizer:pinchGr];
UIPanGestureRecognizer *panGr = [[UIPanGestureRecognizer alloc] initWithTarget:self action:#selector(panImage:)];
[pageView addGestureRecognizer:panGr];
// Finally add this page to the ScrollView
[_pageScrollView addSubview:pageView];
}
_pageScrollView.contentSize = CGSizeMake(self.view.frame.size.width * pageCount, self.view.frame.size.height);
_pageScrollView.pagingEnabled = YES;
_pageScrollView.delegate = self;
[self.view addSubview:_pageScrollView];
And with the help of another good questions here in Stackoverflow, I have put those:
- (void) pinchImage:(UIPinchGestureRecognizer*)pgr {
[self adjustAnchorPointForGestureRecognizer:pgr];
if ([pgr state] == UIGestureRecognizerStateBegan || [pgr state] == UIGestureRecognizerStateChanged) {
if ([pgr scale]) {
NSLog(#"SCALE: %f", [pgr scale]);
[pgr view].transform = CGAffineTransformScale([[pgr view] transform], [pgr scale], [pgr scale]);
[pgr setScale:1];
} else {
NSLog(#"[PAMPHLET PAGE]: The image cannot be scaled.");
}
}
}
My problem is, when I zoom in the one of the UIImageView with Pinch Gesture, the image exceeds (go over) to the next image and hides it. I believe that there should be the way to "limit" the zoom in/out and the size of UIImageView (not UIImage itself), but I don't know where to go from here. I have also put a code to limit the scale something like:
([pgr scale] > 1.0f && [pgr scale] < 1.014719) || ([pgr scale] < 1.0f && [pgr scale] > 0.98f)
but it didn't work...
I know it's not hard for ios professionals, but I'm quite new to objective-c, and this is my first time to develop real application. If this is not a good practice, I also would like to know any ideas to achieve just how to do this like ibooks do (e.g. put UIImageView in UIScrollView, then put the UIScrollView to another UIScrollView)...
Sorry for another beginner question, but I really need help.
Thanks in advance.
Without trying it out myself, my first guess would be that the transform on the UIImageView also transforms its frame. One way to solve that, would be to put the UIImageView in another UIView, and put that UIView in the UIScrollView. Your gesture recognizers and the transform would still be on the UIImageView. Make sure the UIView's clipsToBounds property is set to YES.

iOS5 combine CGAffineTransform with animationImages?

I'm pretty new to iOS animation and I'm wondering if it's possible to combine an transition between two images along with a translation animation of the UIImageView using CGAffineTransform?
In other words I have two images that I want to animate between, and then I want to apply a simultaneous translation so that the whole thing moves across the page while moving back and forth between the two images.
I know I can apply a CGAffineTransformConcat to combine two CGAffineTransforms such as a CGAffineTransformTranslate and something else. But I don't see a CGAffineTransform which allows me to transition to another UIImage.
The only way I know to animate between images is to use the UIImageView animationImages array combined with startAnimating. However, I don't know how to combine this with a translation like so:
UIImageView* textView = [[UIImageView alloc] initWithFrame:bunnyImage.frame];
textView.animationImages = [NSArray arrayWithObjects:
[UIImage imageNamed:#"bunnyclose.png"],
[UIImage imageNamed:#"bunnytalk.png"],
nil];
textView.animationDuration = 1.0;
textView.animationRepeatCount = 8;
[textView startAnimating];
[self.view addSubview:textView];
Any suggestions?
In answer to my own question, the block animation function transitionFromView:toView:duration:options:completion as discussed in "Creating Animated Transitions Between Views" is the best solution that I have come up with yet. I use this to animate between images and this can be combined with the block animation animateWithDuration:delay:options:animations:completion: using CGAffineTransformTranslate or simply by changing the center of the UIImageView as discussed in Animations.
Reworking my original codeblock and adding my translation looks something like this:
UIImageView* bunny2View = [[UIImageView alloc] initWithFrame:bunny2Image.frame];
[UIView
transitionFromView:bunny2Image
toView:bunny2View
duration:10.0
options:UIViewAnimationOptionShowHideTransitionViews
completion:^(BOOL finished) {
[UIView
animateWithDuration:dur
animations:^(void) {
CGPoint center = bunny2Image.center;
center.y += deltay;
bunny2Image.center = center;
bunny2View.center = center;
}
completion:^(BOOL finished) {
[UIView
transitionFromView:bunny2View
toView:bunny2Image
duration:10.0
options:UIViewAnimationOptionShowHideTransitionViews
completion:nil];
}];
}];
Still a work in progress, but this is what I've come up with so far!

PinthToZoom and Pan of UIView with multiple images

I'm developing an iphone application with an UIView that have an image as a background and multiple buttons with image as background. The image is an image of a country and the buttons are the regions/states of that country.
The problem is that the screen is too much little to display all this data, so I want to enable pinch-to-zoom of the UIView which allows user to have a better view of the country.
Inside 'viewDiDLoad' of my UIViewController, I added:
UIPinchGestureRecognizer *twoFingerPinch = [[[UIPinchGestureRecognizer alloc]
initWithTarget:self
action:#selector(twoFingerPinch:)]
autorelease];
[[self view] addGestureRecognizer:twoFingerPinch];
and I added twoFingerPinch method:
- (void)twoFingerPinch:(UIPinchGestureRecognizer *)recognizer {
if (recognizer.scale > minValue){
CGAffineTransform transform = CGAffineTransformMakeScale(recognizer.scale, recognizer.scale);
self.view.transform = transform;
}
}
and it work correctly, the problem is that the UIView becomes bigger but user can't navigate inside.
So I switched my UIView to a UIScrollView and inside 'twoFingerPinch' method I added:
if (recognizer.state == UIGestureRecognizerStateEnded){
float scaleForView = mLastScale;
UIScrollView *tempScrollView=(UIScrollView *)self.view;
int newWidth = self.view.frame.size.width * scaleForView;
int newHeight = self.view.frame.size.height * scaleForView;
tempScrollView.contentSize=CGSizeMake(newWidth,newHeight);
mLastScale = 1.0;
}
but it doesn't work well: the UISrollView becomes much bigger but it's not bigger as the image scaled and also is not centered where pinchToZoom started.
How can i solve this problem?
Thank You

Resources