Apply Dark Mode Using Observer Design Pattern In Swift

Apply Dark Mode Using Observer Design Pattern In Swift

The Observer pattern is a one-to-many relationship between objects, meaning that when one object changes its state, all of its dependent objects are notified and update with the new state.

The Observer Pattern consists of the subject and the observers. A Subject may consist of any number of observers, and all the concrete implementations of observers are notified whenever the subject changes.

Let’s suppose we are developing an iOS app, we need to implement dark mode in our app whenever the user switches the toggle. Before implementing dark mode using observer pattern, let’s implement using NotificationCenter, this will help us to better understand the observer pattern. Notification Center is a singleton API provided by Apple, to broadcast notification to the observers. For that let’s say we have a SettingsViewController, from that ViewController we want to broadcast a notification using a toggle control, that our theme has been changed.

No alt text provided for this image

We can now observe the theme changes from anywhere in our code. As an example, Let’s say we want to observe the theme change in our main ViewController of the app, whenever the theme changes, We will update the backgroundColor and Label on our ViewController according to the theme.

No alt text provided for this image

The main advantage of using the NotificationCenter approach is that notifications are quite easy to implement. It has an API that most Swift developers are familiar with, and also Apple themselves uses notifications everywhere.

However, there are also some significant downsides of this approach, like, in the above example, we have to do the typecasting in order to get the current theme. This makes our code quite fragile, as the compiler is unsure that both observer and object being observed are using the same types. Another downside of using the above approach is that notifications are broadcast app-wide, this makes code separation much harder as your codebase grows.

Now Let’s see how we can use a better protocol-oriented approach using the observer pattern to implement dark mode. 

First We need to create a Theme Protocol and create DarkTheme and LightTheme as the concrete implementation of that protocol

No alt text provided for this image

Then create a ThemeObserver protocol with the applyTheme method and theme protocol as a parameter.

No alt text provided for this image

Now create a ThemeManager class, that class will be responsible for holding and managing the observers as well as sending the notifications, Make sure to store observers as weak, or else you may end up retaining memory.

No alt text provided for this image

Now in our ThemeObserver protocol create a default method to subscribe and unsubscribe for theme updates using the protocol extensions. 

No alt text provided for this image

In our ViewController class, we just need to conform to the ThemeObserver protocol, and call the subscribeForThemeUpdates method in the viewDidLoad, and Hurray! we are ready to observe our theme changes in our ViewController or any other class that conform to the ThemeObserver protocol and is subscribing for theme updates.

No alt text provided for this image

And finally in our settingsViewController class, set the theme on toggle value change.

No alt text provided for this image

As you can see, this is a much cleaner approach, with clear separation of concerns, and also we get full compile type safety. We no longer need to do any casting in our observers’ methods that result in much more cleaner code, One downside of this approach is that it requires more code, additional protocols, and types. 


To view or add a comment, sign in

More articles by Muhammad Bilal Mustafa

  • A Beginner Friendly Programmer Guide

    When I was new to the computer science, a lot of time I wasn’t sure that I am doing the things in the right way. I…

Others also viewed

Explore content categories