www.celedev.com
cele
dev Programmation Responsive
Une nouvelle façon de développer pour iOS
Jean-Luc JumpertzOctobre 2013
CocoaHeads Rennes #14
cele
dev
Évolution des apps iOS
2008
cele
dev
Évolution des apps iOS• Des appareils mobiles de plus en plus
puissants, avec des écrans plus grands
• un OS de plus en plus riche et sophistiqué,
• un SDK de plus en plus vaste
cele
dev
Évolution des apps iOS• Des appareils mobiles de plus en plus
puissants, avec des écrans plus grands
• un OS de plus en plus riche et sophistiqué,
• un SDK de plus en plus vaste
UIKit DynamicsSprite Kit
Core Animation
Game Kit
Auto Layout
Text Kit
cele
dev
Évolution des apps iOS• Des appareils mobiles de plus en plus
puissants, avec des écrans plus grands
• un OS de plus en plus riche et sophistiqué,
• un SDK de plus en plus vaste
▶ une meilleure expérienceutilisateur (UX)
▶ des Apps plus complexes
▶ des développements plus longs
2013
2013
cele
dev
Outils de développement• Xcode est incontournable sur iOS / OS X
• un excellent et très puissant IDE
• mais son cycle de compilation / exécution reste traditionnel
1. Edit
2. Build
3. Load
4. Run
5. Setup
6. Test
7. D
ebug
cele
dev
La vision de celedev
• La Programmation Responsive
• interactivité maximale entre le développeur et son application
• bien plus que du live coding
1. Edit
2. Test
3. Debug
cele
dev
La vision de celedev
• La Programmation Responsive
• interactivité maximale entre le développeur et son application
• bien plus que du live coding
• Développer des apps iOS en mode responsive présente de multiples avantages
• rapidité de prototypage et de mise au point
• libère la créativité à travers l’expérimentation
• bien adaptée à la réalisation d’UX complexes
1. Edit
2. Test
3. Debug
cele
dev
Fonctionnalités• interactivité poussée entre l’IDE et l’application cible
• tous les éléments constituant l’application peuvent être mis à jour dynamiquement : code, mais aussi les ressources images, textes, …
• simplicité d’utilisation
• simplicité des APIs et performance de l’implémentation
• accès complet au SDK iOS
• connexion facile aux devices
• conçu pour s’intégrer très facilement avec le code C / Objective C et Xcode
▶ It just works.
cele
dev
Composantes du système
Application
Appareil cible
OS + SDK iOS
1. Env. d'exécution
2. Bindings iOS
SDK B
2. Bindings B
Code dynamique (Lua) Code compilé
Station de développement
OS X
3. Env. de développement 3.a. Éditeur de code Lua
3.c. Moniteur - Debugger
3.d. Gest. d’appareils
3.b. Gest. de ressources
cele
dev
Le choix de Lua• Un langage de script simple et léger
• créé en 1993 par une équipe de la PUC-Rio
• utilisé dans de nombreux domaines• jeux (WoW), web (Wikipedia), scripting (VLC), interface
utilisateur (Adobe Lightroom), embarqué (TI-Nspire), …
• avec de multiples qualités• une syntaxe simple, puissante et flexible
• une machine virtuelle performante et légère
• conçu pour être embarqué
• open sourcewww.lua.org
cele
dev
Lua : exemples de code-- defines a factorial functionfunction fact (n) if n == 0 then return 1 else return n * fact(n-1) endend
print (fact(10))
-- Tableslocal names = {"Peter", "Paul", "Mary"}local grades = {Mary = 10, Paul = 7, Peter = 8}
-- Embedded function and upvaluestable.sort(names, function (n1, n2) -- compare the grades return grades[n1] > grades[n2] end)
local list = nil
-- insert an element in the listfunction insert (v) list = {next = list, value = v}end
-- traverse the listlocal l = list while l do print(l.value) l = l.next end
cele
dev
Celedev + Lua: exemple de code
local UIView = require "UIKit.UIView"local NSText = require "UIKit.NSText"local UICollectionViewCell = objc.UICollectionViewCell
local Cell = class.createClass ("LabelCell", UICollectionViewCell)
local UIFont = objc.UIFontlocal UIColor = objc.UIColor
local function CGRectMake (x, y, width, height) return { x = x, y = y, width = width, height = height } end
function Cell:setAppearance (cellIndex, cellCount) -- ensure that params are not nil cellIndex, cellCount = cellIndex or 0, cellCount or 1 local contentView = self.contentView local contentSize = contentView:bounds().size -- Text label local label = self.label label.frame = CGRectMake(0, contentSize.height / 4, contentSize.width, contentSize.height / 2) label.font = UIFont:boldSystemFontOfSize (46.0) label.backgroundColor = UIColor.clearColor label.shadowColor = UIColor.darkGrayColor label.textColor = UIColor.whiteColorend
return cell
cele
dev
Intégration dans l’application- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{ // Create a Lua Context for this application _collectionLuaContext = [[CIMLuaContext alloc] initWithName:@"Collection Control"]; _collectionLuaContextMonitor = [[CIMLuaRemoteMonitor alloc] initWithLuaContext:_collectionLuaContext connectionTimeout:30]; // Create the application window self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; self.window.backgroundColor = [UIColor underPageBackgroundColor]; // Run the code for this Lua context [_collectionLuaContext loadLuaModuleNamed:@"CollectionControllerMain" withCompletionBlock:^(id result) { if ([result isKindOfClass:[UIViewController class]]) { self.window.rootViewController = result; } }]; [self.window makeKeyAndVisible]; return YES;}
cele
dev
Démo : live collections• Un exemple très simple, à
base de Collection Views
• écrite entièrement en Lua
• 3 classes
• view controller
• collection view cell
• collection view layout
• 2 gesture recognizers : pinch et rotation
cele
dev
Démo : live ressources
• Une app iPhone classique avec une liste et une vue détaillée
• Le navigation controller est créé par le MainWindow.xib
• Les autres view controllers sont écrit en Lua
• L’appli intègre des ressources images, plist et Interface Builder xib
cele
dev
En conclusion
• Disponible à la fin de l’année
• Recherche beta-testeurs !
• Pour rester informé
• www.celedev.com
• @celedev
Recommended