How to detect which CALayer was clicked on? - objective-c

I'm having a problem detecting which CALayer is being clicked on, as these CALayers have a constant CABasicAnimation moving the x and y positions.
My current code is as follows:
-(void)mouseUp:(NSEvent *)theEvent
{
CGPoint pointInView = NSPointToCGPoint([self convertPoint:[theEvent locationInWindow]fromView:nil]);
CALayer* clickedOn = [(CALayer*) self.layer hitTest:[self.layer convertPoint:pointInView toLayer:self.layer.superlayer]];
int selectedContact = -1;
for (int i = 0; i < [contactLayers count]; i++) {
CALayer* presentationLayer = [contactLayers[i] presentationLayer];
if (presentationLayer == clickedOn) {
selectedContact = i;
break;
}
}
if(selectedContact == -1)
return; //no contact selected;
CALayer* selectedContactLayer = contactLayers[selectedContact];
[selectedContactLayer removeFromSuperlayer];
}
contactLayers is an NSMutableArray containing all the possible CALayers the user can click on.
Every time this runs, i always seems to end up staying -1. I'm using presentationLayer since the CALayers have a CABasicAnimation applied to them. I also tried modelLayer, but this only works if you click on the initial location of each layer.
So just a recap: I have an NSMutableArray of CALayers that all have a CABasicAnimation applied, this array is called contactLayers. When the user clicks on a layer, I need to know what layer they clicked on by setting the index to the appropriate value in the array.

Compute 'clickedOn' by hit testing 'self.layer.presentationLayer', not 'self.layer'

Related

Best way to animate visiblity of UICollectionViewCell in iOS7+

I need to animate the visibility of UICollectionViewCells on startup such that they are visible randomly when my application launches. But since I already have the items to be displayed they are visible at the same time. I tried below solution & it works correctly. But I want to know the best & optimized way to achieve this task
- (void)animateCollectionViewCellsVisiblity
{
// First set alpha to 0
for (NSUInteger i = 0; i< self.dataArray.count; i++)
{
[self applyAlpha:0.0 toItem:i inSection:0];
}
// Initially collectionview is hidden while fetching data, so show it now
self.collectionView.hidden = NO;
// Now set alpha to 1 with a random delay
for (NSUInteger i = 0; i< self.dataArray.count; i++)
{
CGFloat delay = [self randomNumberWithlowerBound:0 upperBound:self.dataArray.count] + 0.05;
[UIView animateWithDuration:.2 delay:delay options:UIViewAnimationOptionCurveEaseIn animations:^{
[self applyAlpha:1.0 toItem:i inSection:0];
} completion:nil];
}
}
- (void)applyAlpha:(CGFloat)alpha toItem:(NSInteger)item inSection:(NSInteger)section
{
MyCollectionViewCell *cell = (MyCollectionViewCell *)[self.collectionView cellForItemAtIndexPath:[NSIndexPath indexPathForItem:item inSection:section]];
cell.alpha = alpha;
}
- (int)randomNumberWithlowerBound:(int)lowerBound upperBound:(int)upperBound
{
int randomValue = arc4random_uniform(upperBound - lowerBound + 1) + lowerBound;
return randomValue;
}
Your solution is great. That's how it is done. Looks pretty optimized to me.
You could make your code shorter by dropping the section parameter which is always zero. And you possibly eliminate the applyAlpha method by adding just two lines before your animate block.

Control UIImageview animation flow with touch events

I am using a UIImageView to simulate 3D by animating .png images. Is it possible to use touch events to control the flow of the animation? For example if I'm simulating a box can I rotate it left or right with my finger? If not can u point me in another direction?
First of all there are two ways to do this, the hard way which is to use core animation to build the cube and rotate it upon swipe or touch, and the second (the easiest) is to add the .png sequence of animations to an imageView which is fired by a UISwipeGestureRecogniser.
First of all create your gesture recognisers, Usually just put in ViewDidLoad
//Implement Swipe Views
UISwipeGestureRecognizer *swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:#selector(swipeLeft)];
swipeRight.numberOfTouchesRequired = 1;
swipeRight.direction = UISwipeGestureRecognizerDirectionLeft;
[_imageView addGestureRecognizer:swipeRight];
Then implement your swipeRight method, which you've declared in #selector(swipeRight), with the animation that you want to play upon swipe...
-(void)swipeRight
{
NSMutableArray *animationArray = [[NSMutableArray alloc] init];
int animationSizeTwo = 30;
for (int i=0; i< animationSize; i++) {
NSString *zeros = #"000";
if ( i >= 1000 ) {
zeros = #"";
}
else if ( i >= 100 ) {
zeros = #"0";
}
else if ( i >= 10 ) {
zeros = #"00";
}
NSString *animationNameTwo = [NSString stringWithFormat:#"(imageName)"];
NSString *imageName = [NSString stringWithFormat:#"%#%#%d.png", animationNameTwo, zeros, i];
[animationArrayTwo addObject:[UIImage imageNamed:imageName]];
}
_imageView.animationImages = animationArray;
_imageView.animationDuration = 1;
_imageView.animationRepeatCount = 1;
_imageView.image = [_imageView.animationImages lastObject];
[_imageView startAnimating];
}
Now whenever you swipe right the animation fire. You can copy and paste the UIGestureRecogniser code and change all methods around so you can have it firing both ways.. When you come to implement your swipeLeft just change the animation sequence count to be this:
int animationSizeTwo = 0;
for (int i=30; i> animationSize; i--) {
That will rotate your animation in reverse.
Hope this has been helpful and let me know how you get on! T

Image generator ( generateCGImagesAsynchronouslyForTimes method) doesn't give live results

Pretty new to cocoa development and really stuck with probably a fundamental problem.
So in short, my app UI looks like a simple window with a nsslider at the bottom. What I need is to generate N images and place them, onto N nsviews in my app window.
What it does so far:
I'm clicking on the slider (holding it) and dragging it. While I'm dragging it nothing happens to my views (pictures are not generated). When I release the slider the pictures got generated and my view get filled with them.
What I want:
- I need the views to be filled with pictures as I'm moving the slider.
I figured out the little check box on the NSSlider properties, which is continuous, and I'm using it, but my image generator still doesn't do anything until I release the slider.
Here is my code:
// slider move action
- (IBAction)sliderMove:(id)sender
{
[self generateProcess:[_slider floatValue];
}
// generation process
- (void) generateProcess:(Float64) startPoint
{
// create an array of times for frames to display
NSMutableArray *stops = [[NSMutableArray alloc] init];
for (int j = 0; j < _numOfFramesToDisplay; j++)
{
CMTime time = CMTimeMakeWithSeconds(startPoint, 60000);
[stops addObject:[NSValue valueWithCMTime:time]];
_currentPosition = initialTime; // set the current position to the last frame displayed
startPoint+=0.04; // the step between frames is 0.04sec
}
__block CMTime lastTime = CMTimeMake(-1, 1);
__block int count = 0;
[_imageGenerator generateCGImagesAsynchronouslyForTimes:stops
completionHandler:^(CMTime requestedTime, CGImageRef image, CMTime actualTime,AVAssetImageGeneratorResult result, NSError *error)
{
if (result == AVAssetImageGeneratorSucceeded)
{
if (CMTimeCompare(actualTime, lastTime) != 0)
{
NSLog(#"new frame found");
lastTime = actualTime;
}
else
{
NSLog(#"skipping");
return;
}
// place the image onto the view
NSRect rect = CGRectMake((count+0.5) * 110, 500, 100, 100);
NSImageView *iView = [[NSImageView alloc] initWithFrame:rect];
[iView setImageScaling:NSScaleToFit];
NSImage *myImage = [[NSImage alloc] initWithCGImage:image size:(NSSize){50.0,50.0}];
[iView setImage:myImage];
[self.windowForSheet.contentView addSubview: iView];
[_viewsToRemove addObject:iView];
}
if (result == AVAssetImageGeneratorFailed)
{
NSLog(#"Failed with error: %#", [error localizedDescription]);
}
if (result == AVAssetImageGeneratorCancelled)
{
NSLog(#"Canceled");
}
count++;
}];
}
}
If you have any thoughts or ideas, please share with me, I will really appreciate it!
Thank you
In order to make your NSSlider continuous, open your window controller's XIB file in Interface Builder and click on the NSSlider. Then, open the Utilities area
select the Attributes Inspector
and check the "Continuous" checkbox
under the Control header. Once you've done this, your IBAction sliderMove: will be called as the slider is moved rather than once the mouse is released.
Note: Alternatively, with an
NSSlider *slider = //...
one can simply call
[slider setContinuous:YES];

When sliding sprite, if sprite disappears off the side, it will wrap around to the opposite side?

When sliding sprite, if sprite disappears off the side, i want to make it wrap around to the opposite side but I do not know how to do this while the sprite is simultaneously being pushed off one side i want the other bit that you can't see to appear on the opposite side like a loop some sort of wormhole thing.
here is my code so far but it crashes and it only transports the sprite once the whole of the sprite disappears of the side. Loop also needs to run as an infinite loop until someone quits the app.
for (int i =0; i<16; ++i) {
MyNode *currentSprite = [c1array objectAtIndex:i];
if (currentSprite.contentSize.height>=320 || currentSprite.position.y-currentSprite.contentSize.height/2<=0 ){
MyNode *Bsprite = currentSprite;
MyNode *Tsprite = currentSprite;
Bsprite.scale = 1.0;
Tsprite.scale = 1.0;
if(currentSprite.position.y >=253){
Bsprite.position = ccp(currentSprite.position.x,-35);
[self addChild:Bsprite];
Bsprite.visible = TRUE;
}
if (currentSprite.position.y <=0) {
Tsprite.position = ccp(currentSprite.position.x,324);
[self addChild:Tsprite];
Tsprite.visible = TRUE;
}
MyNode *isChanging;
if ((Tsprite.visible == TRUE && currentSprite.visible == TRUE) || (Bsprite.visible == TRUE && currentSprite.visible == TRUE)) {
isChanging = TRUE;
}
if (isChanging == FALSE) {
[self removeChild:Tsprite cleanup:YES];
[self removeChild:Bsprite cleanup:YES];
}
}
}
It is not possible to do with one sprite. But you can have two sprites. In common situation when your sprite is sliding along the screen only one sprite will be visible. But when it reaches the border the second one will be visible too. When the second one will completely enter the screen - remove (or hide) the first one.
The best way to implement this is to create a CCNode subclass that will contain first and second sprite and will swap them if required. In this way all your logic will be very simple. You will just work with one CCNode (subclass) and will not think about swaping sprites - it will be done automatically by your class
EDIT
#interface MyNode : CCNode
{
CCSprite *sprite1;
CCSprite *sprite2;
CCSprite *currentSprite;
bool isChanging; //indicates that now two sprites are visible
}
#end

How to loop through core animation sublayer array and apply animations in sequence

I want to animate through an array of CATextLayers, one after the other. The layers are created and added in a loop. I need to the animation to work like a flip book. Up to now, as a proof of concept, I have Used CABasicAnimations but in order to animate multiple layers in sequence, I think I need one of the other Core Animation options but am not sure which one. Here's the loop adding the sublayers:
- (void) initLayers: (NSString *)endChar
{
CALayer *rootLayer = self.layer;
int counter =0;
for (NSString *element in alphabet) {
NSLog(#"element: %#",element);
NSString *topLayerName = [NSString stringWithFormat:#"TOP_%d_%#",counter,element];
NSString *bottomLayerName = [NSString stringWithFormat:#"BOT_%d_%#",counter,element];
//get index of endchar - indexOfObject
if (element != endChar) { //change to if key value is less than or equal to endchar index value
CATextLayer *topLayer = [CATextLayer layer];
topLayer.name = topLayerName;
[topLayer setAnchorPoint:CGPointMake(0.5f,1.0f)]; // set the anchorpoint for the transform. This affects layer position too
topLayer.bounds = CGRectMake(0.0f, 0.0f, CHARACTER_WIDTH, CHARACTER_HEIGHT/2);
topLayer.string = element;
topLayer.font = solariFont.fontName;
topLayer.fontSize = FONT_SIZE;
topLayer.backgroundColor = [UIColor blackColor].CGColor;
topLayer.position = CGPointMake(30,30);
topLayer.wrapped = NO;
[rootLayer addSublayer:topLayer];
CATextLayer *bottomLayer = [CATextLayer layer];
bottomLayer.name =bottomLayerName;
[bottomLayer setAnchorPoint:CGPointMake(0.5f,0.0f)]; // set the anchorpoint for the transform. This affects layer position too
bottomLayer.bounds = CGRectMake(0.0f,CHARACTER_HEIGHT/4, CHARACTER_WIDTH, CHARACTER_HEIGHT/2);
bottomLayer.string = element;
bottomLayer.font = solariFont.fontName;
bottomLayer.fontSize = FONT_SIZE;
bottomLayer.backgroundColor = [UIColor blackColor].CGColor;
bottomLayer.position = CGPointMake(topLayer.position.x,topLayer.position.y+2);
bottomLayer.wrapped = NO;
[rootLayer addSublayer:bottomLayer];
counter++;
}
}
[self animChars:rootLayer.sublayers];
}
The question is how can I animate the layers one after the other without the animation for every layer happening at the same time? I want to be able to loop through the sublayers array and animate each CATextLayer in sequence. Do I need CATransactions, MediaTiming? I've been through the core animation guide but am none the wiser.
This is very easy actually. You first need to determine the interval between the animations that you want. When you add the layer to the root layer inside the for loop, set the animations media timing's property beginTime with a CGFloat that increments every time the loop fires.
for the animation use a CABasicAnimation... if you don't know how to set one of those up there are plenty of resources on the web.
I did this by giving each animation a key and testing for this in animationDidStop:
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
if (anim ==[topFront animationForKey:#"topCharFlip"]) { ....