What is ButterKnife?

By | January 13, 2018

What is ButterKnife?

Its a kind of view injection in Activities or Fragments using Annotations.

Butterknife can be used to

1. Bind Views
2. Bind Clicks
3. Can be used with resources like strings, colors, Dimens, Drawables etc.

Below are the annotations available

AnnotationDescription

@BindView Binds view object. TextView, Button, Spinner or any view object
@BindView(R.id.logo)
ImageView imgLogo;
@BindViews Binds array of views into List
@BindViews({R.id.lbl_name, R.id.lbl_email, R.id.lbl_address})
List lblArray;
@BindDrawable Binds drawable element. Loads the drawable image from res folder
@BindDrawable(R.mipmap.ic_launcher)
Drawable drawableLogo;
@BindString Binds string resource
@BindString(R.string.app_name)
String appName;
@BindColor Binds color resource
@BindColor(R.color.colorPrimaryDark)
int colorTitle;
@BindDimen Binds dimen resource
@BindDimen(R.id.padding_hori)
float paddingHorizontal;
@BindAnim Binds animation from anim resource
@BindAnim(R.anim.move_up)
Animation animMoveUp;
@BindBitmap Binds bitmap object.
@BindBitmap(R.mipmap.ic_launcher)
Bitmap logo;
@BindFont Binds font resource
@BindViews({R.id.lbl_name, R.id.lbl_email, R.id.lbl_address})
List lblArray;
@BindFloat Binds float value
@BindFloat(R.dimen.radius)
float radius;
@BindInt Binds int resource
@BindInt(R.integer.distance)
int distance;

Code

Let’s start with the build.gradle
Add below code in the dependencies.

compile 'com.jakewharton:butterknife:8.8.1'
annotationProcessor 'com.jakewharton:butterknife-compiler:8.8.1'


Example

Lets take an example of Activity

Layout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="20dp">

    <TextView
        android:id="@+id/tvTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello" />

    <EditText
        android:id="@+id/edName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/btnClick"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Click Me" />

    <ImageView
        android:id="@+id/imgView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />


    <TextView
        android:id="@+id/tvTitle1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello" />


    <TextView
        android:id="@+id/tvTitle2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello" />


    <TextView
        android:id="@+id/tvTitle3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello" />
</LinearLayout>


MainActivity

package butterknife_demo.coderzheaven.com.butterknifedemo;

import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

import java.util.List;

import butterknife.BindColor;
import butterknife.BindDrawable;
import butterknife.BindView;
import butterknife.BindViews;
import butterknife.ButterKnife;
import butterknife.OnClick;

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.tvTitle)
    TextView tvTitle;

    @BindView(R.id.edName)
    EditText edName;

    @BindView(R.id.imgView)
    ImageView imgView;

    @BindDrawable(R.mipmap.ic_launcher)
    Drawable drawableLogo;

    @BindColor(R.color.colorPrimaryDark)
    int colorTitle;

    @BindViews({R.id.tvTitle1, R.id.tvTitle2, R.id.tvTitle3})
    List<TextView> tvTitleArray;

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

        tvTitle.setTextColor(colorTitle);

        imgView.setImageDrawable(drawableLogo);

        final String[] tvText = new String[]{"Hello", "Coderz", "Heaven"};

        ButterKnife.Action<TextView> texts = new ButterKnife.Action<TextView>() {
            @Override
            public void apply(TextView view, int index) {
                view.setText(tvText[index]);
            }
        };

        // setting text to array of textviews
        ButterKnife.apply(tvTitleArray, texts);
    }

    @OnClick(R.id.btnClick)
    public void onButtonClick(View view) {
        Toast.makeText(getApplicationContext(), "Name : " + edName.getText().toString(),
                Toast.LENGTH_SHORT).show();
    }
}

Fragment

If this is a fragment, then the code will change like this

public class MyFragment extends Fragment {
 
    Unbinder unbinder;
 
    @BindView(R.id.txtName)
    TextView txtName;
 
    @BindView(R.id.btnEnter)
    Button btnEnter;
 
    @BindView(R.id.edName)
    EditText edName;
 
    public MyFragment() {
    }
 
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
 
    }
 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View view = inflater.inflate(R.layout.my_frag_layout, container, false);
 
        // bind view using butter knife
        unbinder = ButterKnife.bind(this, view);
 
        return view;
    }
 
    @Override
    public void onDestroyView() {
        super.onDestroyView();
        unbinder.unbind();
    }
}

Leave a Reply

Your email address will not be published. Required fields are marked *