【ListView Tips Vol.4-1】ButterKnifeで効率よくIDバインドする 〜findViewByIdもOnClickも、もういらない（仮）〜


AndroidのViewの中でも頻出かつクセのある **ListView**関連のTips集Vol.4-1

今回はAndroidの神、Jake Whartonさんの開発された`ButterKnife`をListViewで使ってみたいと思います。（全3回！）
もちろん、ListViewに限らず幅広く使えます！！

## はじめに
#### ■ Jake Whartonってどなた？
はい、この人です。

[Jake Wharton - GitHub](https://github.com/JakeWharton)

Squareにも所属する **スーパーAndroidエンジニア**で、数多くの有名なライブラリ（）を開発されています。
ありがとうございます！！！！
ぜひGitHubをフォローしてみてください！
<br>

#### ■ ButterKnifeって？
簡単に言うと、

**アノテーション（@なんちゃら）だけでViewの（ほぼ）全てを片付けよう！**

という夢のようなライブラリです。
タイトルの通り、

* findViewById
* OnClick
* OnItemSelected
* OnCheckedChanged
* ...

などなど、Viewに関する実装が簡単にできるようになっています。

本家サイトも是非参考にしてください。

[Butter Knife - GitHub](http://github.com/JakeWharton/butterknife)
[Butter Knife 本家サイト](http://jakewharton.github.io/butterknife/)

#### ■ 注意！！
今回紹介するのは **バージョン7.0.1**です。
バージョン6からのアップデートで、宣言など大幅に変わっているので、インストールしているバージョンを確認してください。
<br>

## ライブラリの登録

`build.gradle.xml`に以下を追加しましょう。

``` build.gradle.xml
compile 'com.jakewharton:butterknife:7.0.1'
```

ネットに接続した状態で、一度Buildをするのも忘れずに。
<br>

## 簡単な使用方法
まずは、`ButterKnife`を使うことで、実装がどう変わるかを見てみましょう。
完成イメージはこんな感じです。
（ボタンクリックでテキストが更新される簡単なサンプルアプリです）

![click_me_button](https://i.gyazo.com/31a2c2326722f11edc81e84a7eaf852e.gif)
<br>

#### ■ 共通レイアウト
layoutファイルは共通です。

``` activity_main.xml
<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`がどのように変わるのか見てみましょう。
<br>

#### ■ これまでの実装
いつもの通りですね。

``` MainActivity.java
// 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!");
    }
}
```

これがどう変わるかと言うと。。。
<br>

#### ■ `ButterKnife`を使った実装
こうなります。

```MainActivity.java
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)`一発で済むわけです！
<br>

## その他の基本的な注意点
#### ■ Fragmentでの使用
Fragmentで使う場合には以下のコードを`onDestroyView()`に追加する必要があります。

```MainFragment.java
@Override
public void onDestroyView() {
    super.onDestroyView();
    ButterKnife.unbind(this);
}
```

<br>

#### ■ アップデートにおける簡易対応表
今回ご紹介した内容だけでもバージョン7とそれ以前で大幅に変更があります。
非常に大事な部分だけ抜粋しておきます。

|v7以前|v7.0.1|
|:-:|:-:|
|@InjectView|@Bind|
|ButterKnife.inject(Activity target)|ButterKnife.bind(Activity target)|
|ButterKnife.reset(Activity target)|ButterKnife.unbind(Activity target)|

<br>

#### ■ タイトルの（仮）って？
説明が遅くなりましたが、この`ButterKnife`は全てのViewに完全に対応しているわけではありません。
とはいえ、Jake Whartonさんのことなので、いずれは完全対応になると信じています！
この祈りを込めて、今はまだ（仮）です。笑
<br>

## 次回以降について
次回は、ListViewにおける`ButterKnife`の使い方を見ていきます。
最終回は`ButterKnife`のよりカスタムな使い方をご紹介する予定です。
ぜひご覧ください！！よろしくお願いいたします！！
<br>


## ListView Tips集

* [【ListView Tips Vo.1】ListViewの子要素（アイテム）のClickがおかしくなる 〜主な原因と対処法〜](http://qiita.com/taisho/items/44dfd83e19dc16b9a831)
* [【ListView Tips Vol.2】忙しい人のためのStickyListHeadersListViewの使い方 〜基本編〜](http://qiita.com/taisho/items/84fe76a79eb8c507764d)
* [【ListView Tips Vol.3】ListViewでアイテムアニメーションしよう！ 〜View.startAnimationに関する考察〜](http://qiita.com/taisho/items/efdc04099ced5692dd1c)
* 【ListView Tips Vol.4-1】ButterKnifeで効率よくIDバインドする 〜findViewByIdもOnClickも、もういらない（仮）〜