Advertisement
  1. Code
  2. Android SDK
Code

Quick Tip: Using Butter Knife to Inject Views on Android

by
Difficulty:BeginnerLength:ShortLanguages:

In this quick tip, you'll learn how to integrate the Butter Knife library in your projects to easily instantiate the views in your layout in your application's code.

Introduction

In every Android application, you have to use the findViewById() method for each view in the layout that you want to use in your application's code. But as applications' designs get more complex layouts, the call to this method becomes repetitive and this is where the Butter Knife library comes in.

The Butter Knife library, developer and maintained by Jake Wharton (Square Inc.), has annotations that help developers to instantiate the views from our activity or fragment. It also has annotations to handle events like onClick()onLongClick(), etc.

In the sample project of this tutorial, you can see a sample application with one activity and one fragment with an implementation using the Butter Knife library and a regular implementation. Let's explore the steps involved to integrate the Butter Knife library.

1. Using the Butter Knife Library

Step 1: Add the Dependency

Add the following dependency to the project's build.gradle file:

Next, synchronize your project with this file by pressing the synchronize button.

Press the button to sync the project with the grade files

Step 2: Use the Annotations

In every activity or fragment, you have to remove, or comment out, every call of the findViewById() method and add the @InjectView annotation before the declaration of the variable, indicating the identifier of the view.

Step 3: Inject Views

In the onCreate() method of the activity, before using any the views, call inject on the Butterknife object.

If you are using fragments, you have to specify the source of the views in the onCreateView() method as shown below.

You can now start using the views in your application's code. Butter Knife will handle the instantiation of every single view for you.

That is all you have to do to use the Butter Knife library in an activity or fragment.In the next section, I'll show you how to use the Butter Knife library for using list views.

2. Using the Butter Knife Library with List Views

The ListView class is a special case to implement, because you instantiate the views inside an adapter. To integrate the Butter Knife library in a list view, you first have to create the custom layout for the items in the list view. I'm going to name mine list_view_item and add the following layout:

In this simple layout, we're going to show an image and some text. Next, we need to create the adapter for the list view. Let's name it ListViewAdapter.

Inside the adapter class, there's a static class called ViewHolder to keep it in order. We're going to use this class to contain the views. Let's implement the ViewHolder class as follows:

All we have to do now is modify the getView() method as follows:

In this method, I'm inflating the custom layout inside the view variable and use it to create an object of the ViewHolder class. Note that we're using the Picasso class to load remote images and populate the text view with some text. You may find the Picasso tutorial useful if you want to get more familiar with this library.

Don't forget to add the android.permission.Internet permission in the Android manifest. If you don't, Picasso won't be able to connect to the web and load the remote images.

Finally, all you have to do is to instantiate the list view and attach the adapter. I'm going to do this inside a new activity, ListViewActivity, as shown below. You can see an example of this implementation in the source files of this tutorial.

3. Events

You can use Butter Knife's annotations for events too. Choose the annotation you want to use, according to the event you want to respond, and put it before the method you want to execute when the event happens.

Conclusion

You can use Butter Knife inject() method anywhere you would otherwise use the findViewById() method to save time and avoid code repetition when you have to instantiate the views in the layout. Feel free to share this quick-tip if you found it helpful.

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.