Jetpack LiveData in Android with Example
Last Updated :
25 Feb, 2022
Android Jetpack is a suite of libraries to help developers follow best practices, reduce boilerplate code, and write code that works consistently across Android versions and devices so that developers can focus on the code they care about. Here, we are going to implement Jetpack Live Data in Android Studio.
What we are going to build in this article?
A sample video of what we are going to build in this article is shown below. Note that we are going to implement this project in the Java language.
Step by Step Implementation
Step 1. Create a New Project
- Open a new project.
- We will be working on Empty Activity with language as Java. Leave all other options unchanged.
- Name the application at your convenience.
- There will be two default files named activity_main.xml and MainActivity.java.
If you don’t know how to create a new project in Android Studio then you can refer to How to Create/Start a New Project in Android Studio?
Step 2. Adding required dependencies
Navigate to Gradle scripts > build.gradle(module) and use the following dependencies in it-
implementation 'androidx.lifecycle:lifecycle-extensions:2.2.0'
Step 3. Working on XML files
Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file.
XML
<? xml version = "1.0" encoding = "utf-8" ?>
< LinearLayout
android:layout_width = "match_parent"
android:layout_height = "match_parent"
android:orientation = "vertical"
android:paddingTop = "16dp"
tools:context = ".MainActivity" >
< EditText
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/et_text"
android:hint = "Enter Text"
android:paddingTop = "12dp"
android:background = "@android:drawable/editbox_background" />
< FrameLayout
android:layout_width = "match_parent"
android:layout_height = "match_parent"
android:id = "@+id/frame_layout"
android:layout_marginTop = "16dp" />
</ LinearLayout >
|
Navigate to app > right-click > new > fragment > blank fragment. Name it as MainFragment and use the following code in fragment_main.xml file-
XML
<? xml version = "1.0" encoding = "utf-8" ?>
< FrameLayout
android:layout_width = "match_parent"
android:layout_height = "match_parent"
tools:context = ".MainFragment" >
< TextView
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:id = "@+id/tv_result"
android:textSize = "40sp"
android:textStyle = "bold"
android:gravity = "center" />
</ FrameLayout >
|
Step 4. Working on Java files
Navigate to the MainActivity.java file and use the following code in it. Comments are added to the code to have a better understanding.
Java
package com.example.jetpacklivedata;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
import androidx.lifecycle.ViewModelProviders;
import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.widget.EditText;
public class MainActivity extends AppCompatActivity {
EditText editText;
MainViewModel mainViewModel;
@Override
protected void onCreate(Bundle savedInstanceState) {
super .onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
editText=findViewById(R.id.et_text);
mainViewModel= ViewModelProviders.of(MainActivity. this )
.get(MainViewModel. class );
editText.addTextChangedListener( new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
mainViewModel.setText(String.valueOf(charSequence));
}
@Override
public void afterTextChanged(Editable editable) {
}
});
Fragment fragment= new MainFragment();
getSupportFragmentManager().beginTransaction().replace(R.id.frame_layout,fragment).commit();
}
}
|
Navigate to the MainFragment.java file and use the following code in it. Comments are added to the code to have a better understanding.
Java
package com.example.jetpacklivedata;
import android.os.Bundle;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.Observer;
import androidx.lifecycle.ViewModelProviders;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
public class MainFragment extends Fragment {
TextView tvResult;
MainViewModel mainViewModel;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view=inflater.inflate(R.layout.fragment_main, container, false );
tvResult=view.findViewById(R.id.tv_result);
if (getActivity()!= null ){
mainViewModel= ViewModelProviders.of(getActivity())
.get(MainViewModel. class );
mainViewModel.getText().observe(getActivity(), new Observer<String>() {
@Override
public void onChanged(String s) {
tvResult.setText(s);
}
});
}
return view;
}
}
|
Navigate to app > new > Java Class. Name it as MainViewModel and use the below code in the MainViewModel.java file.
Java
package com.example.jetpacklivedata;
import androidx.lifecycle.MutableLiveData;
import androidx.lifecycle.ViewModel;
public class MainViewModel extends ViewModel {
MutableLiveData<String> mutableLiveData
= new MutableLiveData<>();
public void setText(String s)
{
mutableLiveData.setValue(s);
}
public MutableLiveData<String> getText()
{
return mutableLiveData;
}
}
|
Here is the final output of our application.
Output:
Share your thoughts in the comments
Please Login to comment...