8
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

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

Last updated at Posted at 2015-08-18

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

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

はじめに

■ Jake Whartonってどなた?

はい、この人です。

Jake Wharton - GitHub

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

■ ButterKnifeって?

簡単に言うと、

アノテーション(@なんちゃら)だけでViewの(ほぼ)全てを片付けよう!

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

  • findViewById
  • OnClick
  • OnItemSelected
  • OnCheckedChanged
  • ...

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

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

Butter Knife - GitHub
Butter Knife 本家サイト

■ 注意!!

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

ライブラリの登録

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

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

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

簡単な使用方法

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

click_me_button

■ 共通レイアウト

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

■ これまでの実装

いつもの通りですね。

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!");
    }
}

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

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)一発で済むわけです!

その他の基本的な注意点

■ Fragmentでの使用

Fragmentで使う場合には以下のコードをonDestroyView()に追加する必要があります。

MainFragment.java
@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集

8
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?