Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Xebia WatchKit TechEvent
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Simone Civetta
December 03, 2014
Programming
180
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Xebia WatchKit TechEvent
Simone Civetta
December 03, 2014
More Decks by Simone Civetta
See All by Simone Civetta
2021: CI for Mobile: State of The Art
viteinfinite
0
410
MVI : une architecture robuste et moderne pour vos applications mobiles
viteinfinite
2
570
Cross-Platform Modules with Kotlin/Native (v. 2018.10)
viteinfinite
0
130
Face Recognition with Vision & Core ML
viteinfinite
1
1.1k
Shared Cross-Platform Modules with Kotlin/Native
viteinfinite
1
370
Server-Side Swift @ Devoxx FR
viteinfinite
0
140
Swift on the Raspberry PI
viteinfinite
0
160
Server-Side Swift
viteinfinite
0
110
Be the Quality You Want to See in Your App [Swift Edition]
viteinfinite
1
460
Other Decks in Programming
See All in Programming
動画プレイヤーはなぜカクつくのか 〜Flutterのレンダリングとネイティブの境界を解剖する〜
naruogram
0
110
作れる、でも消せるか?──安全に「枯らして消す」機能削除術 / Drain, Then Delete
chobishiba
2
1k
続・コーディングルールの鮮度を保ちたい / keep-fresh-go-internal-conventions-again
handlename
0
130
PumaからFalconに移行したRailsアプリケーションでの実践
falcon8823
0
250
Groovy as a human and AI friendly programming language
paulk
0
120
コードで差別化できない時代の ソフトウェアエンジニアリング / Software Engineering in an Era Where Code Doesn’t Differentiate
kishida
2
200
コーディング自動化の次へ。人の介入をゼロにするファクトリーとサポートAIによる実践
timakin
5
4.7k
AI-Powered Domain-Driven Design
ziobrando
0
320
sbt 2.0: takeoff
eed3si9n
0
170
個人開発者よ、Honoを使え(おじさんver)
tanahiro2010
2
280
Atomic Design, Enforced: Scaling Mobile Design Systems (next.app devCon / droidCon Berlin 2026)
steliosf
PRO
0
180
S3 TablesのIcebergデータに、AIエージェントからアクセスしてみた / 20261016developersio2026joetsu-accessing-iceberg-in-s3tables-via-agent
kasacchiful
PRO
0
210
Featured
See All Featured
XXLCSS - How to scale CSS and keep your sanity
sugarenia
250
1.3M
It's Worth the Effort
3n
188
29k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.8k
Paper Plane (Part 1)
katiecoart
PRO
2
12k
[Rails World 2026] Durable orchestration on Rails: from continuation to workflow
palkan
1
900
Odyssey Design
rkendrick25
PRO
2
890
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
50
10k
The Illustrated Children's Guide to Kubernetes
chrisshort
51
53k
Believing is Seeing
oripsolob
1
250
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
4
4.4k
Code Reviewing Like a Champion
maltzj
529
40k
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
1
290
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 !