Butter Knife is a popular open-source library for Android that helps to reduce the amount of boilerplate code needed for view binding in an Android application. It allows developers to bind views and perform listener callbacks without the need for explicit calls to findViewById() and setOnClickListener() methods. Using Butter Knife, you can bind views and perform actions using annotations. For example, to bind a TextView with the id “my_text_view” and set its text. Butter Knife also supports binding event listeners using the @OnClick, @OnLongClick, @OnEditorAction, etc. annotations. It also supports binding resources such as strings and dimensions using the @BindString, @BindDimen, etc. annotations. Butter Knife is widely used in android development to simplify the code and improve readability. It is more efficient than traditional view binding and it is a must-have library for android developers.
General Syntax of Butter Knife in Java and Kotlin
Kotlin
class MainActivity : AppCompatActivity() { @BindView (R.id.my_text_view) lateinit var myTextView: TextView @BindView (R.id.my_button) lateinit var myButton: Button override fun onCreate(savedInstanceState: Bundle?) { super .onCreate(savedInstanceState) setContentView(R.layout.activity_main) ButterKnife.bind( this ) myTextView.text = "Hello, Butter Knife!" } @OnClick (R.id.my_button) fun onButtonClicked() { myTextView.text = "Button was clicked!" } } |
Java
public class MainActivity extends AppCompatActivity { @BindView (R.id.my_text_view) TextView myTextView; @BindView (R.id.my_button) Button myButton; @Override public void onCreate(Bundle savedInstanceState) { super .onCreate(savedInstanceState); setContentView(R.layout.activity_main); ButterKnife.bind( this ); myTextView.setText( "Hello, Butter Knife!" ); } @OnClick (R.id.my_button) public void onButtonClicked() { myTextView.setText( "Button was clicked!" ); } } |
In the example above,
- We use the @BindView annotation to bind the TextView and Button views in the layout with variables in the MainActivity class. The @OnClick annotation is used to set a click listener on the button and specify the method to be called when the button is clicked.
- When the button is clicked, the onButtonClicked() method will be called, and it will change the text of the TextView to “Button was clicked!”.
- Butter Knife’s annotations are processed at compile-time, so it does not affect the application’s performance. It makes the code more readable and less verbose by eliminating the need to use findViewById() and setOnClickListener() methods.
Butter Knife is a popular open-source library for Android that helps to simplify view binding and listener callbacks in an Android application. It uses annotations to bind views and perform actions on them, making the code more readable and less verbose. It also supports binding event listeners, resources such as strings, and dimensions. It is widely used in android development and it is a must-have library for android developers. Butter Knife’s annotations are processed at compile-time and do not affect the application’s performance. It helps to improve the readability and maintainability of the code.
Note: This Android article is covered in both Java and Kotlin programming languages.
Step-by-Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio.
Step 2: Adding Dependency to the build.gradle File
Go to Module build.gradle file and add this dependency and click on Sync Now button.
implementation 'com.jakewharton:butterknife:10.2.3' annotationProcessor 'com.jakewharton:butterknife-compiler:10.2.3'
Step 3: Working with the activity_main.xml file
Navigate to app > res > layout > activity_main.xml and add the below code to it. Comments are added in the code to get to know in detail.
XML
<? xml version = "1.0" encoding = "utf-8" ?> <!-- Root layout using ConstraintLayout --> < androidx.constraintlayout.widget.ConstraintLayout android:layout_width = "match_parent" android:layout_height = "match_parent" android:orientation = "vertical" > <!-- Button with onClick attribute to call changeText method --> < Button android:id = "@+id/change_text" android:layout_width = "wrap_content" android:layout_height = "wrap_content" android:onClick = "changeText" android:text = "Change Text" app:layout_constraintBottom_toBottomOf = "parent" app:layout_constraintEnd_toEndOf = "parent" app:layout_constraintStart_toStartOf = "parent" app:layout_constraintTop_toTopOf = "parent" /> <!-- TextView displaying "GeeksForGeeks App" --> < TextView android:id = "@+id/text_view" android:layout_width = "wrap_content" android:layout_height = "wrap_content" android:text = "GeeksForGeeks App" app:layout_constraintBottom_toTopOf = "@+id/change_text" app:layout_constraintEnd_toEndOf = "parent" app:layout_constraintStart_toStartOf = "parent" app:layout_constraintTop_toTopOf = "parent" /> </ androidx.constraintlayout.widget.ConstraintLayout > |
Step 4: Working with the MainActivity file
Navigate to app > java > your app’s package name > MainActivity file and add the below code to it. Comments are added in the code to get to know it in detail.
Kotlin
import android.os.Bundle import android.widget.Button import android.widget.TextView import androidx.appcompat.app.AppCompatActivity import butterknife.BindView import butterknife.ButterKnife import butterknife.OnClick class MainActivity : AppCompatActivity() { // Bind button to variable // using ButterKnife library @BindView (R.id.change_text) lateinit var button: Button // Bind text view to variable // using ButterKnife library @BindView (R.id.text_view) lateinit var textView: TextView override fun onCreate(savedInstanceState: Bundle?) { super .onCreate(savedInstanceState) // Set the content view to the layout // defined in R.layout.activity_main setContentView(R.layout.activity_main) // Bind views to variables // using ButterKnife library ButterKnife.bind( this ) } // Define function to be // called when button is clicked @OnClick (R.id.change_text) fun changeText() { // Set text of textView // to "Did something change?" textView.text = "Did something change?" } } |
Java
import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.TextView; import androidx.appcompat.app.AppCompatActivity; import butterknife.BindView; import butterknife.ButterKnife; import butterknife.OnClick; // MainActivity is the main class for the app's UI public class MainActivity extends AppCompatActivity { // Binds the button in the layout // with the id "change_text" to this variable @BindView (R.id.change_text) Button button; // Binds the textView in the layout // with the id "text_view" to this variable @BindView (R.id.text_view) TextView textView; @Override protected void onCreate(Bundle savedInstanceState) { super .onCreate(savedInstanceState); setContentView(R.layout.activity_main); // Binds the views in the layout // to the variables using ButterKnife ButterKnife.bind( this ); } // Sets a click listener on the button @OnClick (R.id.change_text) public void changeText(View view) { // Changes the text of the textView // when the button is clicked textView.setText( "Did something change?" ); } } |