How to integrate RxJava into Android App with examples
Java
182
RxJava
9
android
68
Male avatar

loveprogramming viết ngày 05/03/2021

https://grokonez.com/android/how-to-integrate-rxjava-into-android-app-with-examples

In this tutorial, grokonez.com shows you way to integrate RxJava 2 into Android App, along with 3 simple examples that apply RxJava:

  • CompoundButton (Switch) updates TextView
  • Update TextView when text length in EditText changes
  • Reactive Text search

Set up Android environment

We use Android Studio (installer from https://developer.android.com/studio/) for development. It doesn't support RxJava, so we need to add RxJava 2 library.

Add RxJava 2 dependencies

Open app/build.gradle file, add RxJava and RxBinding wrappers for UI:


dependencies {
    ...

    implementation 'io.reactivex.rxjava2:rxjava:2.1.7'
    implementation 'io.reactivex.rxjava2:rxandroid:2.0.1'
    implementation 'com.jakewharton.rxbinding2:rxbinding:2.0.0'
}
Add Java 8 lambdas
We also need to add Java 8 to the configuration to use lambdas:
android {
    ...
    defaultConfig {
        ...
        compileOptions {
            sourceCompatibility JavaVersion.VERSION_1_8
            targetCompatibility JavaVersion.VERSION_1_8
        }
    }
    ...
}

Simple RxJava in Android App examples

Example 1: CompoundButton (Switch) updates TextView

rxjava-android-intro-example-1

Layout:


<Switch
    android:id="@+id/switch_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Press to Switch" />
<TextView
    android:id="@+id/text_view_1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

We're gonna make Switch as an Observable.

  • Create an Observable based on Switch (CompoundButton) change events using RxBindings library:
    
    import com.jakewharton.rxbinding2.widget.RxCompoundButton;
    import io.reactivex.Observable;
    ...

Switch switchButton = findViewById(R.id.switch_button);

Observable<Boolean> switchObservable = RxCompoundButton.checkedChanges(switchButton);

  • Subscribe with listener function, it makes textView1 change text according to whether switchButton is checked or not.
    
    TextView textView1 = findViewById(R.id.text_view_1);

switchObservable.subscribe(checked -> textView1.setText("Checked: " + checked));

Java code:


import com.jakewharton.rxbinding2.widget.RxCompoundButton;
...
public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        ...
        Switch switchButton = findViewById(R.id.switch_button);
        TextView textView1 = findViewById(R.id.text_view_1);

        RxCompoundButton.checkedChanges(switchButton)
                .subscribe(checked -> textView1.setText("Checked: " + checked));
    }
}
Example 2: Update TextView when text length in EditText changes

rxjava-android-intro-example-2

Layout:


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

We're gonna make Text input as an Observable.

  • Create an Observable based on EditText change events using RxBindings library:
    
    import com.jakewharton.rxbinding2.widget.RxTextView;
    import io.reactivex.Observable;

EditText editText = findViewById(R.id.edit_text);

Observable<CharSequence> edtTextObservable = RxTextView.textChanges(editText);

Now the EditText can be considered an emitter of string values over time.

  • Subscribe with listener function, it makes textView2 say the text is "Too long!" if editText is more than 6 characters.

    
    edtTextObservable.subscribe(text ->
                        textView2.setText(text.length() > 6 ? "Too long!" : ""));
    

    Java code:

    
    import com.jakewharton.rxbinding2.widget.RxTextView;
    ...
    public class MainActivity extends AppCompatActivity {
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    
        EditText editText = findViewById(R.id.edit_text);
        TextView textView2 = findViewById(R.id.text_view_2);
    
        RxTextView.textChanges(editText)
                .subscribe(text ->
                        textView2.setText(text.length() > 6 ? "Too long!" : ""));
    }
    }
    
    Example 3: Reactive Text Search

rxjava-android-intro-example-3

Layout:


<EditText
    android:id="@+id/edit_text_search"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:background="#fff"
    android:paddingLeft="10dp"
    android:paddingRight="10dp" />
<ListView
    android:id="@+id/search_results"
    android:layout_width="match_parent"
    android:layout_height="147dp"
    android:layout_marginTop="5dp"
    android:background="#fff" />

Searches fewer than 3 characters will be filtered out, and search request will be only sent once the user hasn't typed for 500ms:


EditText editTextSearch = findViewById(R.id.edit_text_search);

RxTextView.textChanges(editTextSearch)
        .doOnNext(text -> this.clearSearchResults())
        .filter(text -> text.length() >= 3)
        .debounce(500, TimeUnit.MILLISECONDS)
        .observeOn(AndroidSchedulers.mainThread())
        .subscribe(this::updateSearchResults);

Notice that, debounce() operator will automatically switch the thread to a background. So we call .observeOn(AndroidSchedulers.mainThread()) before doing a UI operation (updateSearchResults()) in the next step.

Java code:


import com.jakewharton.rxbinding2.widget.RxTextView;

import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import java.util.concurrent.TimeUnit;

import io.reactivex.android.schedulers.AndroidSchedulers;


public class MainActivity extends AppCompatActivity {
    ArrayAdapter arrayAdapter;

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

        arrayAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1);
        ListView listView = findViewById(R.id.search_results);
        listView.setAdapter(arrayAdapter);

        EditText editTextSearch = findViewById(R.id.edit_text_search);
        
        RxTextView.textChanges(editTextSearch)
                .doOnNext(text -> this.clearSearchResults())
                .filter(text -> text.length() >= 3)
                .debounce(500, TimeUnit.MILLISECONDS)
                .observeOn(AndroidSchedulers.mainThread())
                .subscribe(this::updateSearchResults);
    }

    private void clearSearchResults() {
        arrayAdapter.clear();
    }

    private void updateSearchResults(CharSequence text) {
        // Create some random results
        Random rand = new Random();
        List list = new ArrayList();
        for (int i = 0; i 

Source Code

RxJava-Android-Intro

Bình luận


White
{{ comment.user.name }}
Bỏ hay Hay
{{comment.like_count}}
Male avatar
{{ comment_error }}
Hủy
   

Hiển thị thử

Chỉnh sửa

Male avatar

loveprogramming

224 bài viết.
66 người follow
Kipalog
{{userFollowed ? 'Following' : 'Follow'}}
Cùng một tác giả
Male avatar
1 0
Tutorial Link: (Link) (Ảnh) Django is a Pythonbased free and opensource web framework that follows the modeltemplateview architectural pattern. A...
loveprogramming viết 5 tháng trước
1 0
Male avatar
1 0
https://loizenai.com/angular11nodejspostgresqlcrudexample/ Angular 11 Node.js PostgreSQL Crud Example (Ảnh) Tutorial: “Angular 11 Node.js Postg...
loveprogramming viết 4 tháng trước
1 0
Male avatar
1 0
Angular Spring Boot jwt Authentication Example Github https://loizenai.com/angularspringbootjwt/ (Ảnh) Tutorial: ” Angular Spring Boot jwt Authe...
loveprogramming viết 4 tháng trước
1 0
Bài viết liên quan
Male avatar
0 0
Introduction Hi ae, trong bài viết này, mình sẽ cùng các bạn tìm hiểu về cách xử lý lỗi trong RxJava. Đầu tiên, hãy nhớ rằng Observable thường kh...
Hades viết 10 tháng trước
0 0
{{like_count}}

kipalog

{{ comment_count }}

bình luận

{{liked ? "Đã kipalog" : "Kipalog"}}


Male avatar
{{userFollowed ? 'Following' : 'Follow'}}
224 bài viết.
66 người follow

 Đầu mục bài viết

Vẫn còn nữa! x

Kipalog vẫn còn rất nhiều bài viết hay và chủ đề thú vị chờ bạn khám phá!