So, today I am going to show you how can you add favorite button with favorite list and zoom in and zoom out button on Dynamic Shayari App. Before following this tutorial, please follow other tutorials of Dynamic Shayari App. Click here to see the first tutorial of How to create a Dynamic Shayari App. I will do rest edits on that app
And also Welcome to new Kodular

Home Screen

Design

Here I have just added Side Menu Layout to add Favorite Screen to users

Blocks

i have added 2 items on the Menu

when an item clicked it will open a new screen Fav

Fav Screen

Design

I have copied Main screen and created the Fav screen, to do so, go to Main screen and click on Copy Screen and then enter new Screen name, then it will be copied to new screen. It will be Favorite Shayari List Screen, so here I removed the Background image and set all colours to Red. I have added a Delete button which is a Material Icon label into last Horizontal arrangement and that’s all

Blocks

it will show shayaris which will store from Main screen on TinyDB, and when no shayari is in TinyDB it will show “you have not saved any favorite shayari”

it will show current shayari, index and total shayaris

next and back button functions

it will delete current or index shayari(when an user click delete)

Main Screen

Design

In main screen, I have added a new Button that is Favorite button using Material Icon in last Horizontal Arrangement and added 2 Floating Action Bar, first action bar’s Margin Bottom set to 120 and Icon Name set to zoom_in, second floating bar’s Margin Bottom set to 50 and Material Icon name zoom_out, also drag TinyDB

Blocks

i am skipping rest blocks cause they are available in main dynamic shayari app tutorail; it is showing how favorite button will work and when favorite clicked it will turn into red colour

and when back or next click then favorite button turn into white colour

this is the floating action bars, when zoom in clicked then shayari font size will increased by 2 px and when zoom out clicked shayari font size will decrease by 2px

Download Project File

Video Tutorial