アプリを弄ってみる23.11.2011

Takahiro Yoshimura (@alterakey)

自己紹介

こんな人

埼玉で活動するアーキテクトです。

最近Androidが仕事になりかけてます…？

Twitterやってます→@alterakey

目標

タブレット描画アプリ

https://github.com/taky/effy

仕上げをやります。

仕上げ？

ガクガクなので…

ガビガビなので…

素材の準備

Eclipse＋SDK (r14～)

0.1.6のソースを使います。

http://bit.ly/tCS6td

素材の確認

Effyはビルドできますか？

始めましょう。

ハードウェア支援を使えるようにします。

手掛り

Android 3.0から追加された機能。GPUを活かして描画するようになります。

application/activityごとに指定するだけ

特段コーディングする必要なし！

方針

AndroidManifest.xml

...<uses-sdk android:minSdkVersion="8" /><application ... android:hardwareAccelerated="true"> <activity android:name="MainActivity"...

方針

project.properties

...# Project target.target=android-11

次は

線の平滑化をしましょう。

ガビガビの線を…

ところで…

線を書いているのはどこですか？

線がガビガビなのはなぜだと思いますか？

手掛り

線を書いているのはDrawActivity

DA.onTouchEvent: タッチされた点を保存

DA.plot: 点や線を描く

…？！

DrawActivity.java

private void plot(float x, float y){ ... canvas.drawLine(...); ...}

→直線を描いている！

ここで

FingerPaint

API Demosに含まれている描画アプリ

滑らかな線が描けている…だと…？

というわけで

研究だ！

samples/ android-X/ ApiDemos/ src/ com/example/android/apis/graphics/ FingerPaint.java

何が違うのか？

Path（曲線）クラスを描画に使っている→線が滑らかに！

private void touch_move(float x, float y) { ... if (dx >= TOUCH_TOLERANCE... ) { mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2); ... }}

何が違うのか？

アンチエイリアスが有効になっている→輪郭が滑らかに！！

@Overrideprotected void onCreate(Bundle savedInstanceState) { ... mPaint.setAntiAlias(true); ...}

何が違うのか？

描画方法がより直接的→より良い構造！！！

@Overridepublic boolean onTouchEvent(MotionEvent event) { ... case MotionEvent.ACTION_MOVE: ... invalidate();

何が違うのか？

ScribblerではActivityが直接タッチ→描画まで面倒を見ている

ActivityはActivityで、他にもやることが…

何が違うのか？

FingerPaintではタッチ→描画がViewレベルで分解されて独立している

タッチされるのも描かれるのもView

何が違うのか？

関連性の高い処理が集まっている

良い設計？

単一責任原則 (SRP)

「各クラス、責任はたった一つであるべし」

オブジェクト指向設計における重要な指針

責任だと？

クラスが自分で直接面倒を見ていること

「私は～をやります」

他のクラスを使って実現していることは含まない

責任

DrawActivityの責任はいくつありますか？

方針

曲線を使って直接描く

アンチエイリアスを有効に

方針

長いのでダウンロードして下さいhttp://bit.ly/rZFrWf

→ effy-0.1.6-draw2.zip

方針

展開して出た2つのファイルをsrc/ com.gmail.altakey.effy へコピーします。

確認しましょう

Effyをビルドして確認しましょう。

最後に

線の両端を丸くしてみましょう→今は角マーカーで引いたような線

手掛り

ペンの設定はまだDAで行なっている

Paintクラスがペンの実体

方針

DrawActivity.java

private void initialSetup(){ ... this.paint.setStrokeCap(Paint.Cap.ROUND); ...}

まとめ

高速化

ハードウェア支援の利用方法

直接描画する方が速い件

まとめ

線の平滑化

Pathを使って滑らかな曲線を描く

Paintで線の種類を指定する

まとめ

似たようなアプリは研究しよう

FingerPaintの方が構造が良かった件

単一責任原則

お疲れさまでした。

コードはgithubにあるので (GPL-3)、ガンガン研究してください！

他にもText Viewer (dawne)Lightboxdroid (lucene) …など。

余談

Android 3.1でメニューが出ない件について。

今回の高速化・平滑化の過程で、図らずも解決してしまいました！

ご静聴ありがとうございました。