Rx – Reactive Extension – for beginners (part 2)


no comments

Rx – Reactive Extension (part 2)

this post is the second in a series of posts about the new Reactive Framework (Rx).

the previous post discuss the concept of Rx (Reactive Framework Extension),

this post will focus on some basic practice.

 Rx, reactive framework, IObservable, IObserver

In this post we will create small WPF application that got images from different

image feeds providers (the source code can be found here).


Application layout

The application layout is described in the following diagram.

Rx, reactive framework, IObservable, IObserver


the image data will be pushed into the PhotoDataSourceProvider class which implement IObserver.

Code Snippet
  1. public class PhotoDataSourceProvider : DataSourceProvider, IObserver<ImageData>
  2. {
  3.     …
  4. }

the class will take the pushed data and expose it to the UI through the DataSourceProvider overrides.

DataSourceProvider is used as mediator between the UI and the Feeders in order to make the UI data thread safe.

In short the IObserver is where the data get pushed.


The feeders implement IObservable

Code Snippet
  1. public abstract class ImageFeederBase: IObservable<ImageData>
  2. {
  3.     public IDisposable Subscribe(IObserver<ImageData> observer)
  4.     {
  5.       ..
  6.     }
  7. }

all feeders inherit from ImageFeederBase.

IObservable expose the Subscribe method, which can be use for subscribing the

PhotoDataSourceProvider (because it is an observer).


this is how the PhotoDataSourceProvider constructor look like:

Code Snippet
  1. public PhotoDataSourceProvider()
  2. {
  3.     var picasaFeeder = new PicasaImageFeeder();
  4.     picasaFeeder.Subscribe(this);
  5.     var flickrAircraftFeeder = new FlickrImageFeeder("Aircraft");
  6.     flickrAircraftFeeder.Subscribe(this);
  7.     var flickrFlowerFeeder = new FlickrImageFeeder("Flower");
  8.     flickrFlowerFeeder.Subscribe(this);
  9.     var flickrSmileyFeeder = new FlickrImageFeeder("Smiley");
  10.     flickrSmileyFeeder.Subscribe(this);
  11.     var fileSystemJpgFeeder = new FileSystemImageFeeder("*.jpg");
  12.     fileSystemJpgFeeder.Subscribe(this);
  13.     var fileSystemPngFeeder = new FileSystemImageFeeder("*.png");
  14.     fileSystemPngFeeder.Subscribe(this);
  15. }

it subscribing itself for different feeders.

then whenever the feeder Has new image, Complete or Has Error

the PhotoDataSourceProvider will be notify through it IObserver implementation.

Code Snippet
  1. void IObserver<ImageData>.OnCompleted()
  2. {
  3.     …
  4. }
  5. void IObserver<ImageData>.OnError(Exception exception)
  6. {
  7.     …
  8. }
  9. void IObserver<ImageData>.OnNext(ImageData value)
  10. {
  11.     …
  12. }



the Rx is using the IObservable and IObserver in order to formalize push based operation.

the IObservable is the push supplier, while the IObserver is the push target.

IObserver can be subscribe to one or more IObservable.


Source Code

the source code can be found here.


תגים של Technorati:‏ ,,


kick it on DotNetKicks.com

Add comment
facebook linkedin twitter email

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>