Fragment to Fragment Communication with Shared ViewModel

If we wanted to send data between 2 or more fragments of the same activity in the past, we had to do the communication over the underlying activity using interfaces and public methods. The modern approach is to communicate over the ViewModel of the activity instead, which leads to less complicated code and less tightly coupled classes.
For this, we have to create a ViewModel class from the Android Architecture Components Lifecycle library, where we store observable LiveData. By using the MutableLiveData subclass, we can access the setValue method with which we can update the Object that our LiveData wraps. SetValue has to be called on the UI thread (main thread). Alternatively, we can use postValue on a background thread. When we update our Livedata, it automatically notifies all active Observers and triggers their onChanged callback, where we can retrieve the new value and update the UI. In our fragments, we can observe this LiveData to get real-time updates and make changes to it.
By passing getActivity instead of “this” to the ViewModelProviders.of method, we can scope the lifecycle of this ViewModel to the activity instead of the fragment, and this way access it from multiple different fragments to share data between them, as long as their activity is alive. The best place to assign the ViewModel is in onActivityCreated, right after onCreateView, because this method guarantees that the onCreate method of the underlying activity has finished, so getActivity doesn’t return null. This way we can also make sure that we set a new Observer and get an immediate update in cases where only the fragment’s view, and not the whole fragment instance is destroyed, which is the case for example when a fragment is replaced/removed and added to the back stack, or when it is just detached and attached with a FragmentManager Transaction. In those cases, onDestroyView is called on the fragment, but not onDestroy or onDetach, and therefore also not onCreate, which could lead to bad UI states from missing data. By passing getViewLifecycleOwner as the LifecycleOwner to the LiveData, we can scope the LiveData to the lifecycle of the fragment’s view and avoid memory leaks from adding multiple Observers.

Make sure to watch the Architecture Components Beginner Tutorial first:
youtube.com/playlist?list=PLrnPJCHvNZuDihTpkRs6SpZhqgBqPU118

Show more
Show less
Links & DependenciesSharedViewModel.javafragment_a.xmlfragment_b.xmlFragmentA.javaFragmentB.javaactivity_main.xmlMainActivity.java

Architecture Components dependencies:

developer.android.com/topic/libraries/architecture/adding-components

package com.codinginflow.sharedviewmodelexample;

import android.arch.lifecycle.LiveData;
import android.arch.lifecycle.MutableLiveData;
import android.arch.lifecycle.ViewModel;

public class SharedViewModel extends ViewModel {
    private MutableLiveData<CharSequence> text = new MutableLiveData<>();

    public void setText(CharSequence input) {
        text.setValue(input);
    }

    public LiveData<CharSequence> getText() {
        return text;
    }
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/holo_green_light"
    android:gravity="center_horizontal"
    android:orientation="vertical"
    android:padding="16dp">

    <EditText
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/button_ok"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Ok" />

</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/holo_blue_light"
    android:gravity="center_horizontal"
    android:orientation="vertical"
    android:padding="16dp">

    <EditText
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/button_ok"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Ok" />

</LinearLayout>
package com.codinginflow.sharedviewmodelexample;

import android.arch.lifecycle.Observer;
import android.arch.lifecycle.ViewModelProviders;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.EditText;

public class FragmentA extends Fragment {
    private SharedViewModel viewModel;
    private EditText editText;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.fragment_a, container, false);

        editText = v.findViewById(R.id.edit_text);
        Button button = v.findViewById(R.id.button_ok);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                viewModel.setText(editText.getText());
            }
        });

        return v;
    }

    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        viewModel = ViewModelProviders.of(getActivity()).get(SharedViewModel.class);
        viewModel.getText().observe(getViewLifecycleOwner(), new Observer<CharSequence>() {
            @Override
            public void onChanged(@Nullable CharSequence charSequence) {
                editText.setText(charSequence);
            }
        });
    }
}
package com.codinginflow.sharedviewmodelexample;

import android.arch.lifecycle.Observer;
import android.arch.lifecycle.ViewModelProviders;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.EditText;

public class FragmentB extends Fragment {
    private SharedViewModel viewModel;
    private EditText editText;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.fragment_b, container, false);

        editText = v.findViewById(R.id.edit_text);
        Button button = v.findViewById(R.id.button_ok);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                viewModel.setText(editText.getText());
            }
        });

        return v;
    }

    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        viewModel = ViewModelProviders.of(getActivity()).get(SharedViewModel.class);
        viewModel.getText().observe(getViewLifecycleOwner(), new Observer<CharSequence>() {
            @Override
            public void onChanged(@Nullable CharSequence charSequence) {
                editText.setText(charSequence);
            }
        });
    }
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
    tools:context=".MainActivity">

    <FrameLayout
        android:id="@+id/container_a"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <FrameLayout
        android:id="@+id/container_b"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>
package com.codinginflow.sharedviewmodelexample;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        getSupportFragmentManager().beginTransaction()
                .add(R.id.container_a, new FragmentA())
                .add(R.id.container_b, new FragmentB())
                .commit();
    }
}