Example Screens & Themes
In this tour, we'll show you where to find Example Screens and how to further customize your app by modifying or creating Themes.
Before you start, make sure you have Live Preview open on your phone. You can launch Live Preview by clicking the ▶️ button at the top of the Builder.
Add the Email & Password Login example screen to your app:
- Click 'Screens' from the left-hand column
- Click the
+to open the Add a Screen gallery.
- Add the Email & Password Login screen to your app (in the middle of the 2nd row), then close the gallery popup.
Go to your new Email & Password Login screen:
- Select the Email & Password Login row
Change the default Theme of your screen:
- Click 'Themes'
- Observe that the screen is set to the default Draftbit theme
- Select the Yummy theme card and observe your screen UI update automatically
To create your own theme:
- Click '+' on the Themes drawer to launch the New Theme popup
- Give your new theme a name
Next, edit your new theme's setting. New themes have system settings by default.
Don't forget to save when you're done!
You've made your first theme in Draftbit!
You can continue editing your new Theme by clicking the
✎ Pencil icon on its Theme card.
Need more help with creating and editing themes? Connect with us in the Draftbit Community↗️
In the next Tour, we'll show you how to create interactions in your app using Navigation.