SlideShare a Scribd company logo
1 of 38
Download to read offline
CATransaction
What the flush ?!
Amadour Griffais
CocoaHeads Paris
9 janvier 2014
Core Animation
• crée et manipule des objets graphiques
• les affiche
• les anime
Core Animation
Core Animation
Core Animation
Core Animation
Core Animation
Model
Ab

CALayer
CAAnimation
Core Animation
Model
Ab

Render server

CALayer
CAAnimation

C++
Core Animation
Model
Ab

Render server

CALayer
CAAnimation

C++
Core Animation
Model
Ab

CALayer
CAAnimation
Core Animation
Model
Ab

CALayer
CAAnimation
CATransaction
Core Animation Programming Guide
Explicit Transactions Let You Change Animation Parameters
[CATransaction
[CATransaction
layer.position
[CATransaction

begin];
setAnimationDuration:0.5];
= CGPoint(100,100);
commit];
CATransaction
Model
Ab
CATransaction
Model
0.5s

Ab
CATransaction
Core Animation Programming Guide
Explicit Transactions Let You Change Animation Parameters
[CATransaction
[CATransaction
layer.position
[CATransaction

begin];
setAnimationDuration:0.5];
= CGPoint(100,100);
commit];

Disable Actions Temporarily Using the CATransaction Class
[CATransaction
[CATransaction
layer.position
[CATransaction

begin];
setDisableActions:YES];
= CGPoint(100,100);
commit];
CATransaction
Model
Ab
CATransaction
Model
Ab
CATransaction Class Reference
CATransaction Class Reference
Model

Render server
Model
Ab

Render server
[CATransaction flush];
Model
Ab

Render server
[CATransaction flush];
Model
Ab

Render server
Ab
[CATransaction flush];
• Commit de la transaction implicite
• Englobe toutes les transaction explicites
• Envoie les modifications au render server
[CATransaction flush];
• A chaque tour de runloop
• Provoque layout si nécessaire
[CATransaction flush];
• A chaque tour de runloop
• Provoque layout si nécessaire
• Provoque display si nécessaire
[CATransaction flush];
• Equivalent à [CATransaction commit];
• Attend la fin des transaction explicites
• Définit le beginTime des animations !
[CATransaction begin];
[CATransaction setAnimationDuration:0.5];
CAAnimation* anim = [CABasicAnimation animationWithKeyPath:@"opacity"];
[layer addAnimation:anim forKey:@"opacity"];
//<CABasicAnimation:0xc028980; duration = 0.5; keyPath = opacity>
[CATransaction commit];
//<CABasicAnimation:0xc028980; duration = 0.5; keyPath = opacity>
[CATransaction flush];
//<CABasicAnimation:0xc028980; beginTimeMode = absolute;
//
beginTime = 11797.4; duration = 0.5; keyPath = opacity>
En pratique
Déclencher une animation d’attente avant de
bloquer le main thread
[activityIndicator startAnimating];
[self doReallyLongStuff];
En pratique
Déclencher une animation d’attente avant de
bloquer le main thread
[activityIndicator startAnimating];
[CATransaction flush];
[self doReallyLongStuff];
En pratique
Appliquer des animations implicites à des
layers qui viennent d’être ajoutés
CALayer* layer = [CALayer layer];
layer.frame = CGRectMake(0, 0, 200, 200);
layer.backgroundColor = [[UIColor redColor] CGColor];
[self.view.layer addSublayer:layer];
layer.frame = CGRectMake(100, 100, 200, 200);
En pratique
Appliquer des animations implicites à des
layers qui viennent d’être ajoutés
CALayer* layer = [CALayer layer];
layer.frame = CGRectMake(0, 0, 200, 200);
layer.backgroundColor = [[UIColor redColor] CGColor];
[self.view.layer addSublayer:layer];
[CATransaction flush];
layer.frame = CGRectMake(100, 100, 200, 200);
En pratique
Faire un rendu dans un contexte en
background et nettoyer derrière soi
CALayer* layer = ...;
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_LOW, 0),
^{
UIGraphicsBeginImageContext(layer.bounds.size);
CGContextRef context = UIGraphicsGetCurrentContext();
[layer renderInContext:context];
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
dispatch_sync(dispatch_get_main_queue(), ^{
[self useImage:image];
});
});
En pratique
Faire un rendu dans un contexte en
background et nettoyer derrière soi
CALayer* layer = ...;
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_LOW, 0),
^{
UIGraphicsBeginImageContext(layer.bounds.size);
CGContextRef context = UIGraphicsGetCurrentContext();
[layer renderInContext:context];
[CATransaction flush];
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
dispatch_sync(dispatch_get_main_queue(), ^{
[self useImage:image];
});
});
En pratique ?
Faire un rendu dans un contexte en
background et nettoyer derrière soi
CALayer* layer = ...;
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_LOW, 0),
^{
[CATransaction lock];
UIGraphicsBeginImageContext(layer.bounds.size);
CGContextRef context = UIGraphicsGetCurrentContext();
[layer renderInContext:context];
[CATransaction unlock];
[CATransaction flush];
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
dispatch_sync(dispatch_get_main_queue(), ^{
[self useImage:image];
});
});
Questions ?
• Ressources
• WWDC videos
• Core Animation Programming Guide
@amadour

More Related Content

What's hot

Introduction to asynchronous DB access using Node.js and MongoDB
Introduction to asynchronous DB access using Node.js and MongoDBIntroduction to asynchronous DB access using Node.js and MongoDB
Introduction to asynchronous DB access using Node.js and MongoDB
Adrien Joly
 
Asynchronous Programming with JavaScript
Asynchronous Programming with JavaScriptAsynchronous Programming with JavaScript
Asynchronous Programming with JavaScript
WebF
 
Mage Titans - Workshop - UI Components
Mage Titans - Workshop - UI ComponentsMage Titans - Workshop - UI Components
Mage Titans - Workshop - UI Components
vkorotun
 

What's hot (20)

Présentation de HomeKit
Présentation de HomeKitPrésentation de HomeKit
Présentation de HomeKit
 
AWS user group September 2017 - Rob Ribeiro "Seeking Solutions for Debugging ...
AWS user group September 2017 - Rob Ribeiro "Seeking Solutions for Debugging ...AWS user group September 2017 - Rob Ribeiro "Seeking Solutions for Debugging ...
AWS user group September 2017 - Rob Ribeiro "Seeking Solutions for Debugging ...
 
clara-rules
clara-rulesclara-rules
clara-rules
 
Declarative UIs with Jetpack Compose
Declarative UIs with Jetpack ComposeDeclarative UIs with Jetpack Compose
Declarative UIs with Jetpack Compose
 
Curso de Node.js e MongoDB - 16
Curso de Node.js e MongoDB - 16Curso de Node.js e MongoDB - 16
Curso de Node.js e MongoDB - 16
 
Map kit light
Map kit lightMap kit light
Map kit light
 
Introduction to asynchronous DB access using Node.js and MongoDB
Introduction to asynchronous DB access using Node.js and MongoDBIntroduction to asynchronous DB access using Node.js and MongoDB
Introduction to asynchronous DB access using Node.js and MongoDB
 
What's new in WorkManager-Andri Suranta Ginting (Product Engineer-Gojek)
What's new in WorkManager-Andri Suranta Ginting (Product Engineer-Gojek)What's new in WorkManager-Andri Suranta Ginting (Product Engineer-Gojek)
What's new in WorkManager-Andri Suranta Ginting (Product Engineer-Gojek)
 
ECMAScript 6 and the Node Driver
ECMAScript 6 and the Node DriverECMAScript 6 and the Node Driver
ECMAScript 6 and the Node Driver
 
Leaving Interface Builder Behind
Leaving Interface Builder BehindLeaving Interface Builder Behind
Leaving Interface Builder Behind
 
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
 
Ansible Israel Kickoff Meetup
Ansible Israel Kickoff MeetupAnsible Israel Kickoff Meetup
Ansible Israel Kickoff Meetup
 
Javascript Styles and some tips
Javascript Styles and some tipsJavascript Styles and some tips
Javascript Styles and some tips
 
Asynchronous Programming with JavaScript
Asynchronous Programming with JavaScriptAsynchronous Programming with JavaScript
Asynchronous Programming with JavaScript
 
IoT Best practices
 IoT Best practices IoT Best practices
IoT Best practices
 
Advanced functional programing in Swift
Advanced functional programing in SwiftAdvanced functional programing in Swift
Advanced functional programing in Swift
 
Jetpack Compose a nova forma de implementar UI no Android
Jetpack Compose a nova forma de implementar UI no AndroidJetpack Compose a nova forma de implementar UI no Android
Jetpack Compose a nova forma de implementar UI no Android
 
Mage Titans - Workshop - UI Components
Mage Titans - Workshop - UI ComponentsMage Titans - Workshop - UI Components
Mage Titans - Workshop - UI Components
 
The Django Book CH13 Generating Non-HTML Content
The Django Book CH13 Generating Non-HTML ContentThe Django Book CH13 Generating Non-HTML Content
The Django Book CH13 Generating Non-HTML Content
 
Managing VMware VMs with Ansible
Managing VMware VMs with AnsibleManaging VMware VMs with Ansible
Managing VMware VMs with Ansible
 

Similar to CocoaHeads Paris - CATransaction: What the flush?!

Core animation taobao
Core animation taobaoCore animation taobao
Core animation taobao
yarshure Kong
 
Crafting interactions with Core Animations, David Ortinau
Crafting interactions with Core Animations, David OrtinauCrafting interactions with Core Animations, David Ortinau
Crafting interactions with Core Animations, David Ortinau
Xamarin
 
Building animated UI with Core Animation
Building animated UI with Core AnimationBuilding animated UI with Core Animation
Building animated UI with Core Animation
Marco Zoffoli
 

Similar to CocoaHeads Paris - CATransaction: What the flush?! (20)

Core animation taobao
Core animation taobaoCore animation taobao
Core animation taobao
 
Building a Native Camera Access Library - Part IV - Transcript.pdf
Building a Native Camera Access Library - Part IV - Transcript.pdfBuilding a Native Camera Access Library - Part IV - Transcript.pdf
Building a Native Camera Access Library - Part IV - Transcript.pdf
 
Core Animation
Core AnimationCore Animation
Core Animation
 
iOS Core Animation
iOS Core AnimationiOS Core Animation
iOS Core Animation
 
Core animation
Core animationCore animation
Core animation
 
Crafting interactions with Core Animations, David Ortinau
Crafting interactions with Core Animations, David OrtinauCrafting interactions with Core Animations, David Ortinau
Crafting interactions with Core Animations, David Ortinau
 
Angular animate
Angular animateAngular animate
Angular animate
 
Building animated UI with Core Animation
Building animated UI with Core AnimationBuilding animated UI with Core Animation
Building animated UI with Core Animation
 
Google I/O 2013 - Android Graphics Performance
Google I/O 2013 - Android Graphics PerformanceGoogle I/O 2013 - Android Graphics Performance
Google I/O 2013 - Android Graphics Performance
 
Google I/O 2013 - Android Graphics Performance
Google I/O 2013 - Android Graphics PerformanceGoogle I/O 2013 - Android Graphics Performance
Google I/O 2013 - Android Graphics Performance
 
React Native - Workshop
React Native - WorkshopReact Native - Workshop
React Native - Workshop
 
Starting Core Animation
Starting Core AnimationStarting Core Animation
Starting Core Animation
 
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative LanguagesJavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
 
Java Core | JavaFX 2.0: Great User Interfaces in Java | Simon Ritter
Java Core | JavaFX 2.0: Great User Interfaces in Java | Simon RitterJava Core | JavaFX 2.0: Great User Interfaces in Java | Simon Ritter
Java Core | JavaFX 2.0: Great User Interfaces in Java | Simon Ritter
 
A dive into akka streams: from the basics to a real-world scenario
A dive into akka streams: from the basics to a real-world scenarioA dive into akka streams: from the basics to a real-world scenario
A dive into akka streams: from the basics to a real-world scenario
 
Animations - Part 3.pdf
Animations - Part 3.pdfAnimations - Part 3.pdf
Animations - Part 3.pdf
 
JavaFX 2.0 With Alternative Languages - Groovy, Clojure, Scala, Fantom, and V...
JavaFX 2.0 With Alternative Languages - Groovy, Clojure, Scala, Fantom, and V...JavaFX 2.0 With Alternative Languages - Groovy, Clojure, Scala, Fantom, and V...
JavaFX 2.0 With Alternative Languages - Groovy, Clojure, Scala, Fantom, and V...
 
Core Animation
Core AnimationCore Animation
Core Animation
 
Seven Peaks Speaks - Android Jetpack Compose Animation
Seven Peaks Speaks - Android Jetpack Compose AnimationSeven Peaks Speaks - Android Jetpack Compose Animation
Seven Peaks Speaks - Android Jetpack Compose Animation
 
JavaFX Overview
JavaFX OverviewJavaFX Overview
JavaFX Overview
 

Recently uploaded

Recently uploaded (20)

Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilDeveloping An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 

CocoaHeads Paris - CATransaction: What the flush?!