Android Binding View

Hey Guys, Welcome back to My Story :) … and today I’ll tell you a little bit about android binding view

What is Binding View ???

Sometimes, when we’re developing the Android Application. We’ll face the same problem, like preparing the “boilerplate” of code to initialize our view that has been define in our activity/fragment xml. Today, there’s a lot of library that helped us to reduce that “boilerplate” :)

In this article, I’ll tell you a bit more about how to Binding View/Field using ButterKnife

So, the first step is … of course, prepare the dependencies for that :) , add this dependencies in your root gradle file

dependencies {
    classpath 'com.neenbedankt.gradle.plugins:android-apt:1.8'
}

After that, apply that plugin in your build.gradle file inside the application module

apply plugin: 'com.neenbedankt.android-apt'

Last things is to add the ButterKnife dependencies inside the same build.gradle file

dependencies {
    compile 'com.jakewharton:butterknife:8.5.1'
    apt 'com.jakewharton:butterknife-compiler:8.5.1'
}

Yup, this is it. You’ve just add the ButterKnife as your binding view library :) … Let’s start with some example application here. I’m trying to make a simple app that only include 1 edittext and 1 button

First, let’s make the layout … just called it the activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/colorPrimary"
                tools:context="com.baculsoft.sample.butterknife.MainActivity"
                tools:targetApi="LOLLIPOP">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="@color/colorAccent"
        android:elevation="4dp"
        app:theme="@style/AppTheme.Toolbar" />

    <EditText
        android:id="@+id/et_main_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/toolbar_main"
        android:layout_margin="8dp"
        android:hint="@string/hint_name"
        android:inputType="text"
        android:padding="8dp"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="16sp" />

    <Button
        android:id="@+id/btn_main_click"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_margin="16dp"
        android:paddingBottom="16dp"
        android:paddingTop="16dp"
        android:text="@string/btn_click"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="16sp" />
</RelativeLayout>

Second things is … Create the Java Implementation for this layout . I’m called this class as MainActivity.java

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.toolbar_main)
    Toolbar toolbarMain;

    @BindView(R.id.et_main_name)
    EditText etMainName;

    @BindString(R.string.app_name)
    String appName;

    @BindString(R.string.app_desc)
    String appDesc;

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

    @OnClick(R.id.btn_main_click)
    public void onBtnMainClick() {
        final String message = etMainName.getText().toString();

        if (!TextUtils.isEmpty(message)) {
            Toast.makeText(this, message, Toast.LENGTH_SHORT).show();
        }
    }

    private void initToolbar() {
        // Initial toolbar
        toolbarMain.setTitle(appName);
        toolbarMain.setSubtitle(appDesc);
        setSupportActionBar(toolbarMain);
    }
}

Hey wait, where is the findViewById things that we’ve used to code in order to initialize the view object from xml ??? Yup, that’s the benefit of using this library (at least one of them) :D

Last things is just register your activity into your AndroidManifest like usual

<application
---
<activity android:name="com.baculsoft.sample.butterknife.MainActivity">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

Run your app and see what’s going on now :) … for the sample of this code please go through this link -> https://github.com/budioktaviyan/android-butterknife