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
Physics-Based Interfaces with UIKit Dynamics
Search
Sam Kirchmeier
March 20, 2014
Technology
0
110
Physics-Based Interfaces with UIKit Dynamics
Sam Kirchmeier
March 20, 2014
Tweet
Share
More Decks by Sam Kirchmeier
See All by Sam Kirchmeier
Exploring Stateless UIs in Swift
skirchmeier
2
570
Beyond REST: Web Services Designed for Mobile
skirchmeier
2
120
Auto Layout in iOS
skirchmeier
3
140
Bluetooth LE, Core Bluetooth, and a Glimpse Into Your Near Future
skirchmeier
0
260
Building HTML5 Tablet Apps
skirchmeier
2
500
iOS Training Part 2
skirchmeier
1
200
Custom iOS Controls
skirchmeier
3
180
Other Decks in Technology
See All in Technology
PL900試験から学ぶ Power Platform 基礎知識講座
kumikeyy
0
120
Googleマップ/Earthが一般化した 地図タイルのイマ
mapconcierge4agu
1
200
Cloud Spanner 導入で実現した快適な開発と運用について
colopl
1
320
Amazon S3 Tablesと外部分析基盤連携について / Amazon S3 Tables and External Data Analytics Platform
nttcom
0
120
OpenID BizDay#17 KYC WG活動報告(法人) / 20250219-BizDay17-KYC-legalidentity
oidfj
0
140
明日からできる!技術的負債の返済を加速するための実践ガイド~『ホットペッパービューティー』の事例をもとに~
recruitengineers
PRO
3
290
TAMとre:Capセキュリティ編 〜拡張脅威検出デモを添えて〜
fujiihda
1
180
オブザーバビリティの観点でみるAWS / AWS from observability perspective
ymotongpoo
8
1.3k
ホワイトボードチャレンジ 説明&実行資料
ichimichi
0
120
OpenID Connect for Identity Assurance の概要と翻訳版のご紹介 / 20250219-BizDay17-OIDC4IDA-Intro
oidfj
0
160
SA Night #2 FinatextのSA思想/SA Night #2 Finatext session
satoshiimai
1
130
現場の種を事業の芽にする - エンジニア主導のイノベーションを事業戦略に装着する方法 -
kzkmaeda
2
1.8k
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Git: the NoSQL Database
bkeepers
PRO
427
64k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
240
Large-scale JavaScript Application Architecture
addyosmani
510
110k
Facilitating Awesome Meetings
lara
51
6.2k
Bootstrapping a Software Product
garrettdimon
PRO
306
110k
The Invisible Side of Design
smashingmag
299
50k
Optimising Largest Contentful Paint
csswizardry
34
3.1k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
Thoughts on Productivity
jonyablonski
69
4.5k
Transcript
Physics-Based Interfaces with UIKit Dynamics Adam May @yammada ! Sam
Kirchmeier @skirchmeier
None
None
Agenda
Introduction ! ! !
Introduction Examples ! !
Introduction Examples Deconstruction !
Introduction Examples Deconstruction Collection Views
! Examples Deconstruction Collection Views Limitations & Gotchas Introduction
Introduction
Introduced with iOS 7 Not a separate framework – built
into UIKit Can be anywhere you're using UIKit
Another tool in your tool belt
Physics-Based Interfaces
Classical Mechanics
Classical mechanics is concerned with the set of physical laws
describing the motion of bodies under the action of a system of forces.
2014
2014 2007
None
None
None
None
2014 2007
2014 2007 1972
None
Pong: the original physics-based interface.
More Recent Examples
None
None
None
None
None
None
None
None
None
None
None
None
UIKit Dynamics
Natural, real-world interactions Without very much code Beautiful API Fun
Knowledge of physics not required
UIView
UIView UIDynamicAnimator Reference View
UIView UIDynamicAnimator Reference View UIGravityBehavior
UIView UIDynamicAnimator Reference View UIGravityBehavior UICollisionBehavior
None
UIDynamicItem Protocol !
UIDynamicItem Protocol UIView UICollectionViewLayoutAttributes
UIDynamicBehaviors
UIDynamicBehavior Base Class
UICollisionBehavior UIGravityBehavior ! ! !
UICollisionBehavior UIGravityBehavior UIAttachmentBehavior UIDynamicItemBehavior UIPushBehavior UISnapBehavior
Demo
Deconstruction
None
None
UICollisionBehavior UIGravityBehavior UIAttachmentBehavior UIDynamicItemBehavior UIPushBehavior UISnapBehavior
1. Create a UIDynamicAnimator. 2. Recognize a touch, and add
an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
1. Create a UIDynamicAnimator. 2. Recognize a touch, and add
an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
1. Create a UIDynamicAnimator. 2. Recognize a touch, and add
an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
1. Create a UIDynamicAnimator. 2. Recognize a touch, and add
an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
Demo
Collection Views
Gotchas
Only 2D Hard to visualize Weird units Everything’s a square
Not perfect for games
Recap
Introduced UIKit Dynamics PhotoFling Demo TweetBattle Demo Limitations & Gotchas
Thanks!
Discussion https://github.com/livefront/dynamics Adam May @yammada ! Sam Kirchmeier @skirchmeier