Learn what kinds of things can affect your app's energy usage as well as some strategies for tracking down and fixing problems.
Hey @luke_parham
Where do I find the challenge that you mentioned at last in the video for core Animations?
Please check out the challenge pdf file from the download materials folder for this video when you get a chance. Thank you! :]
@luke_parham After learning all this videos, I have some questions, As we all know, code like below will cause off-screen rendered.
imageView.layer.cornerRadius = CGRectGetHeight(imageView.bounds)/2.0
imageView.layer.masksToBounds = true
so
masksToBounds will cause off-screen rendered, could you explain all of these ? I really don’t understand what happened under the groundHey @ys_xs, did you get a chance to do the challenge for the Core Animation video yet? That should explain a few options for fixing offscreen rendering, specifically when it comes to circular images.
In general: offscreen rendering happens when the system needs to create a bitmap in memory before rendering something to the screen. In my understanding, this can happen when you ask UIKit to do something but don’t give it enough information.
For example: if you try to add shadows to a UIView, you can do so by setting shadow properties on the layer like shadowColor and shadowRadius, but if you don’t set shadowPath then the shadow will be created using offscreen rendering. In this case, the GPU needs to draw the text so the CPU can figure out what the shape of the shadow should be. If you give it a shape by providing a UIBezierPath then it won’t need to do the offscreen rendering.
Same for drawing circles in iOS. If you use a bezier path then you can avoid offscreen rendering. There are a few strategies that offer pros and cons such as blending or no blending and varying degrees of difficulty.
For Shadows
Text: Use NSShadow and an NSAttributedString
UIView: Define shadowPath with UIBezierPath
UIView with Round Corners + Shadow: Use two views, one for the image and one for the shadow
Also, if you want another resource that explains shadows in some detail, here’s a really good video from Todd Kerpelman: How Google does shadows on iOS (Route 85) - YouTube
For Round Corners
I would say go check out that challenge for an example of three ways to have rounded corners.
@luke_parham Thank you very much, your explain is awesome !
I don’t see any Core Animation video right now, and I take a glance at that, I can’t find any topic about offscreen rendering, Could you give me more detail like which lesson should i learn or start?
And I also have a question about core animation instruments, I find a tool call ‘color Misaligned images’,
i write a code snippets like below and run it on iPhone 8
UILabel *view1 = [[UILabel alloc] initWithFrame:CGRectMake(20, 100, 300, 40)];
view1.backgroundColor = [UIColor lightGrayColor];
[self.view addSubview:view1];
UILabel *view2= [[UILabel alloc] initWithFrame:CGRectMake(20, 150, 300.10000002, 40)];
view2.backgroundColor = [UIColor lightGrayColor];
[self.view addSubview:view2];
UILabel *view3 = [[UILabel alloc] initWithFrame:CGRectMake(20, 200, 300, 40.333333333)];
view3.backgroundColor = [UIColor lightGrayColor];
[self.view addSubview:view3];
UILabel *view4= [[UILabel alloc] initWithFrame:CGRectMake(20, 250, 300, 40.1000000001)];
view4.backgroundColor = [UIColor lightGrayColor];
[self.view addSubview:view4];
when i turn on ‘color Misaligned images’ feature, some label are overlaid in magenta, so my question is
I can’t see the "debug options " in instruments animations 
@vicktormanuel Yeah it depends on the instrument but a lot of them have changed since last year. If you’re looking at the Core Animation Instrument and trying to find debug options then you can now find them in Xcode under Debug > View Debugging > Rendering