How can I have common views and code in a parent class and re-utilize them in child Fragments?

Question

I have 3 fragments that have 5 common components: 1 TextView, 2 Button, 1 ProgressBar.

Instead of calling findViewById, setText or setOnClickListener methods on each fragment with the same code (see below), I want to have this code in one single class. I have thought to create a base fragment where to add this code, and then have my 3 fragments to inherit from this base fragment.

However, it's not clear to me how to do it. Shall I have to add these views in an XML that is then inflated in onCreateView method of the base fragment and add the code in onViewCreated?

Currently, my 3 fragments have this in the XML:

<androidx.constraintlayout.widget.ConstraintLayout 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:layout_margin="@dimen/borde"
    tools:context=".PartidosFragment">

    <!-- Common views -->

    <ProgressBar
        android:id="@+id/progress_bar"
        style="?android:attr/progressBarStyle"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="84dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/anterior_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/anterior_test"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/actual_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/actual_test"
        android:textSize="24sp"
        app:layout_constraintBottom_toBottomOf="@+id/anterior_button"
        app:layout_constraintEnd_toStartOf="@+id/siguiente_button"
        app:layout_constraintStart_toEndOf="@+id/anterior_button"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/siguiente_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/sigueinte_test"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <!-- End of common views -->

    <!-- More views unique to each Fragment -->

</androidx.constraintlayout.widget.ConstraintLayout>

Common Java code:

@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    this.progressBar = view.findViewById(R.id.rogress_bar);
    this.actTv = view.findViewById(R.id.actual_tv);
    this.antBt = view.findViewById(R.id.anterior_button);
    this.sigBt = view.findViewById(R.id.siguiente_button);

    this.antBt.setOnClickListener(this);
    this.sigBt.setOnClickListener(this);

    this.actTv.setText(Temporada.getTemporadaFormateada(String
            .valueOf(this.temporada)));

    // If the season is the oldest available, then hide the button to move to the 
    // previous season, as there is no other older.
    if (this.temporada != MyApplication.oldestYear) {
        this.antBt.setText(String.format("< %s", Temporada
                .getTemporadaFormateada(String.valueOf(this.temporada - 1))));
        this.antBt.setVisibility(View.VISIBLE);
    } else {
        this.antBt.setVisibility(View.INVISIBLE);
    }

    // If the season is the latest available, then hide the button to move to the 
    // next season, as there is no other more recent.
    if (this.temporada != MyApplication.newestYear) {
        this.sigBt.setText(String.format("%s >", Temporada
                .getTemporadaFormateada(String.valueOf(this.temporada + 1))));
        this.sigBt.setVisibility(View.VISIBLE);
    } else {
        this.sigBt.setVisibility(View.INVISIBLE);
    }
}

Thank you!

Answer 1

You Should create a XML file that contains your common views. Then use <include to have common views in the file you have mentioned in your question. Now you need create a BaseFragment to do your common codes like OnClickListener. I suggest you to make this class abstract and override different functionality for 3 fragments. For example different onClickListeners