Presenting a Color Picker in SwiftUI

Photo by russn_fckr on Unsplash

When making apps, it’s sometimes necessary to provide users with a specific feature; the ability to select and change the color of one or more visual elements of the app. Think, for example, of a text editing app. Users might want to change both the background and the text color according to their own personal preferences and taste.

Implementing a custom palette is easy if colors collection should contain a limited set of colors. However, if we want to give users advanced options, then implementing such a custom control might not be that easy.

Thankfully, SwiftUI contains a built-in view just for that, available in iOS 14 and above. It’s a system provided color picker both in iOS and macOS; and in this post I’m going to show how to integrate it in your apps.

Using the color picker on iOS

In its simplest form, here is what it takes to present a color picker in SwiftUI:

There are two arguments that we must provide when initializing a ColorPicker view; a text that will be displayed as the picker’s…