tsurutanのつぶやき

備忘録としてつぶやきます

ButterKnifeを使ってコードを綺麗にしよう

ButterKnifeとは

Android界で神と崇められているJake Warton氏が作成したView Injectionライブラリー。 普段AndroidではViewをbindするときに

TextView text = (TextView) findById(R.id.text_view);

としていたがButterKnifeを使えばこのようなコードを書かずにアノテーションで処理ができてしまう素晴らしいライブラリーなのだ。

使い方

メンバー変数を書くところにアノテーション@BindViewを、その横にviewのidを書くことでviewに紐付けることができる。そしてそのあとにViewの型と変数名を書けば出来上がり。 なんて簡単なんだ!! ただし気をつけて欲しいのはActivityでButterKnifeを使うときはButterKnife.bind(this)でActivityを指定しなければならない。

Before

class ExampleActivity extends Activity {
  private TextView title;
  private TextView subtitle;
  private TextView footer;

  @Override public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.simple_activity);
    title = (TextView) findById(R.id.title);
    subtitle = (TextView) findById(R.id.subtitle);
    footer = (TextView) findById(R.id.footer);
  }
}

After

class ExampleActivity extends Activity {
  @BindView(R.id.title) TextView title;
  @BindView(R.id.subtitle) TextView subtitle;
  @BindView(R.id.footer) TextView footer;

  @Override public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.simple_activity);
    ButterKnife.bind(this);
  }
}

またButterKnifeの凄いところはViewだけではなくcolorやstringなどのリソースもBindできるのだ! Viewと同じように@BindStringなどのアノテーションを書き、Idを指定すればはい出来上がり!

class ExampleActivity extends Activity {
  @BindString(R.string.title) String title;
  @BindDrawable(R.drawable.graphic) Drawable graphic;
  @BindColor(R.color.red) int red; // int or ColorStateList field
  @BindDimen(R.dimen.spacer) Float spacer; // int (for pixel size) or float (for exact value) field
  // ...
}

またAcitivty以外のクラスでButterKnifeを使いたい場合はButterKnife.bind(this, view)のようにする必要がある。

public class FancyFragment extends Fragment {
  @BindView(R.id.button1) Button button1;
  @BindView(R.id.button2) Button button2;

  @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fancy_fragment, container, false);
    ButterKnife.bind(this, view);
    // TODO Use fields...
    return view;
  }
}

AdapterのViewHolderでViewをBindするには下記のようにすれば良い。

public class MyAdapter extends BaseAdapter {
  @Override public View getView(int position, View view, ViewGroup parent) {
    ViewHolder holder;
    if (view != null) {
      holder = (ViewHolder) view.getTag();
    } else {
      view = inflater.inflate(R.layout.whatever, parent, false);
      holder = new ViewHolder(view);
      view.setTag(holder);
    }

    holder.name.setText("John Doe");
    // etc...

    return view;
  }

  static class ViewHolder {
    @BindView(R.id.title) TextView name;
    @BindView(R.id.job_title) TextView jobTitle;

    public ViewHolder(View view) {
      ButterKnife.bind(this, view);
    }
  }
}

さらにButterKnifeを使えばclickイベントもアノテーションを使い処理することができる!

@OnClick(R.id.submit)
public void submit(View view) {
  // TODO submit data to server...
}
All arguments to the listener method are optional.

@OnClick(R.id.submit)
public void submit() {
  // TODO submit data to server...
}
Define a specific type and it will automatically be cast.

@OnClick(R.id.submit)
public void sayHi(Button button) {
  button.setText("Hello!");
}
Specify multiple IDs in a single binding for common event handling.

@OnClick({ R.id.door1, R.id.door2, R.id.door3 })
public void pickDoor(DoorView door) {
  if (door.hasPrizeBehind()) {
    Toast.makeText(this, "You win!", LENGTH_SHORT).show();
  } else {
    Toast.makeText(this, "Try again", LENGTH_SHORT).show();
  }
}
Custom views can bind to their own listeners by not specifying an ID.

public class FancyButton extends Button {
  @OnClick
  public void onClick() {
    // TODO do something!
  }
}

などなどButterKnifeには使える機能がいっぱい!!

どうやったら使えるの?

Android Studioを使っている方はapp直下にあるgradleファイルに

compile 'com.jakewharton:butterknife:8.0.1'

と書くだけです。とても簡単ですね!

合わせて読みたい記事

www.tsurutan.com

www.tsurutan.com

www.tsurutan.com

超初心者でも大丈夫! はじめてのAndroidプログラミング Android Studio 2対応

超初心者でも大丈夫! はじめてのAndroidプログラミング Android Studio 2対応