Implement Observer Pattern in absolutely easy example

• Download EventAndDelegate1.zip - 62.01 KB  

Introduction

When you develope your application. I'm sure that you have to handler many many objects.
So If them have to interact with the same source data, I think that you must find a way to make them update with the change of data. Observer pattern is the key you can use for this solution!

Background 

I have searched this website and found a little article talk about observer pattern. And I have read some article about event and delegate, too. So that I want to show you - the new developers the way to implement observer pattern in the easiest way, faster way, and easiest to understand. 

Now, let's start!

Using the code 

I created a example in winforms, using C# language in .NET Framework 2.0.

• I have 2 form: Form2 and Form3

• In form2 there are 3 radio buttons, a Label and a Buttons. If you check the radio button you'll see that the fore color of label will be change with the color is the name of that radio button. It's very easy, isn't it?
• When you click on button to open child form. Form3 will show! If you check the radio button again. Beside the fore color of label change, you'll see that the backcolor of textbox in Form3 will be changed too! That's it! 

• I have 2 object in this solution:
  
  • Subject: It' will be the parent! When a client is created! the client must be register with this subject. When something change, the subject will notify to all the clients it manage to make them update
  • Observer: It's a client, when it was born, It' have to register with subject and waitting to update if there's something change. 

Subject Object  

first, I create a delegate and an event to make it can be "alive" when there's something change it!

private delegate void NotifyHandler(string _color);
private event NotifyHandler NotifyEvent;  

I also create a ArrayList names arrObs to manage all client object when it register to Subject object

ArrayList arrObs = new ArrayList();
 

The full details of subject is here: 

public class Subject
{
   ArrayList arrObs = new ArrayList();
   private delegate void NotifyHandler(string _color);
   private event NotifyHandler NotifyEvent;

   public Subject()
   {
      this.NotifyEvent += new NotifyHandler(Notify);
   }

   public void UpdateClient(string _color)
   {
       OnNotify(_color);
   }

   private void OnNotify(string _color)
   {
       if (NotifyEvent != null)
       {
           NotifyEvent(_color);
       }
   }

   private void Notify(string _color)
   {
       for (int i = 0; i < arrObs.Count; i++)
       {
           Observer obs = (Observer)arrObs[i];
           obs.Update(_color);
       }
   }
     
   public void RegisterClient(Observer obs)
   {
       arrObs.Add(obs);
   }
}

You will see that when the subject is created, it's will register the NotifyEvent with Notify method. In the Notify(), it pass the _color string to all the client in arrObs. And clients will call Update method to update the color.

Now, let's see the client object names Observer!

Observer Object

Same to Subject object, I will define a delegate and an event to make it alive when subject notify them!

private delegate void ColorEventHandler(string _color);
private event ColorEventHandler ColorChangedEvent;  

Like the subject, when subject notify to observer (in Update method above), the ColorChangedEvent will be fired and call ColorEventHander to pass the _color string to update!

In this solution, I want to update the back color of Form3. So, this observer object will be created in form3 and pass the textbox object to observer in contructor:

private TextBox txt;
public Observer(TextBox _txt)
{
     this.ColorChangedEvent += new ColorEventHandler(Observer_ColorChangedEvent);
     this.txt = _txt;
}  

 

The full detail of Observer object will be here:

public class Observer
{
    private delegate void ColorEventHandler(string _color);
    private event ColorEventHandler ColorChangedEvent;
    private TextBox txt;
    
    public Observer(TextBox _txt)
    {
        this.ColorChangedEvent += new ColorEventHandler(Observer_ColorChangedEvent);
        this.txt = _txt;
    }

    private void OnChange(string _color)
    {
        if (ColorChangedEvent != null)
        {
            ColorChangedEvent(_color);
        }
    }
    
    public void Update(string _color)
    {
        OnChange(_color);
    }
  
    private void Observer_ColorChangedEvent(string _color)
    {
        switch (_color)
        { 
            case "RED":
                txt.BackColor = Color.Red;
                break;
            case "BLUE":
                txt.BackColor = Color.Blue;
                break;
            case "GREEN":
                txt.BackColor = Color.Green;
                break;
            default: 
                txt.BackColor = Color.Gray;
                break;
        }
    }
} 

 Form2

When radio button is checked changed! It will call the Subject object to update its client

private void rdRed_CheckedChanged(object sender, EventArgs e)
{
      if (rdRed.Checked)
      {
          objSub.UpdateClient("RED");
          lblText.ForeColor = Color.Red;                
      }
 }

 private void rdGreen_CheckedChanged(object sender, EventArgs e)
 {
       if (rdGreen.Checked)
       {
           objSub.UpdateClient("GREEN");
           lblText.ForeColor = Color.Green;
       }
 }

 private void rdBlue_CheckedChanged(object sender, EventArgs e)
 {
       if (rdBlue.Checked)
       {
           objSub.UpdateClient("BLUE");
           lblText.ForeColor = Color.Blue;
       }
  }

When click on Button to create and open Form3, There is a subject object name objSub was created in form and and pass to form3 through constructor:

private Subject objSub;
private Form3 frm;
public Form2()
{
     InitializeComponent();
     objSub = new Subject();
}        

private void btnOpen_Click(object sender, EventArgs e)
{
     frm = new Form3(objSub);
     frm.Show();
} 

Form3

Only create a new observer object and register it with the objSub

public Form3(Subject _objSub)
{
     InitializeComponent();
     objSub = _objSub;
     obs = new Observer(this.textBox1);
     objSub.RegisterClient(obs);
}

That's all! When you click on the radio button, it's will call the subject to update clients in its arraylist. The client wil be notified and update the background of textbox with the color pass through by the subject.

Points of Interest 

It's a compact of implement observer pattern in an easy example! Hope you can understand and learn how to solve you problem from this small example! 

Feel free when contact to me!

Name: Nguyen Anh Vu(Mr.)
Email: vuna209@gmail.com
Mobile: +84984886940
Addr: 7 floor, 53 Quang Trung, Hanoi, VietNam.

You must Sign In to use this message board.

FAQ    Noise Tolerance Very HighHighMediumLowVery Low   Layout Expand Posts & RepliesThread ViewNo JavascriptNo JS + Preview   Per page 102550

Msgs 1 to 9 of 9 (Total in Forum: 9) (Refresh) FirstPrevNext

it works ok with the textbox but not with the listbox nipsonanomimata 22:49 2 Oct '09   here is the code any thoughts it seems strange.. Sign In·View Thread·PermaLink Re: it works ok with the textbox but not with the listbox nipsonanomimata 1:02 3 Oct '09   vs2010 gave me the answer you have to instantiate the two controls in the class level and everything works fine. Sign In·View Thread·PermaLink Good article [modified] Donsw 15:50 21 Jan '09   Good article one thing I would do to make it better is talk more about the patterns up front for those who either do not know the patterns or have forgotten the patterns. Otherwise this is a good article. modified on Wednesday, January 21, 2009 8:58 PM Sign In·View Thread·PermaLink very good DearMadalin 16:40 22 Sep '08   I have learnt something new today Lay down the program and immediately become a Buddha Sign In·View Thread·PermaLink Why so complicated? ptmcomp 10:19 22 Sep '08   .NET's events themselves are an implementation of the Observer Pattern. There is no need to build a second registration and notification algorithm around it. Patterns can be implemented differently. E.g. "for each" is an implementation of the iterator pattern. Sign In·View Thread·PermaLink 5.00/5 (1 vote) Re: Why so complicated? spiderman_anhvu 18:30 22 Sep '08   yeah, of course you can make a similar example with another way! such as you can reference the textbox of Form3 with Form2. But in this example, i want to introduce how to implement observer pattern with event and delegate! Through this example, you can understand about observer pattern, event and delegate. The last question, if you have to do this example in .NET Remoting, How will you do? That's it! I want to say about observer pattern in Remoting using event and delegate Now, do you understand what i want to say about through this example? anyway, thanks for your question! Sign In·View Thread·PermaLink 1.00/5 (1 vote) Re: Why so complicated? fire_birdie 20:49 22 Sep '08   My head hurts just from reading that. I agree with ptmcomp, this is far too complicated. I think you should do some more reading on the subject of delegates, the code you are adding doesn't seem to have any real value. Using the += operator creates a multi-cast delegate so there is no need to create an ArrayList. If you use the standard pattern for events in .NET (object sender, EventArgs args) your observers should be given all the info they require. You might want to have a look at System.ComponentModel.INotifyPropertyChanged. Finally, how does your method help with Remoting? Sign In·View Thread·PermaLink 1.00/5 (1 vote) Re: Why so complicated? spiderman_anhvu 22:19 22 Sep '08   okie, this example is only for beginner, who want to understand more about event and delegate. I haven't read about System.ComponentModel.INotifyPropertyChanged yet. So if you can, could you show me an example please? thanks a lot! I think in remoting callback, i could use event and delegate to make server be able to talk to client. Sign In·View Thread·PermaLink Re: Why so complicated? fire_birdie 22:50 22 Sep '08   INotifyPropertyChanged provides a simple event for notifying other objects that a property has changed. It is used in WPF as a form of data binding. using System; using System.ComponentModel; public class Observable : INotifyPropertyChanged { #region Fields private string name; #endregion #region Properties public string Name { get { return this.name; } set { // Only fire the event if the value actually changed if(this.name != value) { this.name = value; this.OnPropertyChanged("Name"); } } } #endregion #region Methods protected void OnPropertyChanged(string propertyName) { // Make a copy of the delegate for thread safety PropertyChangedEventHandler temp = this.PropertyChanged; if(temp != null) { // Call the delegate if there are any registered observers temp(this, new PropertyChangedEventArgs(propertyName)); } } #endregion #region INotifyPropertyChanged Members public event PropertyChangedEventHandler PropertyChanged; #endregion } An observer can handle the PropertyChanged event with a switch statement to filter the properties it is interested in and update itself accordingly. It's also possible to derive a class from PropertyChangedEventArgs to include the previous and new value of the property. There is no need for an ArrayList because (as my previous message stated) the delegate will handle that for you. Remoting and delegates should be handled with care. A delegate holds a reference to both the method and the instance it wraps; it needs to be carefully designed when it crosses app domain boundries. And finally, I would recommend beginners read the documentation for delegates before attempting anything like this. cheers Sign In·View Thread·PermaLink 5.00/5 (4 votes)

Last Visit: 12:52 9 Feb '10     Last Update: 12:52 9 Feb '10 1