そんなfindViewByIdで大丈夫?ButterKnifeを使ってコードをキレイにする方法

投稿日:2017年11月3日 更新日:

Androidアプリ開発に入門したら必ず通る道であり、またダルいものNo.1といえばfindViewByIdですね。ビューが少ないうちは気になりませんが、多くのビューを扱う時のダルさは異常です。

今日は、そんなfindViewByIdをスッキリさせることができるオープンソースのライブラリ「ButterKnife(バターナイフ)」の使い方を解説していきたいと思います。

このButterKnife。最近は諸事情により出番が少なくなったライブラリですが、Androidアプリ開発に入門したばかりでも使いやすいライブラリだと思いますし、僕はとても好きです!

ButterKnifeの導入

早速、ButterKnifeをプロジェクトに追加して、使っていきましょう。

まずはおなじみ、app/build.gradleのdependenciesに2行ほど記載してプロジェクトにButterKnifeを追加します。Android Studioのプロジェクトには、プロジェクトのbuild.gradleとアプリのbuild.gradleがあるから間違えないように気をつけましょう。

dependencies {
    //ButterKnife
    compile 'com.jakewharton:butterknife:8.8.1'
    annotationProcessor 'com.jakewharton:butterknife-compiler:8.8.1'
}

バージョン番号は公式サイトで確認しておきましょう。公式サイトは以下のURLです。

Butter Knife

DataBindingを使ってみる

findViewByIdを使ってビューの取得を普通に書くとこんな感じになります。

public class MainActivity extends AppCompatActivity {

    private TextView textView1;
    private TextView textView2;
    private TextView textView3;
    private TextView textView4;
    private TextView textView5;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        textView1 = findViewById(R.id.textView1);
        textView2 = findViewById(R.id.textView2);
        textView3 = findViewById(R.id.textView3);
        textView4 = findViewById(R.id.textView4);
        textView5 = findViewById(R.id.textView5);
    }
}

こんなfindViewByIdはダルすぎますね。今はViewが5個だからこんなもんで済んでいますが、これが増えていくと加速度的にダルくなって良くありません。このダルいfindViewByIdをButterKnifeでキレイにしていきます。それが以下のコードです。

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.textView1) TextView textView1;
    @BindView(R.id.textView2) TextView textView2;
    @BindView(R.id.textView3) TextView textView3;
    @BindView(R.id.textView4) TextView textView4;
    @BindView(R.id.textView5) TextView textView5;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ButterKnife.bind(this);
    }
}

だいぶいい感じになりました。ポイントは、@BindViewでidを指定すること、onCreateなどでButterKnife.bind(this)としてビューをバインドすることです。逆に言えば、ButterKnifeを使えば、これだけでfindViewByIdの処理をまとめることができます。すばらです!

ButtonのonClickイベントをバインドする

Androidアプリ開発入門の二大害悪と言えばfindViewByIdsetOnClickListenerですね(異論は認めます)。findViewByIdはやっつけたので、次はsetOnClickListenerもButterKnifeでやっつけてみましょう。

まずは普通にsetOnClickListenerを書いた場合です。こんな感じのコードになるのではないでしょうか。

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Button button = findViewById(R.id.button);
    button.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            //do something here
        }
    });
}

やりたいことはButtonのクリックイベントを拾うだけなのに、コード量がやたら多いような気がしますね。Buttonの数が増えてきたらひどいことになりそうです。ButterKnifeを使って、このsetOnClickListenerをキレイに書いてみましょう。

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    ButterKnife.bind(this);
}

@OnClick(R.id.button)
void buttonClick() {
    //do something here
}

こうなります。onCreateなどでズラズラと書いていたsetOnClickListenerの処理を丸々外に出すことができますし、コードの量も減りました。ポイントは、@OnClickアノテーションを使ってビューとイベントをバインドしている点です。

これだけで、setOnClickListenerをキレイにすることができます!ButterKnife、便利ですね!

まとめ

Androidアプリ開発入門の二大害悪、findViewByIdsetOnClickListenerをやっつけてキレイにしてくれるオープンソースのライブラリ「ButterKnife」の使い方を見てきました。

簡単に導入できて、お手軽にコードをキレイにしてくれる、とってもいい感じのライブラリです!findViewByIdsetOnClickListenerが増えてコードが見づらくなってきたら、導入を考えてみてくださいね!

茨城県つくば市在住のAndroidアプリエンジニアです。

-Android

Copyright© Androidアプリ開発@つくば , 2017 AllRights Reserved Powered by AFFINGER4.