core graphics on watchos 2
Post on 07-Aug-2015
6.285 Views
Preview:
TRANSCRIPT
• iOS専業フリーランス
• ブログ『Over&Out その後』
• 著書
- 『iOS×BLE Core Bluetoothプログラミング』
- 『iOSアプリ開発 達人のレシピ100』
堤 修一
お手伝いしたプロダクト(Watch関連)
よしだっち(DLE)
鷹の爪団の吉田君を育成するアプリ
WatchMe(Pocket Supernova) Watch に最適化されたビデオメッセージングアプリ。ウォッチで動画メッセージのプレビュー、素早い返信ができる
※お手伝いしたのは開発の初期、ウォッチ側
メール、Facebookメッセージ、TwitterのDM等を一元管理するアプリ
Swingmail(BHI)
※ウォッチ機能は現在開発中
API Diffs から見る iOS 9 の新機能
• 基調講演やニュース記事を見るだけではわからない、iOS 9
の細かい新機能を「API Diffs」「What’s new」から抜粋
• http://d.hatena.ne.jp/shu223/20150609/1433813938
watchOS-2-Sampler• watchOS 2 の新機能のサンプルコード集
- Accelerometer - Gyroscope - Pedometer - Heart Rate - Table Animations - Animated Properties - Audio Rec & Play - Picker Styles - Taptic Engine - Alert - Animation with Digital Crown - Interactive Messaging - Open System URL - Audio File Player
• GitHub で公開中
- github.com/shu223/watchOS-2-Sampler
• 紹介記事
- d.hatena.ne.jp/shu223/20150614/1434313771
watchOS 2 新機能の細かい話5つ• watchOS-2-Sampler 実装にあたって気付いた細かい諸々について
- 2つのアセットカタログの 使い分け
- メディアデータの 保存場所
- WKAudioFilePlayer
- ウォッチ側 Bluetooth の (直接)利用
- Watch Connectivity のメッセージ送信可否の条件
• 『potatotips #18』での発表
• slideshare.net/t26v0748/uiux-watchos-2-3
• d.hatena.ne.jp/shu223/20150616/1434454680
UI/UX に影響の大きい watchOS 2 の新機能
• watchOS 2 の数ある新機能の中で、UI/UX に影響の大きそうな機能を3
つ抜粋して紹介
• 『UI Crunch #5』というデザイナーさん、ディレクターさんも来る勉強会での発表
- (なのでコードは出てきません)
• http://www.slideshare.net/t26v0748/uiux-watchos-2-3
Core Image の新機能
• iOS 9 の Core Image の新機能について紹介&デモ
- 文字認識
- 新フィルタ47種
• @『WWDC Afterparty Roppongi』
• slideshare.net/t26v0748/ios-9-core-image
• d.hatena.ne.jp/shu223/20150622/1434924215
Audio Unit Extensions~オーディオエフェクトのアプリ間共有~
• iOS 9 で追加された Extension Point
• Audio Unit をアプリ間で共有できる
• @『WWDC2015報告共有会@ネクスト』
• www.slideshare.net/t26v0748/wwdc-next-201506232
• d.hatena.ne.jp/shu223/20150624/1435098847
watchOS 1 をふりかえる• Core Graphics は使えなかった
• Apple公式サンプルでは、360
個の連番pngを利用して
Circular Progress 的なUIを実現
『WatchKitを実際にさわってみてわかったこと』
@watchOS 2• Core Graphics がネイティブSDKに追加された
• Apple のWWDC動画やサンプル、GitHub・StackOverflow にも具体的なコードは見当たらず
• 何ができて、何ができないのか? 試してみる
Trial1 : Draw a line
実行結果:<Error>: CGContextDrawPath: invalid context 0x0.
→watchOS では、UIGraphicsGetCurrentContext() でグラフィックスコンテキストを取得できない?
Trial4: Draw from a SVG file
※ SVG to UIBezierPath の変換にはOSS『PocketSVG』を利用
※NDAに配慮しスクリーンショットは会場のみとします
watchOS-2-Sampler
GitHub: shu223/watchOS-2-Sampler
Blog: watchOS 2 の新機能のサンプルコード集『watchOS-2-Sampler』
watchOS 2 新機能のサンプルコード集 - Accelerometer - Gyroscope - Pedometer - Heart Rate - Table Animations - Animated Properties - Draw Paths - Gradations - Audio Rec & Play - Picker Styles - Taptic Engine - Alert - Animation with Digital Crown - Interactive Messaging - Open System URL - Audio File Player
今回のサンプル
UIView とか CALayer に依存する処理は不可
例: スクリーンキャプチャ
UIView または CALayer オブジェクトの内容を描画する必要があるため watchOS では(いまのところ)利用不可
キーパスアニメーションも不可• CAKeyframeAnimation を使うと、パスに沿ってオブジェクトをアニメーションさせるとか、生成したパス自体をアニメーションさせたりできる
• こういうの →をやりたいときには必要
キーパスアニメーションも不可• CAKeyframeAnimation を使うと、パスに沿ってオブジェクトをアニメーションさせるとか、生成したパス自体をアニメーションさせたりできる
• こういうの →をやりたいときには必要
• CALayer オブジェクトにアクセスできないので、addAnimation: できない。
キーパスアニメーションも不可• CAKeyframeAnimation を使うと、パスに沿ってオブジェクトをアニメーションさせるとか、生成したパス自体をアニメーションさせたりできる
• こういうの →をやりたいときには必要
• CALayer オブジェクトにアクセスできないので、addAnimation: できない。
• すなわち現状では不可
まとめ• watchOS 2 から Core Graphics を用いた動的な描画が可能になった
• ビットマップコンテキスト上に描画し、UIImage を生成してそれを表示する
• この制約の範囲内であれば、結構いろんなことができる
top related