AndroidのViewの中でも頻出かつクセのある ListView関連のTips集Vol.4-1
今回はAndroidの神、Jake Whartonさんの開発されたButterKnife
をListViewで使ってみたいと思います。(全3回!)
もちろん、ListViewに限らず幅広く使えます!!
はじめに
■ Jake Whartonってどなた?
はい、この人です。
Squareにも所属する スーパーAndroidエンジニアで、数多くの有名なライブラリ()を開発されています。
ありがとうございます!!!!
ぜひGitHubをフォローしてみてください!
■ ButterKnifeって?
簡単に言うと、
アノテーション(@なんちゃら)だけでViewの(ほぼ)全てを片付けよう!
という夢のようなライブラリです。
タイトルの通り、
- findViewById
- OnClick
- OnItemSelected
- OnCheckedChanged
- ...
などなど、Viewに関する実装が簡単にできるようになっています。
本家サイトも是非参考にしてください。
Butter Knife - GitHub
Butter Knife 本家サイト
■ 注意!!
今回紹介するのは バージョン7.0.1です。
バージョン6からのアップデートで、宣言など大幅に変わっているので、インストールしているバージョンを確認してください。
ライブラリの登録
build.gradle.xml
に以下を追加しましょう。
compile 'com.jakewharton:butterknife:7.0.1'
ネットに接続した状態で、一度Buildをするのも忘れずに。
簡単な使用方法
まずは、ButterKnife
を使うことで、実装がどう変わるかを見てみましょう。
完成イメージはこんな感じです。
(ボタンクリックでテキストが更新される簡単なサンプルアプリです)
■ 共通レイアウト
layoutファイルは共通です。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="click me" />
</LinearLayout>
それでは、MainActivity
がどのように変わるのか見てみましょう。
■ これまでの実装
いつもの通りですね。
// Clickリスナーをimplementsする(もちろん他のやり方でもOK!)
public class MainActivity extends Activity implements View.OnClickListener{
private TextView mTextView;
private Button mButton;
private int mClickCounter = 0;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// IDバインドをする
mTextView = (TextView) findViewById(R.id.textview);
mButton = (Button) findViewById(R.id.button);
// Clickリスナーをセット
mButton.setOnClickListener(this);
}
@Override
public void onClick(View v) {
mClickCounter++;
mTextView.setText(mClickCounter + " times clicked!");
}
}
これがどう変わるかと言うと。。。
■ ButterKnife
を使った実装
こうなります。
public class MainActivity extends Activity {
// アノテーション付きでViewを定義する
@Bind(R.id.textview)
TextView mTextView;
@Bind(R.id.button)
Button mButton;
private int mClickCounter = 0;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// これがいつもの「findViewById」の代わりになる!
ButterKnife.bind(this);
}
@OnClick(R.id.button)
void onClick(View view) {
mClickCounter++;
mTextView.setText(mClickCounter + " times clicked!");
}
}
今回はViewが2つでしたが、これが何十個となると、findViewByIdの嵐になります。
それがこのButterKnife
を使うとButterKnife.bind(Activity target)
一発で済むわけです!
その他の基本的な注意点
■ Fragmentでの使用
Fragmentで使う場合には以下のコードをonDestroyView()
に追加する必要があります。
@Override
public void onDestroyView() {
super.onDestroyView();
ButterKnife.unbind(this);
}
■ アップデートにおける簡易対応表
今回ご紹介した内容だけでもバージョン7とそれ以前で大幅に変更があります。
非常に大事な部分だけ抜粋しておきます。
v7以前 | v7.0.1 |
---|---|
@InjectView | @Bind |
ButterKnife.inject(Activity target) | ButterKnife.bind(Activity target) |
ButterKnife.reset(Activity target) | ButterKnife.unbind(Activity target) |
■ タイトルの(仮)って?
説明が遅くなりましたが、このButterKnife
は全てのViewに完全に対応しているわけではありません。
とはいえ、Jake Whartonさんのことなので、いずれは完全対応になると信じています!
この祈りを込めて、今はまだ(仮)です。笑
次回以降について
次回は、ListViewにおけるButterKnife
の使い方を見ていきます。
最終回はButterKnife
のよりカスタムな使い方をご紹介する予定です。
ぜひご覧ください!!よろしくお願いいたします!!
ListView Tips集
- 【ListView Tips Vo.1】ListViewの子要素(アイテム)のClickがおかしくなる 〜主な原因と対処法〜
- 【ListView Tips Vol.2】忙しい人のためのStickyListHeadersListViewの使い方 〜基本編〜
- 【ListView Tips Vol.3】ListViewでアイテムアニメーションしよう! 〜View.startAnimationに関する考察〜
- 【ListView Tips Vol.4-1】ButterKnifeで効率よくIDバインドする 〜findViewByIdもOnClickも、もういらない(仮)〜