I'm trying to create an UIView and change its alpha property to simulate backlight change.
Here is my code
TransparentView = [[UIView alloc] initWithFrame:self.view.bounds];
TransparentView.backgroundColor = [UIColor whiteColor];
self.view = TransparentView;
TransparentView.alpha = 0.2;
float step = 1.0 / ( appDelegate.OnOffTime * 100);
for (float f = 0; f < 1; f=f+step) {
TransparentView.alpha = (CGFloat)(1 - f);
[NSThread sleepForTimeInterval:0.01];
}
Both TransparentView.alpha = 0.2 and TransparentView.alpha = (CGFloat)(1 - f) do change TransparentView.alpha, but only TransparentView.alpha = 0.2 changes real device "brightness'.
What am I doing wrong?
I think the issue is that you are sleeping the thread, and not actually setting up an asynchronous timer. What this means is, you actually are not letting the run loop get around to making your changes on screen, because you are not exiting this loop until it's back up to 1 :-)
EDIT: to clarify:
Any change you make to your UI will not actually get drawn until the run loop "comes back around", which requires your method to return. You likely want an NSTimer instance, configured to call a method on this object which increments the alpha (and checks the alpha against your destination value; invalidating the timer when it reaches it.
You may want to consider changing your code to use the built-in UIView animation support. This will ensure that your view is updated and you aren't sleeping the main thread. If you need to do something special once the animation completes, you can use the completion: version of the method.
TransparentView.alpha = 0.2;
[UIView animateWithDuration: appDelegate.OnOffTime animations:^{
TransparentView.alpha = 0.0;
}];
Alpha and luminance are two different concepts for a view. If you really wanted to change the luminance of the display, you can use iOS 5+'s [[UIScreen mainScreen]brightness];, otherwise your alpha changes need to be against a black background and not using such strange numbers as a cast 1-float. My bet is that your little algorithm is returning a large enough step factor that your view is being told to display alpha values over one (which defaults to one anyhow).
Related
I am building a game with SceneKit. It is based on SCNBoxes which get added and removed. At the end there are like 30 boxes added to the root node.
// Prepare Surface Layer for Blocks
self.colorOfBlock = [CALayer layer];
self.colorOfBlock.frame = CGRectMake(0, 0, 1000, 1000);
self.colorOfBlock.backgroundColor = [UIColor colorWithHue:0 saturation:1 brightness:1 alpha:1].CGColor;
self.textLayer = [CATextLayer layer];
self.textLayer.frame = self.colorOfBlock.bounds;
self.textLayer.fontSize = 750;//self.colorOfBlock.bounds.size.height;
self.textLayer.string = #"2";
self.textLayer.alignmentMode = kCAAlignmentCenter;
self.textLayer.foregroundColor = [UIColor blackColor].CGColor;
[self.textLayer display];
[self.colorOfBlock addSublayer:self.textLayer];
// Prepare Material for the Block
SCNMaterial *material = [SCNMaterial material];
material.diffuse.contents = self.colorOfBlock;
// Create the Block
self.blockNode = [SCNNode node];
self.blockNode.geometry = [SCNBox boxWithWidth:0.95 height:0.95 length:0.95 chamferRadius:0.1];
self.blockNode.geometry.firstMaterial = material;
self.blockNode.position = position;
// Setup the physics body
self.blockNode.physicsBody = [SCNPhysicsBody dynamicBody];
self.blockNode.physicsBody.affectedByGravity = NO;
self.blockNode.physicsBody.categoryBitMask = CollisionCategoryBlock;
self.blockNode.physicsBody.contactTestBitMask = CollisionCategoryBorder | CollisionCategoryBlock;
self.blockNode.physicsBody.collisionBitMask = CollisionCategoryBorder | CollisionCategoryBlock;
self.blockNode.physicsBody.angularVelocityFactor = SCNVector3Make(0, 0, 0);
[self addChildNode:self.blockNode];
self.gameValue = 2;
if (position.z < 1) {
self.name = #"Front";
} else {
self.name = #"Back";
}
After a while the textLayer seem to disappear. If new blocks are added, they have no textLayer anymore. And another side effect is that old textLayers on the existing blocks are not updated anymore.
On the next step newly added blocks become invisible. Or better to say - they never get a CALayer. But the physicsBodies are still working.
And sometimes the view crashes. The debugger says something like the position of the crashing area can not be found. After this the view is deformed. But I still can call SCNActions that clears the view and shows up all created Objects that are NOT these blocks like I posted. These blocks are totally kicked out of the view.
By the way when I setup the "phonglighttype" for those blocks this bugging cascade happens earlier.
There is also one more thing I noticed. When I tab out of the App (tested from iPhone 5) and tabbed in again after a while, the
self.gameView.showsStatistics = YES;
shows on the GPU bar a blue line. After 2 or 3 sec, the blue bar is gone and a full green GPU bar shows that it is ready for getting used. And everything works like it should do. After a while these blocks become invisible again. If I tab out and tab in again, newly added Blocks are visible again.
Somehow I think of that I am spamming my device cache until the App crashes. But there is no useful hint from Xcode. I wonder if an option to clear the viewControllers cache might solve this problem - if there is an option for this.
Kind Regards
I did not solved it completely, but I decided to replace every part of CALayer and CATextLayer with a common
material.diffuse.contents = [arrayOfTextures objectAtIndex:certainImage];
With a higher resolution (like Iphone 6 has) it did show up that the CALayer was causing some kind of graphical faulting. But the simple pre-worked image (from an imageArray) solution improves the performance pretty much and prevents from crashing.
I can not surely say if there is no way to solve it with the CALayer approach. But loading images as Material and updating them brought the most satisfying result.
I'm trying to create multiple "cards" to animate them afterwards using this code:
CAReplicatorLayer *cardsWrapperLayer = [CAReplicatorLayer layer];
cardsWrapperLayer.instanceCount = 4;
cardsWrapperLayer.instanceDelay = 10;
cardsWrapperLayer.instanceTransform = CATransform3DMakeTranslation(0, phoneSize.height + self.phonePadding, 0);
[cardsWrapperLayer addSublayer:self.cardLayer];
but they are appearing all at the same time, even if the instanceDelay is set to 10. I have this piece of code in the viewDidAppear method.
instanceDelay doesn’t do anything by itself, it just shifts the “current time” for each instance. To see something happen, you need to add an animation, like this:
CABasicAnimation *fadeIn = [CABasicAnimation animationWithKeyPath:#"opacity"];
fadeIn.fromValue = #0; // if we don’t specify a toValue, it’ll animate to the layer’s current value which by default is 1
fadeIn.duration = 0.2;
fadeIn.removedOnCompletion = NO;
[self.cardLayer addAnimation:appear forKey:#"appear"];
Note that the removedOnCompletion is important—if you let the animation remove itself automatically, then it’ll be gone as soon as the first instance finishes animating and the other instances will snap to their final state. You should remove the animation manually at a later time, like when you know it’ll be over (i.e. the animation’s duration ✕ the replicator layer’s instanceCount)—just call -removeAnimationForKey: on the base layer with the key you added the animation with.
You also have to make sure that you set the animation on the replicator layer's sublayer, not on the replicator layer itself! Bit me hard after 3 years of not working with CAReplicatorLayer again.
This question has been asked before but in a slightly different way and I was unable to get any of the answers to work the way I wanted, so I am hoping somebody with great Core Animation skills can help me out.
I have a set of cards on a table. As the user swipes up or down the set of cards move up and down the table. There are 4 cards visible on the screen at any given time, but only the second card is showing its face. As the user swipes the second card flips back onto its face and the next card (depending on the swipe direction) lands in it's place showing its face.
I have set up my card view class like this:
#interface WLCard : UIView {
UIView *_frontView;
UIView *_backView;
BOOL flipped;
}
And I have tried flipping the card using this piece of code:
- (void) flipCard {
[self.flipTimer invalidate];
if (flipped){
return;
}
id animationsBlock = ^{
self.backView.alpha = 1.0f;
self.frontView.alpha = 0.0f;
[self bringSubviewToFront:self.frontView];
flipped = YES;
CALayer *layer = self.layer;
CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
rotationAndPerspectiveTransform.m34 = 1.0 / 500;
rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, M_PI, 1.0f, 0.0f, 0.0f);
layer.transform = rotationAndPerspectiveTransform;
};
[UIView animateWithDuration:0.25
delay:0.0
options: UIViewAnimationCurveEaseInOut
animations:animationsBlock
completion:nil];
}
This code works but it has the following problems with it that I can't seem to figure out:
Only half of the card across the x-axis is animated.
Once flipped, the face of the card is upside down and mirrored.
Once I've flipped the card I cannot get the animation to ever run again. In other words, I can run the animation block as many times as I want, but only the first time will animate. The subsequent times I try to animate lead to just a fade in and out between the subviews.
Also, bear in mind that I need to be able to interact with the face of the card. i.e. it has buttons on it.
If anybody has run into these issues it would be great to see your solutions. Even better would be to add a perspective transform to the animation to give it that extra bit of realism.
This turned out to be way simpler than I thought and I didn't have to use any CoreAnimation libraries to achieve the effect. Thanks to #Aaron Hayman for the clue. I used transitionWithView:duration:options:animations:completion
My implementation inside the container view:
[UIView transitionWithView:self
duration:0.2
options:UIViewAnimationOptionTransitionFlipFromBottom
animations: ^{
[self.backView removeFromSuperview];
[self addSubview:self.frontView];
}
completion:NULL];
The trick was the UIViewAnimationOptionTransitionFlipFromBottom option. Incidentally, Apple has this exact bit of code in their documentation. You can also add other animations to the block like resizing and moving.
Ok, this won't be a complete solution but I'll point out some things that might be helpful. I'm not a Core-Animation guru but I have done a few 3D rotations in my program.
First, there is no 'back' to a view. So if you rotate something by M_PI (180 degrees) you're going to be looking at that view as though from the back (which is why it's upside down/mirrored).
I'm not sure what you mean by:
Only half of the card across the x-axis is animated.
But, it it might help to consider your anchor point (the point at which the rotation occurs). It's usually in the center, but often you need it to be otherwise. Note that anchor points are expressed as a proportion (percentage / 100)...so the values are 0 - 1.0f. You only need to set it once (unless you need it to change). Here's how you access the anchor point:
layer.anchorPoint = CGPointMake(0.5f, 0.5f) //This is center
The reason the animation only ever runs once is because transforms are absolute, not cumulative. Consider that you're always starting with the identity transform and then modifying that, and it'll make sense...but basically, no animation occurs because there's nothing to animate the second time (the view is already in the state you're requesting it to be in).
If you're animating from one view to another (and you can't use [UIView transitionWithView:duration:options:animations:completion:];) you'l have to use a two-stage animation. In the first stage of the animation, for the 'card' that is being flipped to backside, you'll rotate the view-to-disappear 'up/down/whatever' to M_PI_2 (at which point it will be 'gone', or not visible, because of it's rotation). And in the second stage, you're rotate the backside-of-view-to-disappear to 0 (which should be the identity transform...aka, the view's normal state). In addition, you'll have to do the exact opposite for the 'card' that is appearing (to frontside). You can do this by implementing another [UIView animateWithDuration:...] in the completion block of the first one. I'll warn you though, doing this can get a little bit complicated. Especially since you're wanting views to have a 'backside', which will basically require animating 4 views (the view-to-disappear, the view-to-appear, backside-of-view-to-disappear, and the backside-of-view-to-appear). Finally, in the completion block of the second animation you can do some cleanup (reset view that are rotated and make their alpha 0.0f, etc...).
I know this is complicated, so you might want read some tutorial on Core-Animation.
#Aaron has some good info that you should read.
The simplest solution is to use a CATransformLayer that will allow you to place other CALayer's inside and maintain their 3D hierarchy.
For example to create a "Card" that has a front and back you could do something like this:
CATransformLayer *cardContainer = [CATransformLayer layer];
cardContainer.frame = // some frame;
CALayer *cardFront = [CALayer layer];
cardFront.frame = cardContainer.bounds;
cardFront.zPosition = 2; // Higher than the zPosition of the back of the card
cardFront.contents = (id)[UIImage imageNamed:#"cardFront"].CGImage;
[cardContainer addSublayer:cardFront];
CALayer *cardBack = [CALayer layer];
cardBack.frame = cardContainer.bounds;
cardBack.zPosition = 1;
cardBack.contents = (id)[UIImage imageNamed:#"cardBack"].CGImage; // You may need to mirror this image
[cardContainer addSublayer:cardBack];
With this you can now apply your transform to cardContainer and have a flipping card.
#Paul.s
I followed your approach with card container but when i applt the rotation animation on card container only one half of the first card rotates around itself and finally the whole view appears.Each time one side is missing in the animation
Based on Paul.s this is updated for Swift 3 and will flip a card diagonally:
func createLayers(){
transformationLayer = CATransformLayer(layer: CALayer())
transformationLayer.frame = CGRect(x: 15, y: 100, width: view.frame.width - 30, height: view.frame.width - 30)
let black = CALayer()
black.zPosition = 2
black.frame = transformationLayer.bounds
black.backgroundColor = UIColor.black.cgColor
transformationLayer.addSublayer(black)
let blue = CALayer()
blue.frame = transformationLayer.bounds
blue.zPosition = 1
blue.backgroundColor = UIColor.blue.cgColor
transformationLayer.addSublayer(blue)
let tgr = UITapGestureRecognizer(target: self, action: #selector(recTap))
view.addGestureRecognizer(tgr)
view.layer.addSublayer(transformationLayer)
}
Animate a full 360 but since the layers have different zPositions the different 'sides' of the layers will show
func recTap(){
let animation = CABasicAnimation(keyPath: "transform")
animation.delegate = self
animation.duration = 2.0
animation.fillMode = kCAFillModeForwards
animation.isRemovedOnCompletion = false
animation.toValue = NSValue(caTransform3D: CATransform3DMakeRotation(CGFloat(Float.pi), 1, -1, 0))
transformationLayer.add(animation, forKey: "arbitrarykey")
}
I'm trying to make an ipad application that draws alot, but I really mean alot of lines on stage (10.000+)
using this simple forloop, my ipad crashes after 40~60 seconds (without showing result)
for ( int i = 0; i < 10000; i++ )
{
int r_x = rand() % 750;
int r_y = rand() % 1000;
CGPoint pointpoint = CGPointMake(r_x, r_y);
UIColor *st = [[GetColor alloc] getPixelColorAtLocation:pointpoint];
DrawLine *drawview = [[DrawLine alloc]initWithFrame:CGRectMake(r_x, r_y, 20, 20) selectedcolor:st];
[self.view addSubview:drawview];
[drawview release];
[DrawLine release];
[GetColor release];
}
and this is my "DrawLine" class:
- (id)initWithFrame:(CGRect)frame selectedcolor:colors{
if ((self = [super initWithFrame:frame])) {
selectedcolor_t = colors;
self.backgroundColor = [UIColor clearColor];
}
return self;
}
- (void)drawRect:(CGRect)frame{
CGContextRef c = UIGraphicsGetCurrentContext();
float* colors = CGColorGetComponents(selectedcolor_t.CGColor);
CGContextSetStrokeColor(c, colors);
CGContextBeginPath(c);
CGContextMoveToPoint(c, 0.0f, 0.0f);
CGContextAddLineToPoint(c, 20.0f, 20.0f);
CGContextStrokePath(c);
}
how can I solve this problem? How can I draw this much subviews without crashing the iOS?
thanks so much!! :)
Please reconsider what you are doing there:
In line 4 of your loop, you alloc an instance of GetColor — which you never use again. Ask yourself: Does that make any sense from a design point of view?
In that same line, if you don't violate Cocoa's naming-conventions, you create a UIColor that is never released...
Then in line 8 you release the class-object of DrawLine (ditto that for the next line and the GetColor-class). This is terribly, horribly wrong!
Please visit the Memory Management Programming Guide at the iOS Dev-Center and read the first two sections (again)!
Besides that, re-evaluate your design:
Should GetColor really be a class, so that you create instances? Wouldn't a simple helper-function for color interpolation make more sense in this context?
If it should be a class, why not create just one instance of it outside of the loop and simply query it repeatedly for the colors?
Do you really need a subclass of UIView to draw a single straight, solid, single-colored line? If the lines need not be updated, you should (as Richard and nacho4d suggested) draw all of them in one object (e.g. by a custom UIView or by a delegate of CALayer implementing the drawLayer:inContext: method). If you need to update those lines later, you could simply (ab)use CALayer...
In the latter case, your problem then becomes:
Calculate your random coordinates.
Calculate your color.
Create an opaque CALayer with
a) that color as its backgroundColor,
b) a width of 20 * sqrt(2),
c) a height of whatever-you-want-to-be-the-width-of-that-line,
d) your point as its origin and
e) a rotation of 45.
Add that layer as a sublayer to self.view's layer.
Cheers
Daniel
If your lines are static (not moving later, not animating, etc) , as they seem to be, you could also draw all the lines in a single drawRect: in one view without creating 1000 of CALayers.
I can't tell if this is faster than drawing 1000 CALayers (because CoreAnimation is hardware accelerated and CoreGraphics is not) but it's surely lighter since all the lines will be flattened in a single bitmap. (which is the context of your view)
Just move your for loop inside your drawRect: and follow danyowde advices.( you just need one color object or a helper function but not to create a color each iteration)
Good luck, Hope it helps;)
I have a view which I want to be scaled and translated to a new location by animating it. I tried to achieve it with the following code:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:kDurationForFullScreenAnimation];
[[self animatingView] setFrame:finalRect];
[UIView commitAnimations];
The effect of this code is, the view first changes its content's size to the finalRect and then translates it to the new location. i.e. The scaling part is never animated. The view is just transformed to the new size and then translated.
This issue is already discussed in several other threads but none of them draw a conclusion. A solution does exist though, to use a timer and set the frame each time in the timer callback, but it has a performance drawback.
What is the most appropriate solution to this problem, also, why in first case this problem occur?
Thanks
Setting the frame does neither a scale nor a translation. You are either using the wrong terminology or you are using the wrong tool for the job. Scale and translate are both done using Core Graphics Affine transforms when you're looking to affect the UIView (as opposed to the layer which use Core Animation transforms).
To scale a view use
// 2x
[rotationView setTransform:CGAffineTransformMakeScale(2.0, 2.0)];
To translate, use
// Move origin by 100 on both axis
[rotationView setTransform:CGAffineTransformMakeTranslation(100.0, 100.0)];
To animate these, wrap them in an animation block. If you want to transform the view with both of these, then you need to concatenate them.
If you are not wanting scale and translation (transforms) at all, then what you mean is you want to change the view's bounds and position. These are changed with calls to
[view setBounds:newRect];
[view setCenter:newCenter];
Where newRect and newCenter are a CGRect and CGPoint respectively that represent the new position on the screen. Again, these need wrapped in an animation block.
Here is an example with block animation:
CGPoint newCenter = CGPointMake(100.0,100.0);
[UIView animateWithDuration: 1
delay: 0
options: (UIViewAnimationOptionCurveLinear | UIViewAnimationOptionAllowUserInteraction)
animations:^{object.center = newCenter ; object.transform = CGAffineTransformScale(CGAffineTransformIdentity, 2.0, 2.0);}
completion:^(BOOL finished) { }
];
Try this solution :
CGAffineTransform s = CGAffineTransformMakeScale(0.5f,0.5f);
CGAffineTransform t = CGAffineTransformMakeTranslation(100, 0);
v2.transform = CGAffineTransformConcat(t,s); // not s,t
this operation is not commutative. The order is the opposite of the order when using convenience functions for applying one transform to another.
And you can use this operation to : for example (remove the Scale) :
v2.transform =
CGAffineTransformConcat(CGAffineTransformInvert(s), v2.transform);