Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Xebia WatchKit TechEvent
Search
Simone Civetta
December 03, 2014
Programming
0
170
Xebia WatchKit TechEvent
Simone Civetta
December 03, 2014
Tweet
Share
More Decks by Simone Civetta
See All by Simone Civetta
2021: CI for Mobile: State of The Art
viteinfinite
0
370
MVI : une architecture robuste et moderne pour vos applications mobiles
viteinfinite
2
520
Cross-Platform Modules with Kotlin/Native (v. 2018.10)
viteinfinite
0
88
Face Recognition with Vision & Core ML
viteinfinite
1
1k
Shared Cross-Platform Modules with Kotlin/Native
viteinfinite
1
290
Server-Side Swift @ Devoxx FR
viteinfinite
0
93
Swift on the Raspberry PI
viteinfinite
0
110
Server-Side Swift
viteinfinite
0
73
Be the Quality You Want to See in Your App [Swift Edition]
viteinfinite
1
420
Other Decks in Programming
See All in Programming
monorepo の Go テストをはやくした〜い!~最小の依存解決への道のり~ / faster-testing-of-monorepos
convto
2
490
そのpreloadは必要?見過ごされたpreloadが技術的負債として爆発した日
mugitti9
2
3.4k
Introducing ReActionView: A new ActionView-Compatible ERB Engine @ Kaigi on Rails 2025, Tokyo, Japan
marcoroth
3
1k
ALL CODE BASE ARE BELONG TO STUDY
uzulla
19
4.7k
株式会社 Sun terras カンパニーデック
sunterras
0
310
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
910
バッチ処理を「状態の記録」から「事実の記録」へ
panda728
PRO
0
160
あなたとKaigi on Rails / Kaigi on Rails + You
shimoju
0
160
育てるアーキテクチャ:戦い抜くPythonマイクロサービスの設計と進化戦略
fujidomoe
1
170
TFLintカスタムプラグインで始める Terraformコード品質管理
bells17
2
170
私はどうやって技術力を上げたのか
yusukebe
43
18k
Go言語の特性を活かした公式MCP SDKの設計
hond0413
1
230
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
303
21k
Building a Scalable Design System with Sketch
lauravandoore
463
33k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
A Tale of Four Properties
chriscoyier
161
23k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
115
20k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
53k
The Cost Of JavaScript in 2023
addyosmani
55
9k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.6k
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.7k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Transcript
None
Développeurs ?
Watch
Le produit
None
Modèles —Sport (349$) —Classic —Edition Versions, 2 tailles : —42mm
(312x390px ~335ppi) —38mm (272x340px ~335ppi)
Personnalisation
OS
Apple Watch et iOS Compatible uniquement avec iOS 8.2+
Interface
Interface —1 couronne (digital crown) —sélection —zoom in/out —1 bouton
physique (conversation button) —favoris — Pay
Interface —Siri
Interface —Feedback haptique
Interface graphique
Interface graphique —Home screen —Glances —Applications
Home screen
Glances
Capteurs —Accéleromètre —Gyroscope —GPS —Moniteur cardiaque
Pay
Batterie —~1 jour environ —rechargement avec connecteur magnétique
Date de sortie —Printemps 2015 —(St Valentin ?)
None
Le SDK —Première release le 18 nov. 2014 —Deuxième version
en mi-2015 (WWDC ?)
Les fonctionnalités —Gérer notifications —Écrans glances —Applications non natives1 1
La logique est exécutée sur l'iPhone
Les fonctionnalités / 2 —Applications natives en V2
WatchKit en détail
Aujourd'hui... Une application WatchKit est : —une extension d'une application
iPhone —un écran secondaire
Pour commencer : glossaire —Watch App : executé sur la
montre —Extension : executé sur iPhone
Extensions iOS
Extension iOS / 1
Extension iOS / 2 —L'extension est un applicatif indépendant contenu
dans le bundle d'un .app iOS
Architecture
Architecture / 1 —La Watch App est lancée depuis un
bundle contenant storyboard et ressources statiques
Architecture / 2 —L'interaction de l'utilisateur déclenche l'exécution de code
dans l'extension
None
Interface utilisateur
Interface utilisateur / 1 —L'interface est réalisable seulement via Storyboard
—L'IHM est installée dans la Watch App
Interface utilisateur / 2 —Les Scenes du Storyboard ne peuvent
pas être modifiées par l'extension iPhone à runtime —L'extension peut afficher/cacher des éléments à l'intérieur de la Watch App
Les composants
Les composants / 1 —Les composants WatchKit (buttons, labels, etc)
sont proxifiés —L'extension manipule un objet proxy (WKInterface*) —Il n'est pas possible de créer programmatiquement des éléments visuels
Les composants / 2 —Une extension peut contrôler : —Taille
(Height/Width) —Alpha —Visibilité (propriété hidden) —Hidden = Gone
Les composants / 3 —WKInterfaceController —WKInterfaceGroup —WKInterfaceTable —WKInterfaceButton —WKInterfaceDate —WKInterfaceImage
—WKInterfaceLabel —WKInterfaceMap —WKInterfaceSeparator —WKInterfaceSlider
Les composants / 3 —WKInterfaceController —WKInterfaceGroup —WKInterfaceTable —WKInterfaceButton —WKInterfaceDate —WKInterfaceImage
—WKInterfaceLabel —WKInterfaceMap —WKInterfaceSeparator —WKInterfaceSlider
WKInterfaceController —Équivalent de UIViewController —Un controlleur par écran —Target/Action pattern
—Peu modulaire —Context-based
WKInterfaceController Context —init(context context: AnyObject!) — contextForSegueWithIdentifier(_ :) —pushControllerWithName(_ name:
String!, context context: AnyObject!)
Cycle de vie —WA : Create Storyboard —E : initWithContext:
—E : willActivate —E : action methods —E : didDeactivate
None
WKInterfaceGroup —cf. Layout sur Android —Horizontaux/Verticaux —Taille paramétrable, qui peut
dépendre du contenu/conteneur —Fit content —Relative to container
WKInterfaceTable —Similaires aux tableaux de iOS —Pas de sections /
footers / headers
WKInterfaceTable —Chaque row est associée à un type de row
(rowType) —Chaque rowType est associé à un controller —setNumberOfRows(_:withRowType:) —setRowTypes(_ rowTypes: [AnyObject]!) —table(_ table: WKInterfaceTable!, didSelectRowAtIndex rowIndex:
WKInterfaceTable Toutes les méthodes de délégation de la Table sont
déclarées dans le Controller
None
WKInterfaceMap —Plan statique qui peut contenir max 5. annotations —Dessiné
par l'extension et envoyé ensuite à la Watch App
WKInterfaceDate —Libellé de date avec format paramétrable —La valeur est
calculée directement par la Watch App
Navigation
Navigation —Pop/Push (cf. UINavigationController) —Page-based —Présentation modale
Navigation techniques —Segues —pushControllerWithName(_ name: String!, context context: AnyObject!) —
presentControllerWithName(_:con text:) — presentControllerWithNames(_:co ntexts:)
Notes
Glances —Un écran Glance est une micro- application mono-page —Il
est le launcher d'une application Watch App
Storyboard —Le storyboard est l'outil de définition de l'interface utilisateur
d'une Watch App
Tips 'n Tricks —Utilisez les frameworks dynamiques —Modifiez les propriétés
des Schemes —Activez le mode "External display -> Apple Watch" dans le menu du simulateur
Hands on !