How to use View Binding insted of butterknife?

Question

I am updating an app. In the new program, I intend to use View Binding because butterknife library does not work. My codes are as follows. How do I use the new method? The previous code uses the butterknife library. By updating the program to a new version, it is not possible to use this library and sync it. After a little searching, I found out that the better solution is to use method two. But I have a problem in rewriting the codes. If possible, guide in making the necessary changes. Thanks

XML:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    >

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        app:cardCornerRadius="10dp"
        app:cardElevation="8dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="vertical"
            android:padding="10dp"
            >

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

                <ImageView
                    android:id="@+id/baseDialog_imgDialog"
                    android:layout_width="60dp"
                    android:layout_height="60dp"
                    android:layout_alignParentRight="true"
                    />

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignTop="@id/baseDialog_imgDialog"
                    android:layout_toLeftOf="@id/baseDialog_imgDialog"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/baseDialog_tvTitle"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:gravity="right"
                        android:textColor="@android:color/black"
                        android:textSize="18sp" />

                    <TextView
                        android:id="@+id/baseDialog_tvDescription"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:gravity="center"
                        android:textColor="@color/black"
                        android:textSize="16sp" />
                </LinearLayout>

            </RelativeLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:gravity="center"
                android:weightSum="2.5">

                <TextView
                    android:id="@+id/baseDialog_btnNo"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginRight="10dp"
                    android:layout_weight="1"
                    android:background="@drawable/bkg_blue_curved"
                    android:gravity="center"
                    android:paddingTop="10dp"
                    android:paddingBottom="10dp"
                    android:textColor="@android:color/white"
                    android:textSize="18sp" />

                <TextView
                    android:id="@+id/baseDialog_btnYes"

                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:layout_weight="1"
                    android:background="@drawable/strocked_simple"
                    android:gravity="center"
                    android:paddingTop="10dp"
                    android:paddingBottom="10dp"
                    android:textColor="@color/black"
                    android:textSize="18sp" />


            </LinearLayout>


        </LinearLayout>

    </androidx.cardview.widget.CardView>

</RelativeLayout>

Java class:

import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

import androidx.annotation.NonNull;

import com.example.R;
import com.example.interfase.MyClickHolder;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;


public class TowOptionDialog extends BaseDialog {
    private String noButtonText, yesButtonText, titleText, bodyText;
    private Drawable imageLink;

    MyClickHolder myClickHolde;

    public void setMyClickHolde(MyClickHolder myClickHolde) {
        this.myClickHolde = myClickHolde;
    }

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

    @BindView(R.id.baseDialog_tvDescription)
    TextView tvDescription;

    @BindView(R.id.baseDialog_btnNo)
    TextView btnNo;

    @BindView(R.id.baseDialog_btnYes)
    TextView btnYes;

    @BindView(R.id.baseDialog_imgDialog)
    ImageView imgBaseDialog;

    @OnClick(R.id.baseDialog_btnYes)
    void yesButton() {
        myClickHolde.onClicked(null, 1);
        dismiss();
    }

    @OnClick(R.id.baseDialog_btnNo)
    void noButton() {
        dismiss();

    }


    public TowOptionDialog(@NonNull Context context,
                           String noButtonText,
                           String yesButtonText,
                           String titleText,
                           String bodyText,
                           Drawable imageLink) {
        super(context);
        this.noButtonText = noButtonText;
        this.yesButtonText = yesButtonText;
        this.titleText = titleText;
        this.bodyText = bodyText;
        this.imageLink = imageLink;
    }

    public TowOptionDialog(@NonNull Context context,
                           String titleText,
                           String bodyText
    ) {
        super(context);
        this.noButtonText = "No";
        this.yesButtonText = "Yes";
        this.titleText = titleText;
        this.bodyText = bodyText;
        this.imageLink = null;
    }

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

        tvTitle.setText(titleText);
        tvDescription.setText(bodyText);
        imgBaseDialog.setImageDrawable(imageLink);
        imgBaseDialog.setVisibility(imageLink == null
                ? View.GONE : View.VISIBLE
        );
        btnYes.setText(yesButtonText);
        btnNo.setText(noButtonText);
    }

Answer 1

First remove your existing Butterknife library and add viewBinding to your build.gradle:

android {
    ...
    viewBinding {
        enabled = true
    }
}

Then you have to setup your root view, create a Global variable something like this:

private ActivityMainBinding binding

For example, I have if I am using my MainActivity viewBinding autogenerate someting like this "ActivityMainBinding", you can then initialize this variable in your onCreate function.

private ActivityMainBinding binding;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    binding = ActivityMainBinding.inflate(getLayoutInflater());
    setContentView(binding.getRoot());

    // Now you can access your views using the binding object
    binding.tvHeader.setText("Hello, ViewBinding!");
}

After the initailization then you can call any of your widget with their respective ID, For example, I have called my TextView 'tvHeader' using binding like this binding.tvHeader.setText("Hello, ViewBinding!");

Update:

To Handle button click with binding:

binding.baseDialogBtnYes.setOnClickListener(v -> {
    myClickHolde.onClicked(null, 1);
    dismiss();
});