Android 外部メディア (外部ストレージ, SD card) の場所を取得する

Android の外部メディア（ = ほぼ SDCard のこと）にある
ファイルを指定するときに

"/sdcard/hoge.png"

とか書いてはいけません！
端末によってはパスが /sdcard/ じゃなかったりするからです。
（確かどっかのタブレットかなんかがそうだった）
それに、PCにマウントされてたり、端末に入ってなかったり
したらアクセスできません。

なので、ハードコーディングはやめましょう。

外部メディアにアクセスできるかどうかは getExternalStorageState()
でわかります。
＃でもここで、「注：この呼び出しは、複数のボリュームをサポートしていないため、廃止する必要があります。」って書いてあるけど代替方法が載ってないのよね。。。


外部メディアのパスは Environment の getExternalStorageDirectory() を使えば OK です。

view plainprint?

1. // get file state  
2. String status   = Environment.getExternalStorageState();  
3. // get file path  
4. String filepath = Environment.getExternalStorageDirectory().toString() + "/myapp/hoge.png";  
5.   
6. if (!status.equals(Environment.MEDIA_MOUNTED)) {  
7.   // media is not mounted  
8. } else  if (!(new File(filepath)).exists()) {  
9.   // file does not exists  
10. }  

// get file state
String status   = Environment.getExternalStorageState();
// get file path
String filepath = Environment.getExternalStorageDirectory().toString() + "/myapp/hoge.png";

if (!status.equals(Environment.MEDIA_MOUNTED)) {
  // media is not mounted
} else  if (!(new File(filepath)).exists()) {
  // file does not exists
}

ここで注意ですが、

この top-level directory (= "/sdcard/" とかの直下)を直接
使うのは避けましょう。
なぜなら、ユーザの root namespace を汚染してしまうからです。

つまり、"/sdcard/" の下に直接ファイルを置いてはいけません。
これを避ける方法としていくつかあります。

1. Context.getExternalFilesDir(String)

　　これは、API Level 8 から使えるようになった関数で、
　　アプリ用のファイルを置くためのディレクトリを返してくれます。
　　このディレクトリ内に置いたファイルはアプリのアンインストール時に
　　削除されます。
　　通常、メディアとしてユーザーに表示されませんが、セキュリティが
　　かかっているわけではないので、他のアプリからこのディレクトリに
　　読み書きすることは可能です。

2. getExternalStoragePublicDirectory (String type)

　　これも、API Level 8 から使えるようになった関数で、
　　public なディレクトリを返してくれます。
　　例えば、

　 File path = Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DCIM);

　　とすると、カメラで撮った写真のあるディレクトリを取得できます。

Android Android Market の評価の内訳がでるようになったよ

たぶん今日(日本時間で8/31）から、Android Developer Console
に Android Market での評価（5段階のスター）の内訳が表示
されるようになってました。

ふむふむ。

↓右側にでてる

Android端末のハード徹底比較表

めもめも

　・android hardware comparison chart Android mobile phones 2010

　・android hardware comparison chart Android mobile phones 2009

　
　

Android 「The world of ListView」 - List selectors -

Google I/O の 「The world of ListView」というセッションを見たので
そのまとめ。

長いので、項目ごとに分けました。
今回は 「List selectors」

--------------------------------------

Google I/O の「The world of ListView」のページは こちら

セッションのスライドはこちら

　agenda

　　• Virtualization and adapters

　　• Item properties

　　• Headers and footers

　　• List selectors

　　• Other features

　　• Gotchas and don'ts


--------------------------------------

■ List selectors

　• 選択中のアイテムをハイライト
　• タッチモードでは表示されない
　　　– タッチモードには選択中がない!
　• リスト要素の背後に表示
　　　– android:drawSelectorOnTop="true" にすると前に表示される

view plainprint?

1. <selector>  
2.   <item android:state_window_focused="false"  
3.     android:drawable="@color/transparent" />  
4.   
5.   <item android:state_focused="true" android:state_enabled="false"  
6.     android:state_pressed="true"  
7.     android:drawable="@drawable/list_selector_background_disabled" />  
8.   
9.   <item android:state_focused="true" android:state_enabled="false"  
10.     android:drawable="@drawable/list_selector_background_disabled" />  
11.   
12.   <item android:state_focused="true" android:state_pressed="true"  
13.     android:drawable="@drawable/list_selector_background_transition" />  
14.   
15.   <item android:state_focused="false" android:state_pressed="true"  
16.     android:drawable="@drawable/list_selector_background_transition" />  
17.   
18.   <item android:state_focused="true"  
19.     android:drawable="@drawable/list_selector_background_focus" />  
20. </selector>  

<selector>
  <item android:state_window_focused="false"
    android:drawable="@color/transparent" />

  <item android:state_focused="true" android:state_enabled="false"
    android:state_pressed="true"
    android:drawable="@drawable/list_selector_background_disabled" />

  <item android:state_focused="true" android:state_enabled="false"
    android:drawable="@drawable/list_selector_background_disabled" />

  <item android:state_focused="true" android:state_pressed="true"
    android:drawable="@drawable/list_selector_background_transition" />

  <item android:state_focused="false" android:state_pressed="true"
    android:drawable="@drawable/list_selector_background_transition" />

  <item android:state_focused="true"
    android:drawable="@drawable/list_selector_background_focus" />
</selector>

　要素（項目）が不透明な場合は、selector drawable を使う
　　– convertView.setBackground(R.drawable.selector)

view plainprint?

1. <selector>  
2.   <item android:state_selected="true"  
3.     android:drawable="@color/transparent" />  
4.   
5.   <item android:state_selected="false"  
6.     android:drawable="#ff00ff00" />  
7. <selector/>  

<selector>
  <item android:state_selected="true"
    android:drawable="@color/transparent" />

  <item android:state_selected="false"
    android:drawable="#ff00ff00" />
<selector/>

Android Get color of status bar

くごーさんがステータスバーの色を取得したいと言うので
がんばってみました。

　Xperia X10 のステータスバーは濃い青




　ステータスバーのレイアウトを指定している xml がこれです。

　frameworks/base/core/res/res/layout/status_bar.xml

　これを見ると、

view plainprint?

1. <com.android.server.status.StatusBarView xmlns:android="http://schemas.android.com/apk/res/android"   
2.     android:background="@drawable/statusbar_background"  
3.     android:orientation="vertical"  
4.     android:focusable="true"  
5.     android:descendantFocusability="afterDescendants"  
6.     >  
7.     <LinearLayout android:id="@+id/icons"  
8.         android:layout_width="fill_parent"  
9.         android:layout_height="fill_parent"  
10.         android:orientation="horizontal">  
11.               
12.         <com.android.server.status.IconMerger android:id="@+id/notificationIcons"  
13.             android:layout_width="0dip"  
14.             ...  
15.          />  
16.     </LinearLayout>  
17. </com.android.server.status.StatusBarView>  

<com.android.server.status.StatusBarView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:background="@drawable/statusbar_background"
    android:orientation="vertical"
    android:focusable="true"
    android:descendantFocusability="afterDescendants"
    >
    <LinearLayout android:id="@+id/icons"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal">
            
        <com.android.server.status.IconMerger android:id="@+id/notificationIcons"
            android:layout_width="0dip"
            ...
         />
    </LinearLayout>
</com.android.server.status.StatusBarView>

　com.android.server.status.StatusBarView というカスタムビューを
　使っています。
　ここで、背景画像を設定しています。
　　android:background="@drawable/statusbar_background"　

　ちなみにこの画像は Android Open Source Project のここ
　で見られます。

　こんなやつ


　com.android.server.status.StatusBarView を生成しているのが、
　com.android.server.status.StatusBarService です。

　こいつ
　frameworks/base/services/java/com/android/server/status/StatusBarService.java

　StatusBarService.java はこことかでみられます。
　StatusBarView.java はこのへんで。


　この StatusBarService は変数として、StatusBarView
　(mStatusBarView)を保持しています。

view plainprint?

1. public class StatusBarService extends IStatusBar.Stub  
2. {  
3.     ...  
4.   
5.     final Context mContext;  
6.     final Display mDisplay;  
7.     StatusBarView mStatusBarView;  
8.   
9.     ...  
10.   
11.     /** 
12.      * Construct the service, add the status bar view to the window manager 
13.      */  
14.     public StatusBarService(Context context) {  
15.         mContext = context;  
16.         mDisplay = ((WindowManager)context.getSystemService(  
17.                 Context.WINDOW_SERVICE)).getDefaultDisplay();  
18.         makeStatusBarView(context);  
19.         mUninstallReceiver = new UninstallReceiver();  
20.     }  
21.   
22.     ....  
23.   
24.     // ================================================================================  
25.     // Constructing the view  
26.     // ================================================================================  
27.     private void makeStatusBarView(Context context) {  
28.         Resources res = context.getResources();  
29.         mRightIconSlots = res.getStringArray(com.android.internal.R.array.status_bar_icon_order);  
30.         mRightIcons = new StatusBarIcon[mRightIconSlots.length];  
31.   
32.         ExpandedView expanded = (ExpandedView)View.inflate(context,  
33.                 com.android.internal.R.layout.status_bar_expanded, null);  
34.         expanded.mService = this;  
35.         StatusBarView sb = (StatusBarView)View.inflate(context,  
36.                 com.android.internal.R.layout.status_bar, null);  
37.         sb.mService = this;  
38.   
39.         // figure out which pixel-format to use for the status bar.  
40.         mPixelFormat = PixelFormat.TRANSLUCENT;  
41.         Drawable bg = sb.getBackground();  
42.         if (bg != null) {  
43.             mPixelFormat = bg.getOpacity();  
44.         }  
45.   
46.         mStatusBarView = sb;  
47.   
48.         ...  

public class StatusBarService extends IStatusBar.Stub
{
    ...

    final Context mContext;
    final Display mDisplay;
    StatusBarView mStatusBarView;

    ...

    /**
     * Construct the service, add the status bar view to the window manager
     */
    public StatusBarService(Context context) {
        mContext = context;
        mDisplay = ((WindowManager)context.getSystemService(
                Context.WINDOW_SERVICE)).getDefaultDisplay();
        makeStatusBarView(context);
        mUninstallReceiver = new UninstallReceiver();
    }

    ....

    // ================================================================================
    // Constructing the view
    // ================================================================================
    private void makeStatusBarView(Context context) {
        Resources res = context.getResources();
        mRightIconSlots = res.getStringArray(com.android.internal.R.array.status_bar_icon_order);
        mRightIcons = new StatusBarIcon[mRightIconSlots.length];

        ExpandedView expanded = (ExpandedView)View.inflate(context,
                com.android.internal.R.layout.status_bar_expanded, null);
        expanded.mService = this;
        StatusBarView sb = (StatusBarView)View.inflate(context,
                com.android.internal.R.layout.status_bar, null);
        sb.mService = this;

        // figure out which pixel-format to use for the status bar.
        mPixelFormat = PixelFormat.TRANSLUCENT;
        Drawable bg = sb.getBackground();
        if (bg != null) {
            mPixelFormat = bg.getOpacity();
        }

        mStatusBarView = sb;

        ...

　つまり、この mStatusBarView を取得して getBackground すれば
　背景画像がとれちゃうわけです。

　今回もリフレクションしますw

　　＊注！　この方法は Reflection で内部クラスを使っているので、SDKのアップデートなどで使えなくなる可能性があります。

　ステータスバーの背景画像を取得する

view plainprint?

1. private Drawable getStatusBarBackground() {  
2.        
3.     try {  
4.         ClassLoader cl = getClassLoader();  
5.         Class<!----> clazz;  
6.         clazz = cl.loadClass("com.android.server.status.StatusBarService");  
7.         Constructor<!----> constructor = clazz.getConstructor(Context.class);  
8.         Object obj = constructor.newInstance(this);  
9.         Class<!----> c = obj.getClass();  
10.         Field field;  
11.         //field = c.getDeclaredField("com.android.server.status.StatusBarService.mStatusBarView");  
12.         field = c.getDeclaredField("mStatusBarView");  
13.   
14.         if(!field.isAccessible()) {  
15.             field.setAccessible(true);  
16.         }  
17.         ViewGroup vg = (ViewGroup) field.get(obj);  
18.         Drawable d = vg.getBackground();  
19.         return d;  
20.   
21.     } catch (ClassNotFoundException e) {  
22.         e.printStackTrace();  
23.         return null;  
24.     } catch (SecurityException e) {  
25.         e.printStackTrace();  
26.         return null;  
27.     } catch (NoSuchMethodException e) {  
28.         e.printStackTrace();  
29.         return null;  
30.     } catch (IllegalArgumentException e) {  
31.         e.printStackTrace();  
32.         return null;  
33.     } catch (InstantiationException e) {  
34.         e.printStackTrace();  
35.         return null;  
36.     } catch (IllegalAccessException e) {  
37.         e.printStackTrace();  
38.         return null;  
39.     } catch (InvocationTargetException e) {  
40.         e.printStackTrace();  
41.         return null;  
42.     } catch (NoSuchFieldException e) {  
43.         e.printStackTrace();  
44.         return null;  
45.     }  
46. }  

private Drawable getStatusBarBackground() {
     
    try {
        ClassLoader cl = getClassLoader();
        Class clazz;
        clazz = cl.loadClass("com.android.server.status.StatusBarService");
        Constructor constructor = clazz.getConstructor(Context.class);
        Object obj = constructor.newInstance(this);
        Class c = obj.getClass();
        Field field;
        //field = c.getDeclaredField("com.android.server.status.StatusBarService.mStatusBarView");
        field = c.getDeclaredField("mStatusBarView");

        if(!field.isAccessible()) {
            field.setAccessible(true);
        }
        ViewGroup vg = (ViewGroup) field.get(obj);
        Drawable d = vg.getBackground();
        return d;

    } catch (ClassNotFoundException e) {
        e.printStackTrace();
        return null;
    } catch (SecurityException e) {
        e.printStackTrace();
        return null;
    } catch (NoSuchMethodException e) {
        e.printStackTrace();
        return null;
    } catch (IllegalArgumentException e) {
        e.printStackTrace();
        return null;
    } catch (InstantiationException e) {
        e.printStackTrace();
        return null;
    } catch (IllegalAccessException e) {
        e.printStackTrace();
        return null;
    } catch (InvocationTargetException e) {
        e.printStackTrace();
        return null;
    } catch (NoSuchFieldException e) {
        e.printStackTrace();
        return null;
    }
}

　注： AndroidManifest.xml に
<uses-permission android:name="android.permission.EXPAND_STATUS_BAR" />
　を入れないと、Homeキーを押したときに落ちます

　おまけ：

　　取得した Drawable は BitmapDrawable ではなく、
　　NinePatchDrawable です。
　　なので、
　　　"Bitmap, Drawableに変換 - hyoromoの日記"
　　の方法では、Bitmap に変換できませんでした。

　　そこで一回ImageViewに突っ込んでから、DrawingCache で Bitmap を
　　取得しました。

view plainprint?

1. @Override  
2. public void onCreate(Bundle savedInstanceState) {  
3.     super.onCreate(savedInstanceState);  
4.     setContentView(R.layout.main);  
5.           
6.     Drawable d = getStatusBarBackground();  
7.           
8.     if(d != null) {  
9.         ImageView iv = ((ImageView)findViewById(R.id.imageview));  
10.         iv.setImageDrawable(d);  
11.     }  
12. }  
13.       
14. @Override  
15. public void onWindowFocusChanged(boolean hasFocus) {  
16.     super.onWindowFocusChanged(hasFocus);  
17.     ImageView iv = (ImageView)findViewById(R.id.imageview);  
18.   
19.     iv.setDrawingCacheEnabled(true);  
20.     iv.buildDrawingCache();  
21.     Bitmap b = iv.getDrawingCache();  
22.     if(b != null) {  
23.         int x = b.getWidth() / 2;  
24.         int y = b.getHeight() / 2;  
25.         int c = b.getPixel(x, y);  
26.         ((TextView)findViewById(R.id.textview)).setText("  
27.             "alpha: " + Color.alpha(c) +   
28.             "  red: " + Color.red(c) +   
29.             "  green: " + Color.green(c) +   
30.             "  blue: " + Color.blue(c));  
31.     }  
32.     else {  
33.         ((TextView)findViewById(R.id.textview)).setText("no drawing cache");         
34.     }  
35. }  

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
        
    Drawable d = getStatusBarBackground();
        
    if(d != null) {
        ImageView iv = ((ImageView)findViewById(R.id.imageview));
        iv.setImageDrawable(d);
    }
}
    
@Override
public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    ImageView iv = (ImageView)findViewById(R.id.imageview);

    iv.setDrawingCacheEnabled(true);
    iv.buildDrawingCache();
    Bitmap b = iv.getDrawingCache();
    if(b != null) {
        int x = b.getWidth() / 2;
        int y = b.getHeight() / 2;
        int c = b.getPixel(x, y);
        ((TextView)findViewById(R.id.textview)).setText("
            "alpha: " + Color.alpha(c) + 
            "  red: " + Color.red(c) + 
            "  green: " + Color.green(c) + 
            "  blue: " + Color.blue(c));
    }
    else {
        ((TextView)findViewById(R.id.textview)).setText("no drawing cache");       
    }
}

　　かっとなって、アプリを公開しちゃいました。

　　GetStatusBarColor AndroidOnly → http://goo.gl/WT24

　標準だと灰色なんだけど



　HTC Hero は黒でした。

Android 「The world of ListView」 - Headers and footers -

Google I/O の 「The world of ListView」というセッションを見たので
そのまとめ。

長いので、項目ごとに分けました。
今回は 「Headers and footers」

--------------------------------------

Google I/O の「The world of ListView」のページは こちら

セッションのスライドはこちら

　agenda

　　• Virtualization and adapters

　　• Item properties

　　• Headers and footers

　　• List selectors

　　• Other features

　　• Gotchas and don'ts


--------------------------------------

■ Headers and footers



　* Fixed

　　　fixed header/footer は簡単。次のように
　　　LinearLayout でOK

view plainprint?

1. <LinearLayout  
2.   android:layout_width="fill_parent"  
3.   android:layout_height="fill_parent"  
4.   android:orientation="vertical">  
5.   
6.   <LinearLayout  
7.     android:layout_width="fill_parent"  
8.     android:layout_height="wrap_content">  
9.   
10.     <!-- ... -->  
11.   
12.   </LinearLayout>  
13.   
14.   <ListView  
15.     android:id="@+id/list"  
16.     android:layout_width="fill_parent"  
17.     android:layout_height="0dip"  
18.     android:layout_weight="1.0" />  
19.   
20. </LinearLayout>  

<LinearLayout
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical">

  <LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">

    <!-- ... -->

  </LinearLayout>

  <ListView
    android:id="@+id/list"
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1.0" />

</LinearLayout>

　* Scrolling

　　一緒にスクロールする header/footer はメソッドが用意されている
　　twitter の reload / more load みたいなやつ。

　　• ListView.addHeaderView()
　　• ListView.addFooterView()
　　• setAdapter() の前に呼ばなければならない
　　• isSelectable == Adapter.isEnabled()
　　　　– Sorry, our bad（混乱する名前にしちゃってごめんね。。。）

　　addHeaderView() と addFooterView() は isSelectable という
　　パラメータを保持している。
　　これは、使われている final adapter が items が有効になっている
　　リストに report back するかどうかに対応する。
　　「ちょっと混乱する名前だね」って言ってた。

　　(This corresponds to whether or not the final adapter
　　 being used will report back to the list that these
　　 items are enabled.)

　* Wrapped adapter

　　ListView では、内部的に別の adapter の中に your adapter を
　　wrapping することで、scrolling header / footer を実現している。
　　そのため、最初の最後の要素(item)では、異なるタイプの view を返す。
　　よって、setAdapter で渡した adapter と getAdapter
　　で返ってくる adapter は異なる。ちょっと注意が必要。

view plainprint?

1. ListView list = ...;  
2. list.addHeaderView(myHeader);  
3. list.addFooterView(myFooter);  
4. list.setAdapter(myAdapter);  
5.   
6. boolean same = list.getAdapter() == myAdapter;  
7. // same == false!  
8. // getAdapter() returns a  
9. // android.widget.HeaderViewListAdapter  

ListView list = ...;
list.addHeaderView(myHeader);
list.addFooterView(myFooter);
list.setAdapter(myAdapter);

boolean same = list.getAdapter() == myAdapter;
// same == false!
// getAdapter() returns a
// android.widget.HeaderViewListAdapter

Android 「The world of ListView」 - Item properties -

Google I/O の 「The world of ListView」というセッションを見たので
そのまとめ。

長いので、項目ごとに分けました。
今回は 「Item properties」

--------------------------------------

Google I/O の「The world of ListView」のページは こちら

セッションのスライドはこちら

　agenda

　　• Virtualization and adapters

　　• Item properties

　　• Headers and footers

　　• List selectors

　　• Other features

　　• Gotchas and don'ts


--------------------------------------

■ Item properties

　* Enabled or disabled

　　　• Enabled
　　　　　– 選択、クリックができる要素
　　　• Disabled
　　　　　– コンテンツ内の区切り線・ヘッダ

　　　• 例）マーケットアプリ
　　　　　緑が Disabled Items



　* Choice mode
　　　• Single choice mode (radio buttons)
　　　• Multiple choice mode (checked items)
　　　• 選択されているのはどれ?
　　　　　– Single choice mode
　　　　　　　• getCheckedItemPosition()
　　　　　– Multiple choice mode
　　　　　　　• getCheckedItemPositions()
　　　　　– Stable IDs はポジションが変化するような場合に役立つ
　　　　　　　• getCheckedItemIds()
　　　　　　　• Stable ID は項目の挿入や削除によって変化しない
　　　　　　　（ポジションは変わる）
　　　　　　　• an integer

　　　• 例）左：Single choice mode, 右：Multiple choice mode





　* Focusable
　　　• setItemsCanFocus(boolean itemsCanFocus)
　　　• itemsCanFocus = false : リストの要素全体はフォーカスできる
　　　• itemsCanFocus = true : リストの要素内の view にフォーカスできる

　　　＃ 「UIで大きな制限の1つが、トラックボールとタッチスクリーン両方を
　　　＃ サポートしなければならないということ。
　　　＃ タッチしたら、フォーカスや選択はすぐ消えるように、早い段階に決めた。
　　　＃ なぜなら、choice mode があるから。
　　　＃ ユーザーがリスト内の項目をタップして、かつ画面上の選択を
　　　＃ 維持させることはできない。
　　　＃ ListViewは本当に難しいこと発生させないようにコントロールしている。

　　　＃ 例えば、1つの行に複数のボタンが含まれているけれども、
　　　＃ トラックボールを使った場合、行全体が選択される。
　　　＃ その理由は、行全体を選択している状態から、その中の小さい要素を
　　　＃ 選択するというトラックボールナビゲーションを持つことは、
　　　＃ とてもやっかいだから。」

　　　もし、行の中の小要素（ボタンとか、リンク）にフォーカスさせないなら
　　　itemCnaFocus = true にする。

　　　• 例）右：itemsCanFocus = false, 左 : itemsCanFocus = true



　＃ Item の view が複雑になると、この Focusable をどっちにするかは
　＃ 悩ましいところ。登壇者も、いいアイディアがあればコミュニティに
　＃ フィードバックしてほしいと言ってました。
　＃ 将来的に改善したいとも言ってたので、期待したいです。

Android 「The world of ListView」 - Virtualization and adapters -

Google I/O の 「The world of ListView」というセッションを見たので
そのまとめ。

長いので、項目ごとに分けました。
今回は 「Virtualization and adapters」

--------------------------------------

Google I/O の「The world of ListView」のページは こちら

セッションのスライドはこちら

　agenda

　　• Virtualization and adapters

　　• Item properties

　　• Headers and footers

　　• List selectors

　　• Other features

　　• Gotchas and don'ts

--------------------------------------

■ Virtualization and adapters

　・ Virtualization
　　* 問題点 : 巨大なデータセット
　　　・メモリ
　　　・パフォーマンス
　　
　　10,000 item くらいの（ってセッションでは言ってた）データを
　　比較的速く扱うには？
　　普通は、10,000 個のview を view の階層に添付したくはないよね。
　　そのために、、、

　　* 解決方法
　　　・必要に応じでデータを格納
　　　・view をリサイクルして、オブジェクトのチャーン（object churn）を減らす
　　

　・ Adapters
　　* 用語
　　　– index: 子要素
　　　– position: adapter 内のデータ
　　　– id: データの識別子

　　* Stable IDs
　　　– hasStableIds() == true で調べる
　　　– 常に同じ値を参照するための ID
　　　– ListView に役立つ！！

　　* getView(int position, View convertView, ViewGroup parent)
　　　– 全データの表示を制御
　　　– 最適化
　　　– はまりやすい！「Shoot yourself in the foot (and the face)」

　　ローカルのデータや、データベースのデータや、ネットワークから
　　とったデータ、から割り当てたデータソースから、データを取り出す。
　　view は単純な TextView だったり、複雑なレイアウトだったりする。
　　
　
　　* getView の 最適化ポイント
　　　• ListView is smart
　　　• convertView
　　　　– ListView で提供される
　　　　– 要素(item)のタイプと一致
　　　　– 再利用すべし！！

　　　extra view パラメータの呼び出しを convert view に
　　　渡してしまえばOK。ListView がスクリーン外の view を
　　　再利用する方法と同じ最適化方法。
　　　
　　　ListView はスクリーン外へ移動した全部の extra view を
　　　keep track して、既存のデータを入れてから返す。
　　　これが、convert view parameter。
　　　つまり、自動的に item のタイプを match up している。
　　　もし、adapter 内に異なるデータによる複数のタイプ
　　　（例えば、画像と文字）がある場合、ListViewに adapter
　　　のあるポジションがどのタイプか聞いたとき convert view は
　　　いつも正しいタイプになっている（必要がある）。
　　　でもこれはあんまり賢いやりかたじゃない。
　　　
　　　だから、
　　　　もし convertView が null じゃないなら、再利用する！
　　　

　　　● getView のダメな使い方 (The Slow Way)

view plainprint?

1. public View getView(int position, View convertView, ViewGroup parent) {  
2.     View item = mInflater.inflate(R.layout.list_item_icon_text, null);  
3.     ((TextView) item.findViewById(R.id.text)).setText(DATA[position]);  
4.     ((ImageView) item.findViewById(R.id.icon)).setImageBitmap(  
5.     (position & 1) == 1 ? mIcon1 : mIcon2);  
6.     return item;  
7. }  

public View getView(int position, View convertView, ViewGroup parent) {
    View item = mInflater.inflate(R.layout.list_item_icon_text, null);
    ((TextView) item.findViewById(R.id.text)).setText(DATA[position]);
    ((ImageView) item.findViewById(R.id.icon)).setImageBitmap(
    (position & 1) == 1 ? mIcon1 : mIcon2);
    return item;
}

　　　　getView 内で毎回 view を inflate してはダメ！
　　　　xml を毎回 parse することは、メモリもCPUも使うので
　　　　とっても無駄が多い。


　　　● getView の普通の使い方 (The Right Way)

view plainprint?

1. public View getView(int position, View convertView, ViewGroup parent) {  
2.     if (convertView == null) {  
3.         convertView = mInflater.inflate(R.layout.item, parent, false);  
4.     }  
5.     ((TextView) convertView.findViewById(R.id.text)).setText(DATA[position]);  
6.     ((ImageView) convertView.findViewById(R.id.icon)).setImageBitmap(  
7.     (position & 1) == 1 ? mIcon1 : mIcon2);  
8.     return convertView;  
9. }  

public View getView(int position, View convertView, ViewGroup parent) {
    if (convertView == null) {
        convertView = mInflater.inflate(R.layout.item, parent, false);
    }
    ((TextView) convertView.findViewById(R.id.text)).setText(DATA[position]);
    ((ImageView) convertView.findViewById(R.id.icon)).setImageBitmap(
    (position & 1) == 1 ? mIcon1 : mIcon2);
    return convertView;
}

　　　　最初だけ view を inflate して、それを再利用する


　　　● getView の賢い使い方 (The Fast Way)

　　　ViewHolder を使うべし

view plainprint?

1. static class ViewHolder {  
2.     TextView text;  
3.     ImageView icon;  
4. }  

static class ViewHolder {
    TextView text;
    ImageView icon;
}

view plainprint?

1. public View getView(int position, View convertView, ViewGroup parent) {  
2.     ViewHolder holder;  
3.   
4.     if (convertView == null) {  
5.         convertView = mInflater.inflate(R.layout.list_item_icon_text, parent, false);  
6.         holder = new ViewHolder();  
7.         holder.text = (TextView) convertView.findViewById(R.id.text);  
8.         holder.icon = (ImageView) convertView.findViewById(R.id.icon);  
9.   
10.         convertView.setTag(holder);  
11.     }   
12.     else {  
13.         holder = (ViewHolder) convertView.getTag();  
14.     }  
15.   
16.     holder.text.setText(DATA[position]);  
17.     holder.icon.setImageBitmap((position & 1) == 1 ? mIcon1 : mIcon2);  
18.   
19.     return convertView;  
20. }  

public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder holder;

    if (convertView == null) {
        convertView = mInflater.inflate(R.layout.list_item_icon_text, parent, false);
        holder = new ViewHolder();
        holder.text = (TextView) convertView.findViewById(R.id.text);
        holder.icon = (ImageView) convertView.findViewById(R.id.icon);

        convertView.setTag(holder);
    } 
    else {
        holder = (ViewHolder) convertView.getTag();
    }

    holder.text.setText(DATA[position]);
    holder.icon.setImageBitmap((position & 1) == 1 ? mIcon1 : mIcon2);

    return convertView;
}

　　　　最初だけ view を inflate して、holder を介して再利用する


　　　　このくらい違う




　　　* How to shoot yourself in the foot （どのようにはまりやすいか）
　　　　　• ロカールビューのキャッシュ
　　　　　• adapter からビューにアクセスする
　　　　　• convertView の構造を変える
　　　　　• getView の呼び出しについての仮定

　　　* データの変更を制御する
　　　　• notifyDataSetChanged()
　　　　　– データの新規作成 or 更新
　　　　• notifyDataSetInvalidated()
　　　　　– アクセスできるデータがないとき

　　　* 異なるビュータイプを制御する
　　　　• 要素のタイプ (item types) を Built-in にする
　　　　• getItemViewType
　　　　　– 与えられたポジションのビューのタイプを取得
　　　　　– 正しい convertView を提供するのに使う
　　　　• getViewTypeCount
　　　　　– 予測されるタイプの数を取得

　　　* slow data sources を制御する
　　　　• UIスレッドで adapter の変更 (modification)
　　　　• Fetching data can happen anywhere
　　　　• 別のスレッド上でデータをリクエストする
　　　　• UIスレッドで、adapter の変更をコミットする
　　　　• notifyDataSetChanged() を呼び出す

　書きかけだけど、一旦出します。
　もうちょっと追記するかも。

Android デザイン関係の役立ちリンク

こないだひろみさんが Ust で紹介してくれたサイトとか、もろもろ。
忘備録です。

・"Icon Design Guidelines, Android 2.0 | Android Developers" ( http://bit.ly/bsfgXg )

・"インクスケープの使い方・基礎講座 (Inkscape basic lecture)" ( http://bit.ly/cmYqzD )

・"Inkscapeの使い方｜『ブログが作りたい！』＋FC2ブログの作り方＋" ( http://bit.ly/aU8qm0 )

・"AndroidにおけるLauncherアイコン、背景画像の作り方 : アシアルブログ" ( http://bit.ly/9FL7UB )

・"Color Theory @ ColorJack" ( http://bit.ly/9JPP1K )

・"Google Docs Templates for Web Designers and Developers :Speckyboy Design Magazine" ( http://bit.ly/deyCLo )

Android Expandable List のビューをカスタマイズ

Expandable List の子要素の最後をボタンにしてみました。

こんな感じ。



# 次の Libraroid のアップデートに組み込むつもり～

以前のエントリAndroid　Expandable List を使うで、Expandable List を使うには、SimpleExpandableListAdapter を使うのが簡単だと書きましたが、今回のようにカスタマイズする場合は使えません。

参考にしたのが、ApiDemo の ExpandableList1.java です。

BaseExpandableListAdapter を継承して独自の Adapter を作ります。

キモは
　getChildView() と getGroupView() です。

ここで返している View が対応する位置の行の View になります。
ここでは TextView を返していますが、Button や ImageView を
返せば、それが行のViewになります。
もちろん LinearLayout を使って複数の View の組み合わせを返す
こともできます。

元々の全ソースはここ。

view plainprint?

1. public class MyExpandableListAdapter extends BaseExpandableListAdapter {  
2.   
3.     ....  
4.   
5.     public TextView getGenericView() {  
6.         // Layout parameters for the ExpandableListView  
7.         AbsListView.LayoutParams lp = new AbsListView.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, 64);  
8.   
9.         TextView textView = new TextView(ExpandableList1.this);  
10.         textView.setLayoutParams(lp);  
11.         // Center the text vertically  
12.         textView.setGravity(Gravity.CENTER_VERTICAL | Gravity.LEFT);  
13.         // Set the text starting position  
14.         textView.setPadding(36, 0, 0, 0);  
15.         return textView;  
16.     }  
17.           
18.     public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {  
19.         TextView textView = getGenericView();  
20.         textView.setText(getChild(groupPosition, childPosition).toString());  
21.         return textView;  
22.     }  
23.   
24.     public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {  
25.         TextView textView = getGenericView();  
26.         textView.setText(getGroup(groupPosition).toString());  
27.         return textView;  
28.     }  
29.   
30.     ....  
31. }  

public class MyExpandableListAdapter extends BaseExpandableListAdapter {

    ....

    public TextView getGenericView() {
        // Layout parameters for the ExpandableListView
        AbsListView.LayoutParams lp = new AbsListView.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, 64);

        TextView textView = new TextView(ExpandableList1.this);
        textView.setLayoutParams(lp);
        // Center the text vertically
        textView.setGravity(Gravity.CENTER_VERTICAL | Gravity.LEFT);
        // Set the text starting position
        textView.setPadding(36, 0, 0, 0);
        return textView;
    }
        
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {
        TextView textView = getGenericView();
        textView.setText(getChild(groupPosition, childPosition).toString());
        return textView;
    }

    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        TextView textView = getGenericView();
        textView.setText(getGroup(groupPosition).toString());
        return textView;
    }

    ....
}

で、今回は子要素の最後の列を LinearLyout + Button にしてみました。

view plainprint?

1. public class ExpandableListTest2 extends ExpandableListActivity {  
2.   
3.     MyExpandableListAdapter mAdapter;  
4.   
5.     @Override  
6.     public void onCreate(Bundle savedInstanceState) {  
7.         super.onCreate(savedInstanceState);  
8.         setContentView(R.layout.mybooklist_layout);          
9.   
10.      setList();  
11.     }  
12.       
13.     public void setList(){  
14.      final int LIST_SIZE = 10;  
15.        
16.      int[] rowId = new int[LIST_SIZE];  
17.      String[] parentList = new String[LIST_SIZE];  
18.      String[][] childList = new String[LIST_SIZE][3];  
19.        
20.      for(int i=0; i<LIST_SIZE ; i++){  
21.       rowId[i] = i;  
22.       parentList[i] = "Title: " + i;  
23.       childList[i][0] = "Author: " + i;  
24.       childList[i][1] = "ISBN: " + i;  
25.       childList[i][2] = "";  
26.      }          
27.           
28.         mAdapter = new MyExpandableListAdapter(rowId, parentList, childList);  
29.         setListAdapter(mAdapter);  
30.         registerForContextMenu(getExpandableListView());  
31.     }  
32.   
33.     public class MyExpandableListAdapter extends BaseExpandableListAdapter {  
34.   
35.      private int[] rowId;  
36.      private String[] groups;  
37.         private String[][] children;  
38.           
39.         public MyExpandableListAdapter(int[] rowId, String[] groups, String[][] children){  
40.          this.rowId = rowId;  
41.          this.groups = groups;  
42.          this.children = children;  
43.         }  
44.           
45.         public int getRowId(int groupPosition) {  
46.          return rowId[groupPosition];  
47.         }  
48.           
49.         public Object getChild(int groupPosition, int childPosition) {  
50.             return children[groupPosition][childPosition];  
51.         }  
52.   
53.         public long getChildId(int groupPosition, int childPosition) {  
54.             return childPosition;  
55.         }  
56.   
57.         public int getChildrenCount(int groupPosition) {  
58.             return children[groupPosition].length;  
59.         }  
60.   
61.         public TextView getGenericView() {  
62.             AbsListView.LayoutParams lp = new AbsListView.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, getResources().getDimensionPixelSize(R.dimen.listHeight));  
63.   
64.             TextView textView = new TextView(ExpandableListTest2.this);  
65.             textView.setLayoutParams(lp);  
66.             textView.setGravity(Gravity.CENTER_VERTICAL | Gravity.LEFT);  
67.             textView.setPadding(getResources().getDimensionPixelSize(R.dimen.listPadding), 0, 0, 0);  
68.             return textView;  
69.         }  
70.           
71.         public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {  
72.   
73.          // 最後の行は LinearLyout + Button を返す   
74.          if(childPosition == getChildrenCount(groupPosition) - 1) {  
75.                 AbsListView.LayoutParams lp = new AbsListView.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, getResources().getDimensionPixelSize(R.dimen.listHeight));  
76.                 AbsListView.LayoutParams lp2 = new AbsListView.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);  
77.   
78.                 LinearLayout ll = new LinearLayout(ExpandableListTest2.this);  
79.                 ll.setLayoutParams(lp);  
80.                 ll.setPadding(getResources().getDimensionPixelSize(R.dimen.listPadding), 0, 0, 0);  
81.                 ll.setGravity(Gravity.CENTER_VERTICAL | Gravity.LEFT);  
82.   
83.                 Button button = new Button(ExpandableListTest2.this);  
84.                 button.setText("図書館検索");  
85.                 button.setLayoutParams(lp2);  
86.                 ll.addView(button);  
87.                 return ll;  
88.            
89.          }  
90.          else {  
91.              TextView textView = getGenericView();  
92.              textView.setText(getChild(groupPosition, childPosition).toString());  
93.              return textView;  
94.             
95.          }  
96.         }  
97.           
98.         public Object getGroup(int groupPosition) {  
99.             return groups[groupPosition];  
100.         }  
101.   
102.         public int getGroupCount() {  
103.             return groups.length;  
104.         }  
105.   
106.         public long getGroupId(int groupPosition) {  
107.             return groupPosition;  
108.         }  
109.   
110.         public View getGroupView(int groupPosition, boolean isExpanded, View convertView,  
111.                 ViewGroup parent) {  
112.             TextView textView = getGenericView();  
113.             textView.setText(getGroup(groupPosition).toString());  
114.             return textView;  
115.         }  
116.   
117.         public boolean isChildSelectable(int groupPosition, int childPosition) {  
118.             return true;  
119.         }  
120.   
121.         public boolean hasStableIds() {  
122.             return true;  
123.         }  
124.   
125.     }  
126. }  

public class ExpandableListTest2 extends ExpandableListActivity {

    MyExpandableListAdapter mAdapter;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.mybooklist_layout);        

     setList();
    }
    
    public void setList(){
     final int LIST_SIZE = 10;
     
     int[] rowId = new int[LIST_SIZE];
     String[] parentList = new String[LIST_SIZE];
     String[][] childList = new String[LIST_SIZE][3];
     
     for(int i=0; i<LIST_SIZE ; i++){
      rowId[i] = i;
      parentList[i] = "Title: " + i;
      childList[i][0] = "Author: " + i;
      childList[i][1] = "ISBN: " + i;
      childList[i][2] = "";
     }        
        
        mAdapter = new MyExpandableListAdapter(rowId, parentList, childList);
        setListAdapter(mAdapter);
        registerForContextMenu(getExpandableListView());
    }

    public class MyExpandableListAdapter extends BaseExpandableListAdapter {

     private int[] rowId;
     private String[] groups;
        private String[][] children;
        
        public MyExpandableListAdapter(int[] rowId, String[] groups, String[][] children){
         this.rowId = rowId;
         this.groups = groups;
         this.children = children;
        }
        
        public int getRowId(int groupPosition) {
         return rowId[groupPosition];
        }
        
        public Object getChild(int groupPosition, int childPosition) {
            return children[groupPosition][childPosition];
        }

        public long getChildId(int groupPosition, int childPosition) {
            return childPosition;
        }

        public int getChildrenCount(int groupPosition) {
            return children[groupPosition].length;
        }

        public TextView getGenericView() {
            AbsListView.LayoutParams lp = new AbsListView.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, getResources().getDimensionPixelSize(R.dimen.listHeight));

            TextView textView = new TextView(ExpandableListTest2.this);
            textView.setLayoutParams(lp);
            textView.setGravity(Gravity.CENTER_VERTICAL | Gravity.LEFT);
            textView.setPadding(getResources().getDimensionPixelSize(R.dimen.listPadding), 0, 0, 0);
            return textView;
        }
        
        public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {

         // 最後の行は LinearLyout + Button を返す 
         if(childPosition == getChildrenCount(groupPosition) - 1) {
                AbsListView.LayoutParams lp = new AbsListView.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, getResources().getDimensionPixelSize(R.dimen.listHeight));
                AbsListView.LayoutParams lp2 = new AbsListView.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);

                LinearLayout ll = new LinearLayout(ExpandableListTest2.this);
                ll.setLayoutParams(lp);
                ll.setPadding(getResources().getDimensionPixelSize(R.dimen.listPadding), 0, 0, 0);
                ll.setGravity(Gravity.CENTER_VERTICAL | Gravity.LEFT);

                Button button = new Button(ExpandableListTest2.this);
                button.setText("図書館検索");
                button.setLayoutParams(lp2);
                ll.addView(button);
                return ll;
         
         }
         else {
             TextView textView = getGenericView();
             textView.setText(getChild(groupPosition, childPosition).toString());
             return textView;
          
         }
        }
        
        public Object getGroup(int groupPosition) {
            return groups[groupPosition];
        }

        public int getGroupCount() {
            return groups.length;
        }

        public long getGroupId(int groupPosition) {
            return groupPosition;
        }

        public View getGroupView(int groupPosition, boolean isExpanded, View convertView,
                ViewGroup parent) {
            TextView textView = getGenericView();
            textView.setText(getGroup(groupPosition).toString());
            return textView;
        }

        public boolean isChildSelectable(int groupPosition, int childPosition) {
            return true;
        }

        public boolean hasStableIds() {
            return true;
        }

    }
}

Android Expandable List を使う

一番簡単なのは、SimpleExpandableListAdapter を使う方法。

ApiDemo の ExpandableList3.java がまさにそのデモ。



ExpandableListActivity を継承した Activity を作ります。

view plainprint?

1. import android.app.ExpandableListActivity;  
2. import android.os.Bundle;  
3. import android.widget.ExpandableListAdapter;  
4. import android.widget.SimpleExpandableListAdapter;  
5.   
6. import java.util.ArrayList;  
7. import java.util.HashMap;  
8. import java.util.List;  
9. import java.util.Map;  
10.   
11. public class ExpandableListTest extends ExpandableListActivity {  
12.     private static final String NAME = "NAME";  
13.     private static final String IS_EVEN = "IS_EVEN";  
14.           
15.     private ExpandableListAdapter mAdapter;  
16.           
17.     @Override  
18.     public void onCreate(Bundle savedInstanceState) {  
19.         super.onCreate(savedInstanceState);  
20.   
21.         // 親要素  
22.         List<Map<String, String>> groupData = new ArrayList<Map<String, String>>();  
23.         // 子要素  
24.         List<List<Map<String, String>>> childData = new ArrayList<List<Map<String, String>>>();  
25.     
26.         // 値を設定  
27.         for (int i = 0; i < 20; i++) {  
28.             // 親要素の値を設定  
29.             Map<String, String> curGroupMap = new HashMap<String, String>();  
30.             curGroupMap.put(NAME, "Group " + i);  
31.             groupData.add(curGroupMap);  
32.      
33.             // 子要素の値を設定              
34.             List<Map<String, String>> children = new ArrayList<Map<String, String>>();  
35.             for (int j = 0; j < 15; j++) {  
36.                 Map<String, String> curChildMap = new HashMap<String, String>();  
37.                 curChildMap.put(NAME, "Child " + j);  
38.                 curChildMap.put(IS_EVEN, (j % 2 == 0) ? "This child is even" : "This child is odd");  
39.                 children.add(curChildMap);  
40.             }  
41.             childData.add(children);  
42.         }  
43.               
44.         // adapter 設定  
45.         mAdapter = new SimpleExpandableListAdapter(  
46.             this,  
47.             // 親要素  
48.             groupData,  
49.             // 親要素のレイアウト  
50.             android.R.layout.simple_expandable_list_item_1,  
51.             // 親要素のListで、表示するMapのKey  
52.             new String[] { NAME },  
53.             // 親要素レイアウト内での文字を表示する TextView の ID  
54.             new int[] { android.R.id.text1 },  
55.             // 子要素  
56.             childData,  
57.             // 子要素のレイアウト  
58.             android.R.layout.simple_expandable_list_item_2,  
59.             // 子要素のListで、表示するMapのKey  
60.             new String[] { NAME, IS_EVEN },  
61.             // 子要素レイアウト内での文字を表示する TextView の ID  
62.             new int[] { android.R.id.text1, android.R.id.text2 }  
63.         );  
64.         setListAdapter(mAdapter);  
65.     }  
66. }  

import android.app.ExpandableListActivity;
import android.os.Bundle;
import android.widget.ExpandableListAdapter;
import android.widget.SimpleExpandableListAdapter;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class ExpandableListTest extends ExpandableListActivity {
    private static final String NAME = "NAME";
    private static final String IS_EVEN = "IS_EVEN";
        
    private ExpandableListAdapter mAdapter;
        
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // 親要素
        List<Map<String, String>> groupData = new ArrayList<Map<String, String>>();
        // 子要素
        List<List<Map<String, String>>> childData = new ArrayList<List<Map<String, String>>>();
  
        // 値を設定
        for (int i = 0; i < 20; i++) {
            // 親要素の値を設定
            Map<String, String> curGroupMap = new HashMap<String, String>();
            curGroupMap.put(NAME, "Group " + i);
            groupData.add(curGroupMap);
   
            // 子要素の値を設定            
            List<Map<String, String>> children = new ArrayList<Map<String, String>>();
            for (int j = 0; j < 15; j++) {
                Map<String, String> curChildMap = new HashMap<String, String>();
                curChildMap.put(NAME, "Child " + j);
                curChildMap.put(IS_EVEN, (j % 2 == 0) ? "This child is even" : "This child is odd");
                children.add(curChildMap);
            }
            childData.add(children);
        }
            
        // adapter 設定
        mAdapter = new SimpleExpandableListAdapter(
            this,
            // 親要素
            groupData,
            // 親要素のレイアウト
            android.R.layout.simple_expandable_list_item_1,
            // 親要素のListで、表示するMapのKey
            new String[] { NAME },
            // 親要素レイアウト内での文字を表示する TextView の ID
            new int[] { android.R.id.text1 },
            // 子要素
            childData,
            // 子要素のレイアウト
            android.R.layout.simple_expandable_list_item_2,
            // 子要素のListで、表示するMapのKey
            new String[] { NAME, IS_EVEN },
            // 子要素レイアウト内での文字を表示する TextView の ID
            new int[] { android.R.id.text1, android.R.id.text2 }
        );
        setListAdapter(mAdapter);
    }
}

Android Debug certificate expired on xx/xx/xx xx:xx !

ビルドしようとしたら

[2010-08-21 18:44:41 - Libraroid] Error generating final archive: Debug certificate expired on 10/08/21 18:14!

とか言われて x が消えない。

android developers に書いてあった。

I can't compile my app because the build tools generated an expired debug certificate

どうも、non-Gregorian calendar の locale (グレゴリオ暦以外のロケール) を使っていると、なる場合があるらしい。

Keytool utility （JDKに含まれてる Android build tools）が原因のようだ。

グレゴリオ暦以外のロケールを適切に処理できなくて、過去の日付を有効期限の日付にしてしまうみたい。そのせいで、期限切れのデバッグキーを生成してしまうためにコンパイルエラーになるとのこと。

対処法は、

　1. 最初に、Android build tools が既に作成している
　　debug keystore/key を削除する

　　　つまり、debug.keystore を削除する

　　　　Linux/Mac OSX だと、~/.android.
　　　　Windows XP だと、C:\Documents and Settings\\.android.
　　　　Windows Vista だと、C:\Users\\.android

　　　にある

　2. 次に、以下のどちらかをする

　　　* 一時的に開発マシンのロケール (date and time) をグレゴリオ暦の
　　　　ロケールのどれかに変更する。例えば、United States。
　　　　ロケールを変更したら、一度 Android build tools でアプリを
　　　　コンパイル＆インストールする。
　　　　build tools が新しい keystore と debug key を正常な日付で
　　　　生成するので、新しい debug key が生成されたら開発マシンの
　　　　ロケールを元に戻す。

　　　* 開発マシンのロケール設定を変更したくない場合は、別の開発マシンで
　　　　グレゴリオ暦を使用して keystore/key を生成して、その
　　　　debug.keystore ファイルを/キーを、開発マシン上でコピーする。

　
＃ いままで、問題なかったのに、なんで急にこうなったのかなぁ。
＃ と考えて思いつくことといえば、なんかのソフトウェアアップデート
＃ をしたくらいなんだよね。それが原因だったのかな。。。？

デザイン部第2回 KsLauncher をいじり倒す

8月20日（金）の19時～大森の nifty さんの部屋をお借りして
デザイン部第2回を開催しました。

参加者はデザイン部メンバー + nifty さんの社員さんで
全部で20人くらい。

nifty さんは技術者向け勉強会の会場提供や動画配信協力
を行っていて、詳しくはこちらを見てください。
もしくは、@nifty_engineer さんにつぶやいてね。

KsLauncher という Android アプリについて、UI/UX 機能
などなどディスカッションしました。

ディスカッションの詳細はデザイン部のページをみてください。
＃まだ書いてないです。もうちょっとまってね。

このディスカッションに参加して、私の印象に残っていることが、
「タッチパネル用の画面は、カーソル操作の画面とは違う」
ということ。

当たり前なんだけど。

KsLauncher のデザインがドラクエっぽかったので、ちょっと
考えたんだけど、例えばドラクエだと十字キーでカーソル（▼）
が移動するので、そこが押せる＝何かアクションがある、という
ことがユーザーに伝わる。

戦闘シーンで、HPやMPにカーソルが行かないから、
ここは押せないってすぐわかる。
これは、いままでの携帯電話（＝十字キーとテンキーで操作する）の
操作でも同じ。

でも、これがタッチパネルだったら？

カーソルなんて出ない

HPやMPも押せるって思っちゃうんじゃないだろうか？


タッチパネルの操作って、どっちかというとブラウザ + マウスに近いけど
すごく大きな違いがある。「ポインタ」。
押せるところと押せないところでポインタの形状が変わる。
これによって、ユーザーは押せる押せないが、すぐに分かる。


つまり、タッチパネルの画面において、いかにして

「どこが押せる（＝アクションがある）かを、ユーザーが直感的にわかるようにする」

かがキモなのかなぁと思いました。


前に書いたエントリ Android UI Design Tips の
＊ good interface design の原理 の「適切なフィードバックをする」とか
「予測可能にする」とかが当てはまるのかな。

例えば

　・色を変える（コントラスト、白黒、グレーアウトなど）
　・▼マークを付ける（web design だとよくあるそうです）
　・グラデーション（キラッとした感じとか）
　・立体感

とかかなぁ。



他には、「ロングタップはどこに使えばいい？」
昨日の結論 + 私の意見としては
　・必須な操作、よく使う操作、にはロングタップは使わない
　・あると便利（チップス的）な操作に使う


あとは、「どんなヒントや使い方ならユーザーにわかりやすいか？」
使い方って読んでもらえないよね。
マーケットの更新情報もだけど。

Google I/O 2010 の Android UI design patterns では
更新情報は Dashboard に書けっていってたけどね。

やっぱり
　・画像を使った操作説明
かなぁと。

これについては、既存の iPhone アプリや Android アプリで
使われているいい方法を見つけて紹介できたらいいかも。



こんな感じでした。
第3回もよろしくです。

＃ KsLauncher はランチャーアプリじゃなくてタスク管理アプリじゃね？
＃ みたいな意見が多くておもしろかった。確かに高機能だしね。

Gimp 画像を着色する

Menu の背景を変えるというエントリ
http://y-anz-m.blogspot.com/2010/08/androidmenu.html
で Menuパネルのアイコンも色付きのに変更しました。

もともとのアイコンは Android のシステムのアイコンで
灰色です。

この辺りに一覧が
Android Drawables Comparison Chart

この灰色を別の色に変えたくないですか？
単にこのまま色だけ青とか赤とか緑とかにする方法です。

＃私のノパソは Ubuntu なので、フォトショではなく、もっぱら Gimp です。

1. Gimp を起動する

2. 色を変えたいアイコンの画像(ic_menu_hoge.png とか)を開く



3. 色 -> 着色 を選択する

4. 色相、彩度、輝度を調整する




5. 保存する

おしまい。簡単。

ic_menu_star.png を青にしてみました。

Android Menu の背景を変える

Menu を作る方法は http://developer.android.com/guide/topics/ui/menus.html
などに書いてありますが、まっとうな方法では、アイコンとタイトルしか
変更できません。

＊Menuとはメニューキーを押したときに下から”にゅっ”と出てくる
やつです。



↑これの「使い方」とか「ネイル・ド・ロンジョについて」とかのパネルの部分


システムとの一貫性を保つためにそうなっているんだろうとは
思うのですが、アイコンにすごくカラフルなのとか使ったら
一貫性もなにもないだろぅ。とか思ったりもします。

例えば、ic_menu_**.png はアイコンが灰色ですが、このアイコンの
色を変えた画像を用意して、アイコンに指定すると



となって、メニューパネルの背景色がアプリ全体の色バランスと
合ってない感じになってしまいます。

そこで、メニューパネル部分の背景を変えてみました。






以下やりかたです。

＊注！　この方法は Reflection で内部クラスを使っているので、SDKのアップデートなどで使えなくなる可能性があります。

view plainprint?

1. import java.lang.reflect.Constructor;  
2. import java.lang.reflect.InvocationTargetException;  
3.   
4. import android.app.Activity;  
5. import android.content.Context;  
6. import android.content.Intent;  
7. import android.graphics.Color;  
8. import android.os.Bundle;  
9. import android.util.AttributeSet;  
10. import android.view.LayoutInflater;  
11. import android.view.Menu;  
12. import android.view.MenuInflater;  
13. import android.view.MenuItem;  
14. import android.view.View;  
15. import android.view.ViewGroup;  
16. import android.view.LayoutInflater.Factory;  
17.   
18. public class MenuTest extends Activity {  
19.   
20. @Override  
21. public void onCreate(Bundle savedInstanceState) {  
22.     super.onCreate(savedInstanceState);  
23.   
24.     // ここで設定   
25.     ensureInflaterFactory();  
26.           
27.     setContentView(R.layout.main);  
28. }  
29.   
30.   
31. void ensureInflaterFactory() {  
32.     LayoutInflater service = (LayoutInflater) getSystemService(LAYOUT_INFLATER_SERVICE);  
33.     final Factory orgFactory = service.getFactory();  
34.   
35.     if (orgFactory == null) {  
36.         // View をインスタンス化するための Factory オブジェクトを LayoutInflater に設定する。  
37.         // Factory の onCreateView で View のインスタンスを return すればそれが使われる。  
38.         // null を return すれば LayoutInflater 自身がViewをインスタンス化する。  
39.         final Factory factory = new Factory() {  
40.             public View onCreateView(String name, Context context, AttributeSet attrs) {  
41.   
42.             // メニューパネル部分の内部クラスだけ変更  
43.             if(name.equals("com.android.internal.view.menu.IconMenuView")) {  
44.                 try {  
45.                     ClassLoader cl = getClassLoader();  
46.                     Class<!----> clazz;  
47.                     clazz = cl.loadClass("com.android.internal.view.menu.IconMenuView");  
48.                     Constructor<!----> constructor = clazz.getConstructor(Context.class, AttributeSet.class);  
49.                     Object view = constructor.newInstance(context, attrs);  
50.                     ViewGroup vg = (ViewGroup) view;  
51.                     // ここで色指定  
52.                     // vg.setBackgroundColor(R.color.hoge); だとうまくいかなかった  
53.                     //vg.setBackgroundColor(Color.CYAN); これはうまくいく  
54.                     vg.setBackgroundColor(Color.parseColor("#66ffccff"));  
55.                     //vg.setBackgroundResource(R.drawable.hoge); で画像を背景にすることも可能  
56.                     return vg;  
57.                 }  
58.                 catch (ClassNotFoundException e) {  
59.                     e.printStackTrace();  
60.                 } catch (SecurityException e) {  
61.                     e.printStackTrace();  
62.                 } catch (NoSuchMethodException e) {  
63.                     e.printStackTrace();  
64.                 } catch (IllegalArgumentException e) {  
65.                     e.printStackTrace();  
66.                 } catch (InstantiationException e) {  
67.                     e.printStackTrace();  
68.                 } catch (IllegalAccessException e) {  
69.                     e.printStackTrace();  
70.                 } catch (InvocationTargetException e) {  
71.                     e.printStackTrace();  
72.                 }  
73.             }  
74.             return null;  
75.          }  
76.       };  
77.       service.setFactory(factory);     
78.     }  
79. }  

import java.lang.reflect.Constructor;
import java.lang.reflect.InvocationTargetException;

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.graphics.Color;
import android.os.Bundle;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.view.LayoutInflater.Factory;

public class MenuTest extends Activity {

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    // ここで設定 
    ensureInflaterFactory();
        
    setContentView(R.layout.main);
}


void ensureInflaterFactory() {
    LayoutInflater service = (LayoutInflater) getSystemService(LAYOUT_INFLATER_SERVICE);
    final Factory orgFactory = service.getFactory();

    if (orgFactory == null) {
        // View をインスタンス化するための Factory オブジェクトを LayoutInflater に設定する。
        // Factory の onCreateView で View のインスタンスを return すればそれが使われる。
        // null を return すれば LayoutInflater 自身がViewをインスタンス化する。
        final Factory factory = new Factory() {
            public View onCreateView(String name, Context context, AttributeSet attrs) {

            // メニューパネル部分の内部クラスだけ変更
            if(name.equals("com.android.internal.view.menu.IconMenuView")) {
                try {
                    ClassLoader cl = getClassLoader();
                    Class clazz;
                    clazz = cl.loadClass("com.android.internal.view.menu.IconMenuView");
                    Constructor constructor = clazz.getConstructor(Context.class, AttributeSet.class);
                    Object view = constructor.newInstance(context, attrs);
                    ViewGroup vg = (ViewGroup) view;
                    // ここで色指定
                    // vg.setBackgroundColor(R.color.hoge); だとうまくいかなかった
                    //vg.setBackgroundColor(Color.CYAN); これはうまくいく
                    vg.setBackgroundColor(Color.parseColor("#66ffccff"));
                    //vg.setBackgroundResource(R.drawable.hoge); で画像を背景にすることも可能
                    return vg;
                }
                catch (ClassNotFoundException e) {
                    e.printStackTrace();
                } catch (SecurityException e) {
                    e.printStackTrace();
                } catch (NoSuchMethodException e) {
                    e.printStackTrace();
                } catch (IllegalArgumentException e) {
                    e.printStackTrace();
                } catch (InstantiationException e) {
                    e.printStackTrace();
                } catch (IllegalAccessException e) {
                    e.printStackTrace();
                } catch (InvocationTargetException e) {
                    e.printStackTrace();
                }
            }
            return null;
         }
      };
      service.setFactory(factory);   
    }
}

Reflection を使っているので、通常の方法よりも
呼び出すときにオーバーヘッドが大きくなります。

＃メニューボタンが押された一番最初しか呼ばれないし、
＃実際そこまで気になるわけではないけど

メニューの中の各アイテムは com.android.internal.view.menu.IconMenuItemView
というクラスで TextView を extends してるので、同じようにして
文字色を変えられないかな、と思ったのですが変わりませんでした。残念。


あ、あと背景に指定する色を透過にしても、透過にはならないで白のパネルになりました。
白のパネルの上に載せる色を指定する、という感じなんですね。

アイコン集

この辺で集めてたアイコンサイトをまとめることにしました。
＃ネタが追い付かないんです ><

フリーでフレッシュなアイコンセット３０
http://phpspot.org/blog/archives/2010/08/post_491.html


シンプルデザインで汎用的に使えそうなソーシャルアイコンセット500
http://phpspot.org/blog/archives/2010/08/500_1.html


次にWEBサイトを作るときに使いたくなるような１３０個のアイコンセット
http://phpspot.org/blog/archives/2010/05/web_55.html


色々な場面で使えそう！という白黒アイコンセット１２０
http://phpspot.org/blog/archives/2010/05/post_475.html


ドット絵感がいい感じのWEBアプリにも使えそうなアイコンセット「Boolean」
http://phpspot.org/blog/archives/2010/06/webboolean.html


サイトで使える500近いフリーのPNGアイコンセット「spirit20」
http://phpspot.org/blog/archives/2010/06/500pngspirit20.html


いい感じにデザインされたフリーのアイコン３０個セット「ComFi Telecom Icons」
http://phpspot.org/blog/archives/2010/07/comfi_telecom_i.html


８０種類の綺麗なフリーアイコンセット「Free Mobile Berries」
http://phpspot.org/blog/archives/2010/07/free_mobile_ber.html


WEBサイトに使えそうな無料で使える75種類の32x32ピクセルアイコンセット
http://phpspot.org/blog/archives/2010/07/web7532x32.html


シンプルで色々な用途に使えそうな商用OKのアイコンセット「Reflection」
http://phpspot.org/blog/archives/2010/07/okreflection.html


32x32のMacやiPhoneの綺麗なアイコンセット「32px Mantra」
http://phpspot.org/blog/archives/2010/08/32x32maciphone3.html


他のサイトのもあったけど、、、見つけたら追記します！

デジタルサイネージ自販機

品川駅にデジタルサイネージ自販機があるらしいので
野次馬根性で羽田空港への通り道だったので見てきた。

"品川駅に登場した頭脳を持った次世代自販機ってなんだ？ | RBB TODAY (ブロードバンド、その他のニュース)" ( http://bit.ly/9kcSPq )


京浜東北のホームの横浜側の端っこにあった。

＃場所わかんなくてホームにいた駅員さんに聞いちゃった。
＃あぁはいはい。みたいな感じで教えてくれたので、よく聞かれるのかも。



かなり大きい




全面タッチパネルで飲み物が表示される
在庫がなくなると、その飲み物は表示されなくなるそう




飲み物をタッチするとこの画面になる




確定すると、この画面になって Suica でタッチ or お金の投入を求められる




購入後はこうなる

あいにくかざせるような携帯電話をもってなかった orz
どうなるんだろ

Ubuntu の起動時間を速くしてみた

"Ubuntuのパワーユーザー向けティップス5選 - IT業界を生き抜く秘密10箇条 - ZDNet Japan" ( http://bit.ly/aE8h8v )

に載っている ＃1：起動時間を短縮する を試してみた。

プロファイルを取得することで、Ubuntuの起動プロセスを最適化できることを利用して起動時間を短縮する方法。

このツールはUbuntu 6.04 から利用可能になっていて、10.04 における高速化でちょっぱやになっているらしい。

■ 手順

1. /etc/default/grub ファイルの以下の行を編集する

　GRUB_CMDLINE_LINUX_DEFAULT="quiet splash"

　を

　GRUB_CMDLINE_LINUX_DEFAULT="quiet splash profile"

　に変更

2. > sudo update-grub2

3. マシンを再起動

　この起動では、プロファイル作業が行われるので
　今までの起動よりも少し時間がかかるはず。

4. 先ほど追加した「profile」オプションを grubファイルから削除
　（＝元に戻す）

5. > sudo update-grub2

おしまい。

これで次回以降はずっと高速に起動するはず。


ということで比較。

> sudo update-grub2
sudo: update-grub2: command not found

おおっと、grub2 が入ってなかったw
Synaptic から grub2 をインストールして、、、、

> sudo update-grub2
Generating grub.cfg ...
Found linux image: /boot/vmlinuz-2.6.31-22-generic
Found initrd image: /boot/initrd.img-2.6.31-22-generic
Found linux image: /boot/vmlinuz-2.6.31-21-generic
Found initrd image: /boot/initrd.img-2.6.31-21-generic
Found linux image: /boot/vmlinuz-2.6.31-20-generic
Found initrd image: /boot/initrd.img-2.6.31-20-generic
Found linux image: /boot/vmlinuz-2.6.31-19-generic
Found initrd image: /boot/initrd.img-2.6.31-19-generic
Found linux image: /boot/vmlinuz-2.6.31-17-generic
Found initrd image: /boot/initrd.img-2.6.31-17-generic
Found linux image: /boot/vmlinuz-2.6.28-17-generic
Found initrd image: /boot/initrd.img-2.6.28-17-generic
Found memtest86+ image: /boot/memtest86+.bin
done

再起動、もどして、もっかい grub2、再起動。。。


うーん。あんまり変わらない orz

どっちもログイン画面まで 45秒くらい、若干速くなった？5秒くらい速くなった？

よくわかりませんでした。残念。

Android Activity, Task, Stack, Launch mode

アクティビティ と タスク と スタック と 起動モード (と ライフサイクル)

開発の基礎のアクティビティとタスク以降
がとっても（日本語が）わかりにくかったので、
私なりの解釈を書くことにしました。
（もしかしたら間違ってるかもしれないよ）

なんで、わかりにくいかと言うと、用語の定義がされてないからなんですね。

なので、ちゃんと定義（みたいなの）

・アクティビティ

　これはいいよね。いわゆる Activity です。


・ルートアクティビティ

タスクを開始するアクティビティのこと。
通常だと、AndroidManifest.xml の タグのなかに

view plainprint?

1. <intent-filter>  
2.   <action android:name="android.intent.action.MAIN" />  
3.   <category android:name="android.intent.category.LAUNCHER" />  
4. </intent-filter>  

<intent-filter>
  <action android:name="android.intent.action.MAIN" />
  <category android:name="android.intent.category.LAUNCHER" />
</intent-filter>

になってるアクティビティのことです。


・スタック

　現在生きている（destroyされていない）アクティビティ
　を管理する入れ物みないなもの
　例えば、起動時のアクティビティが Activity A で、
　そこから、startActivity で別の Activity B に飛んで、
　さらにそこから startActivity で Activity C に飛んだとすると
　スタックの中は

　---------
　| A-B-C
　---------

　になっている
　ここで、Activity C を finish() したり、ユーザが[戻る]ボタンを押したりすると、

　---------
　| A-B
　---------

　になる。OK？


・タスク

　元ページだと、
「アクティビティをスタックにまとめたものがタスク」
と書いてあるのですが、意味がさっぱりです。
で、原文（英語）を見ると
「Simply put, a task is what the user experiences as an "application." It's a group of related activities, arranged in a stack」
つまり、
ユーザーがあるアプリケーションを使ったとして、
その状態遷移に含まれるアクティビティの集合をタスクといいましょう、
ということです。

で、この（ここでいう）スタックとタスクの違いがよくわからない
つまり、図にするとこういうことなんです（たぶん）

　タスク1　　タスク2　　タスク3
　--------------------------------
　| A-B-C | A'-B'-C'-D' | A''-B''
　--------------------------------
　　　　　　スタック

ここで、画面に表示されてるのは B''、
各タスクのルートアクティビティが A, A', A''
全体がスタック


ここまでで、用語はOK

説明を簡単にするために、
MyApp というアプリを仮定します。

MyApp は4個のアクティビティから構成されています。

　　　　　A : MainActivity
　　　　　　↓　　　　↓
B : SubActivity1　　　C : SubActivity2
　↓　　　　　　　　　　↑
D : SubSubActivity1 ------


← : startActivity() / startActivityForResult()


こんな感じ。ここで、MainActivity がルートアクティビティ
なのはわかりますよね。


"タスク内のアクティビティは、1 つのユニットとして一緒に移動します。
タスク全体（アクティビティスタック全体）をフォアグラウンドに移動したり、バックグラウンドに移動したりできます。"

これは、

　タスク1　　タスク2　　タスク3
　--------------------------------
　| A-B-C | A'-B'-C'-D' | A''-B''
　--------------------------------
　　　　　　スタック

の状態で、例えばホーム長押しでタスク2のアプリを開いたとすると、

　タスク1　タスク3　　タスク2
　--------------------------------
　| A-B-C | A''-B'' | A'-B'-C'-D'
　--------------------------------
　　　　　　スタック

になる、ということ（だと思います）

ただし、この動作はアクティビティを開始した Intent オブジェクトのフラグセットと、
マニフェストに指定されているアクティビティの <activity> 要素の属性セット
によって変更可能

そのための Intent フラグ としては

FLAG_ACTIVITY_NEW_TASK
FLAG_ACTIVITY_CLEAR_TOP
FLAG_ACTIVITY_RESET_TASK_IF_NEEDED
FLAG_ACTIVITY_SINGLE_TOP

主に使用する <activity> 属性は以下を使う

taskAffinity
launchMode
allowTaskReparenting
clearTaskOnLaunch
alwaysRetainTaskState
finishOnTaskLaunch



親和性と新しいタスク

まず、親和性ってなに？
。。。
原文をみると affinity

"デフォルトでは、アプリケーション内のすべてのアクティビティは相互に親和性があり、すべてのアクティビティができる限り同じタスクに属そうとします。"

ええと、つまり同じアプリから起動したアクティビティは同じタスクに
属するということですね。はい。

"ただし、 要素の taskAffinity 属性を使用して、アクティビティごとに個別の親和性を設定することもできます。"

つまり、標準なら

　タスク1　タスク3　　タスク2
　--------------------------------
　| A-B-C | A''-B'' | A'-B'-C'-D'
　--------------------------------
　　　　　　スタック

だけど、

　タスク1　タスク3　　タスク2
　　　　　　　　　　 ↓ ↓ ↓
　--------------------------------
　| A-B-C | A''-B'' | A'-B'-C'-D'
　--------------------------------
　　 　　　　　　　　　　　　　↑
　　　　　　　　　　　　　　タスク3

みたいにできるということかな。はい。

こうするための方法は2つ

1.　アクティビティを起動する Intent オブジェクトに
　　FLAG_ACTIVITY_NEW_TASK フラグを入れる

　　この場合だと、C'から D'を起動するときの Intent に
　　FLAG_ACTIVITY_NEW_TASK をセットする

2.　アクティビティの allowTaskReparenting 属性が
　　"true" に設定されている場合

　　この場合だと、AndroidManifest.xml の D' の <activity> タグに
　　allowTaskReparenting="true" をセットする

詳しくは親和性と新しいタスクのこの部分を見てください。



起動モード

これがわかりにくかった。というかややこしい。

launchMode 属性の 要素は、次の4種類

"standard"（デフォルト モード）
"singleTop"
"singleTask"
"singleInstance"

まとめてみた



*1　Intent オブジェクトに FLAG_ACTIVITY_NEW_TASK フラグが含まれている場合は、前のセクション親和性と新しいタスクで説明したとおり、別のタスクが選択

*2　複数のインスタンスを複数のタスクに割り当てることも、特定のタスクに同じアクティビティの複数のインスタンスを割り当てることも可能




スタックのクリア


"ユーザーがタスクを長時間放置すると、タスクのルート アクティビティを除くすべてのアクティビティがクリアされます。"

つまり

　タスク1　　タスク2　　タスク3
　--------------------------------
　| A-B-C | A'-B'-C'-D' | A''-B''
　--------------------------------
　　　　　　スタック

の状態で長時間放置すると

タスク1　 タスク2　　タスク3
　--------------------------------
　| A | A' | A''-B''
　--------------------------------
　　　　　　スタック

になる。これがデフォルト。
この動作を変更したい場合は、次のアクティビティ属性を使用する

alwaysRetainTaskState 属性
タスクのルート アクティビティでこの属性を "true" に設定すると、長時間経過しても、タスク内のすべてのアクティビティはそのまま残される。

つまり

　タスク1　　タスク2　　タスク3
　--------------------------------
　| A-B-C | A'-B'-C'-D' | A''-B''
　--------------------------------
　　　　　　スタック



clearTaskOnLaunch 属性
タスクのルート アクティビティでこの属性を "true" に設定した場合、ユーザーがいったんタスクを離れると、戻ったときにはルートを含むすべてのアクティビティがクリアされる。

つまり

　タスク3
　--------------------------------
　| A''-B''
　--------------------------------
　　　　　　スタック



finishOnTaskLaunch 属性
clearTaskOnLaunch 属性と似ているが、タスク全体ではなく単一のアクティビティに作用する。
また、ルート アクティビティを含むどのアクティビティもクリアの対象となりえる。
この属性が "true" に設定されたアクティビティは、現在のセッションの間のみタスクの一部を形成する。
ユーザーがいったんそのタスクから離れてから、再度タスクに戻ると、このアクティビティはクリアされている。

つまり、B にこの属性を設定すると、

　タスク1　　タスク2　　タスク3
　--------------------------------
　| A-C | A'-C'-D' | A''-B''
　--------------------------------
　　　　　　スタック



アクティビティをスタックから削除する他の方法

Intent オブジェクトに FLAG_ACTIVITY_CLEAR_TOP フラグが含まれている
　＋
そのインテントを処理すべきタイプのアクティビティのインスタンスが
対象タスクのスタック内に存在する
　↓　
そのインスタンスがスタックの最上位になってインテントに応答できるよう、
それより上位のアクティビティはすべてクリアされる


つまり、B'' が呼んだ Intent オブジェクトに FLAG_ACTIVITY_CLEAR_TOP が設定されていて、このインテントを処理するのが A' だとすると

　タスク1 　タスク2　　 タスク3
　--------------------------------
　| A-B-C | A'-B'-C'-D' | A''-B''
　--------------------------------
　　　　　　スタック

こうなる

　タスク1 　タスク3　　タスク2
　--------------------------------
　| A-B-C | A''-B'' | A'
　--------------------------------
　　　　　　スタック

タスク3がバックグラウンドに移動して、A'より上位のアクティビティ B', C', D' はクリアされる


指定されたアクティビティの起動モードが "standard"
　↓
そのアクティビティもスタックから削除され、
新しいインスタンスが起動してインテントを処理します。

つまり、
上記の場合、（B', C', D' は同じようにクリアされ）A' もクリアされて新しく A' のインスタンスが起動する


FLAG_ACTIVITY_CLEAR_TOP は、ほとんどの場合 FLAG_ACTIVITY_NEW_TASK と組み合わせて使用する
　↓
別のタスクに既に存在しているアクティビティを探し、それをインテントに応答できる位置に配置できる



タスクの開始

アクティビティをタスクのエントリ ポイントとして設定

アクションに "android.intent.action.MAIN"
カテゴリに　 "android.intent.category.LAUNCHER"

を指定したインテント フィルタをアクティビティに追加

このタイプのフィルタを追加すると、アクティビティのアイコンとラベルがアプリケーションランチャに表示される

アクティビティに MAIN と LAUNCHER フィルタが指定されている場合は、必ずタスクが開始される起動モード（"singleTask" または "singleInstance"）を使用する必要がある。


例えば、

インテントが "singleTask" アクティビティを起動し
　↓
新しいタスクが開始
　↓
ユーザーが作業
　↓
ユーザーが [ホーム] キーを押す
　↓
ホーム画面が表示＝先ほどのタスクはバックグラウンドに移動

もし、このフィルタを指定しなかったら、ユーザーがタスクに戻るための手段がない！
また、"standard" や "singleTop" を指定した場合アクティビティは複数回インスタンス可能なため、ここでランチャーから新しく起動した場合別のインスタンスが作成される可能性がある。

FLAG_ACTIVITY_NEW_TASK フラグを指定したアクティビティでは、新しいタスクを開始した後にユーザーが [ホーム] キーを押してそのタスクを離れた場合に、タスクに戻るための手段を用意しておく必要がある。

外部エンティティから呼び出すことのできるアクティビティでこのフラグが使用されている可能性がある場合は、開始されたタスクにユーザーが戻るための手段を別途提供する。

ユーザーがアクティビティに戻ることができるようにしない場合は、 要素の finishOnTaskLaunch を "true" に設定する

Android UI Design Tips

Android UI Design Tips
という資料があったので、日本語でまとめてみました。

Android UI Design Tips

View more presentations from Android Developers.

■ UIを意識すべきなのはどうして？
　　良いUI　
　　　→ ユーザーが洗練された質に気が付く
　　　　　→ 評価が良くなる
　　　　　　→ アプリのランキングが良くなる
　　　　　　　　→ さらにたくさんのインストール＆購入につながる

■ Agenda

　　1. やるべきことと、やっちゃいけないこと

　　2. デザイン哲学と考慮すること

　　3. 絶対に使うべき UI framework の機能・特徴

　　4. 新しい UI デザインパターン

　　5. アイコンとガイドライン



■ やるべきことと、やっちゃいけないこと

　＊ やっちゃいけないこと

　　・単に他のプラットフォームのUIを移植しない！
　　　　・ユーザーがプラットフォームとアプリが合っていると感じるべき
　　　　・アプリのブランドとプラットフォームとのバランス

　　・modal progress と確認用ダイアログを使い過ぎない！

　　・柔軟性を持つ！（absolute-positioned layout はダメ）

　　・px単位を使わない！（dp(dip)やspを使う）

　　・小さい文字はダメ！


　＊ やるべきこと

　　・すべてのリソースに対して、high density screen 用バージョンを用意する

　　・ボタンやリストアイテムなど、明らかにタップするものは大きくする

　　・Android のアイコンガイドラインにしたがう

　　・適切なマージン／パディングを使う

　　・D-pad とトラックボールをサポートする

　　・activity stack を適切に運用する

　　・orientation changes（画面回転）を適切に処理する

　　・theme/style, dimension, color resources を使用して
　　　冗長性を減らす

　　・visual and interaction designer(s) と一緒に仕事する!!!



■ デザイン哲学と考慮すること

　＊ Android デザイン哲学

　・ Clear vs. "simple"
　　　明確 vs シンプル

　・ Conetnt vs chrome
　　　内容 vs 外観のカスタマイズ

　・ Consistent yet engaging
　　　一貫性があり魅力的
　　　　- エレガントなバリエーション

　・ Enhanced by the cloud
　　　クラウドで機能強化
　　　　- ユーザー環境をデスクトップとモバイルで維持する


　＊ good interface design の原理

　　1. ユーザーにフォーカスする

　　2. 正しいものを可視化する

　　3. 適切なフィードバックを示す

　　4. 予測可能にする

　　5. fault-tolerant にする


　＊ ユーザーにフォーカスする

　　・自分のアプリのユーザーを知る
　　　　- 年齢・スキルレベル・文化・身体障害、などなど
　　　　- あなたのアプリで彼らが何をしたいのか？
　　　　- 彼らはどんな種類のデバイスを使うのか？
　　　　- どこで／いつ／どのように 彼らがそのデバイスをつかうのか？
　
　　・'user-first' mentality （ユーザーを第１に考えて）でデザインする

　　・実際のユーザーに早く／しばしばテストしてもらう


　＊ 正しいもの可視化する

　　・もっとも一般的な（頻繁に使われる）操作が、すぐ見えてすぐ操作できるべき
　　　　＝ 左上が一番目がいきやすい

　　・付属的な機能は MENU ボタンに割り当てることができる


　＊ 適切なフィードバックを示す

　　・ すべてのインタラクティブなUI要素は、少なくとも4個の状態
　　　（default, desabled focused, pressed など）を
　　　を使って持つようにする

　　・ 1つのアクションの効果は、明確に見える（＝わかる）ようにする

　　・ 控えめだけど十分なプログレスインジケータを表示する


　＊ 予測可能にする

　　・ ユーザーが期待することをする
　　　　- activity stack の適切な運用
　　　　- ユーザーが見ることを期待する情報とアクションを示す
　　　　（テストと観測が必要）

　　・ 適切なアフォーダンスを使う
　　　　- もしそれがクリック可能なら、クリック可能だとわかるようにする！！

　　＊＊　もし複雑な操作が必要ならば、デザインを考えなおすべき！　＊＊


　＊ fault-tolerant にする

　　・意味があるものだけ、操作可能にする
　　　　- UI要素を適切に Enable/Disable する

　　・不可逆的なアクションの数を制限する

　　・確認ダイアログは '使わない'('undo') ようにする
　　　　- 実際は、できるだけ少ない modal dialog を使う
　　　　　だって目障りだもん

　　"If an error is possible, someone will make it. "
　　　- Donald Norman, author, The Design of Everyday Things



　＊ デザインで考慮すること

　　・物理的なスクリーンサイズ
　　・解像度
　　・縦画面 ＆ 横画面
　　・主要なUIインタラクションメソッド
　　　　- タッチスクリーン
　　　　- Dパッド／トラックボール
　　・ソフト／ハードキーボード

　　・デバイスによって、方法が異なる可能性があるということに対する
　　　意識はすごく重要

　　・デバイスのUIバリエーションについてCDDを読んで学ぶ
　　　　- http://source.android/com/compatibility

　　・スクリーンサイズと解像度に対応する
　　　　- http://developer.android.com/resources/dashboard/screens.html



■ 絶対に使うべき UI framework の機能・特徴

　・<RelativeLayout>

　・１つの .apk にすべてのリソースを含む
　　　- drawable
　　　- drawable-hdpi
　　　- drawable-mdpi
　　　- layout
　　　- layout-port
　　　- layout-land
　　　- layout-large-land
　　　- layout-large-port

　　・システムが runtime時にどのリソースを使うか選択する

　・9-patch drawables (foo.9.png)
　　・CSS3 border-image に似てる
　　・border pixels が拡張可能な領域を示す
　　・ -mdpi と -hdpi バージョンを用意する！！

　・Selector (state list) drawables
　　・状態(state) （desabled, pressed, focused, default...）
　　　によってボタンの色や画像をかえる

　・Layer drawables (XML + PNGs)
　　　foo_border.9.png + foo_mask.9.png
　　　　　　　+ Drawable.setColorFilter(0xA4C639, ...);
　　　　　→ Rendered output (resizable w/9-patch)


■ 新しい UI デザインパターン

もともとは、Google I/O 2010 の Android UI design patterns で話された内容
http://code.google.com/events/io/2010/sessions/android-ui-design-patterns.html

　・Dashboard

　・Action Bar

　・Quick Actions

　Google I/O 2010 では、これに加えて

　・Search Bar

　・Companion Widget

　が紹介されている

　詳しくはこちら http://dl.google.com/googleio/2010/android-android-ui-design-patterns.pdf


　＊ Dashboard



　　"このアプリで何ができるのか？"
　　"新しくなったことはなにか？"

　　を表示

　　- Recommendations
　　　・ 3 - 6 個の重要なアプリセクションにフォーカス
　　　・ what's new にハイライトする
　　　・ Be flavorful （魅力的に！）ー ここが第一印象


　＊ Action Bar



　　"よく使うアクションをすばやく行う"
　　　・検索、リロードなど

　　- Recommendations
　　　・アプリのキーやアプリ全体のアクションを画面上にみせる
　　　・場所の感覚を伝えるのに役立つ
　　　・アプリ内で一貫して使う
　　　・'home'メカニズムを提供する - logo や 専用ボタン
　　　・状況に依存したアクションは使わない！！


　＊ Quick Actions



　　"このオブジェクトで何ができるのか？"


■ アイコンとガイドライン

　http://developer.android.com/quide/practices/ui_guidelines/icon_design.html

　新しいアイコンスタイル
　　・Tactile（触感）

　　・Rendered

　　・Forward Facing（正面向き）

　　・Top-lit（トップから照明）

　　・Synecdoche（提喩法、代喩：一部で全体を、
　　　または全体で一部を比喩で表現する方法）

　　・Diverse shapes, materials（さまざまな形状、質感）

Gadget1 に行ってきました

第2回ガジェットワンに行ってきました。
「Gadget1 R2 Bekkoame」

第１回が2月にあったのですが、この時はいけなくて今回リベンジ！
ということではりきって参加です。

場所はオラクル青山センター (http://www.oracle.com/lang/jp/corporate/aoyama.html)。
外苑前駅から直結です。

すごくきれいな会場で、空間も余裕があっていいです。

プログラムはこちら

展示もあります。

Ustream のアーカイブはこちらからたどれます


会場の様子（午前中）はこんな感じ
まだまだ空きがあります。
みんな午後から本気出すんですね。わかります。




なんと Android 女子部も展示をだしました！！





端末がいっぱいw （結局こーなってしまった）

なぜかセカイカメラのシールを配布



女子部員の個人アプリの紹介パネル
　　＆
女子部アプリ「ネイル・ド・ロンジョ」の紹介パネル



Xperia の裏蓋のデコサンプル
　＆
女子部デコ勉強会 8月28日（土）の紹介チラシ





やっぱりガンプラデコは大人気でした。



その他の展示ブースでは PLUS さんのプレゼン用ツール
（お絵描きボードみたいな感じ？）がおもしろかったです。
手元のボードにペンで書き込むと、プロジェクターで
映している画面上のパワポにお絵描きできます。
線をマーカーにしたり、○にしたりできました。
ボード上の全面にドットパターンの模様があって、これを
カメラがついたペンで認識しているそうです。
ボードに電池がいらないので、軽くて使いやすかったです。

めぐさんがモグタソを書きまくってましたw




他にも、

ネットブックに電子コンパスを内蔵した展示




Corona のデモ




BeatCraft さんの評価ボード






午後は人が増えてこんな感じに





女子部ブースにずっといたので、ほとんど講演を聞けなかったのですが、
LTはがっつり見ました。5分間なので、みんなの焦りが。。。
トークがうまいのはいいですね。たくさん笑わせていただきました。



「Gadget1 R2 ガジェットカフェでソーシャル電子工作を始めよう！」の資料が公開されてました。


＃ ドラは奥が深いっす



帰りはサーバーを横目に。




次回はなんと大阪です！
11月5日-6日、Gadget1 R3 Chitoseame！KOF2010にて開催！


＃　当日はこんな感じでした by めぐ画伯