Create and Chain Observable Sequences in RxSwift

Shorten your code and make it more efficient

Zafar Ivaev
Feb 12 · 3 min read
Photo by boris misevic on Unsplash

In this short tutorial, we will learn how to create two RxSwift’s Observable sequences and chain them.

The example app shows a UITextField at the top of the screen. It waits for a user input, and when a user has inputted five letters containing “rx”, the UITextField flashes green and refreshes:

The source code of the project is available on GitHub.


Let’s Start

First, let’s quickly create and position our textField on the screen:

Now, add the following imports at the top of the file:

import RxSwiftimport RxCocoa 

We have to add the disposeBag property to deallocate subscriptions in the future:

private let disposeBag = DisposeBag()

We are ready to create our sequences now.


Create Observable Sequences

Let’s start with the first task: finding “rx” in the inputted string:

We will call this searching method after a user inputs a letter. If it succeeds, it will emit a true value. If not, the false value will be emitted instead.

To create a method for the second task, animating and clearing the textField , we write the following code:

As we can see, this method performs a short 0.2-second animation that changes the backgroundColor property of the textField. On completion, we perform another animation, returning the backgroundColor to its former state and emit the true event onto the observer.

Now it is time to chain these brand-new observables.


Chain Observables

We need to create a method that will hold bindings for the textField:

Here is the breakdown of what happens in this method:

  • Using the .orEmpty method, we transform the optional String? type into String.
  • We filter out all events where the textField’s text count is not equal to five. When it is equal to five, we perform the .flatMap method.
  • The .flatMap method changes the type of the sequence from Observable<String> to Observable<Bool>, because this is the type that the findSubstring(in: ) method returns.
  • We only allow true events to pass next, meaning that the “rx” substring was found.
  • In the next .flatMap method, we animate the textField and return a new sequence of type Observable<Bool>, which emits a true event on the completion of the animation.
  • When the animation is completed, we pass the .filter method requirements.
  • In .subscribe, we simply print “Subscribed” to debug the implementation.
  • Finally, we add the subscription to the disposeBag that will deallocate it.

Do not forget to add the bindTextField() method to the viewDidLoad:

We have successfully created and chained observable sequences.

Our final ViewController.swift file now looks like this:


Wrapping Up

We have seen how easy it is to chain different observable sequences using the .flatMap function. If you are curious to learn more about what you can do with RxSwift, feel free to check out my other relevant pieces:

Thank you very much for reading!

Better Programming

Advice for programmers.

Thanks to Zack Shapiro

Zafar Ivaev

Written by

👨🏻‍💻 iOS & Flutter Developer

Better Programming

Advice for programmers.

More From Medium

More from Better Programming

More from Better Programming

More from Better Programming

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade