How to Make Dynamic FAB Whatsapp Button In Sketchware Pro
Hello guys. In this previous video I created project, it's tab layout project. it's the second video, I would like to continue the project by adding dynamic fab button with different icon when i seleted different tab in sketchware. I hope it's useful for you.
Getting Started
Before, We are going to continue building the project. Let's breakdown the concept of requirements. I divided become 3 parts below :
- Adding 3 Different Icons (Chat, Status, & Call)
- Setup Floating Action Button in Main Activity
- Adding onTabSeleted Event
Follow this tutorial step by step for getting better understanding.
Prepare Our Icons
In this case, we are going to make dynamic Floating Action Button (FAB) in Sketchware. We need to add 3 icons. Let's import the icons from sketchware image collection. You can see in the image below :
I found 3 images of the requirements. Next step to setup our floating button.
Setup Floating Action Button
This is the most important step to setup our Floating Button. Let's go to View Manager, Select main.xml and checklist for FAB button.
After Floating Button appeared, set default image for chat tab. Because we have the first tab is Chat Tab. Look at the image below.
Adding onTabSelected Event
This is the last step, we will add some logic onTabSeleted Event. Go to Event Menu, and select View, Click on red floating button,
We look for onTabSelected Event. Finally add some logic there. Look at the image below.
Add Some Logic
After you added the Event Of onTabSelected add some logic inside. If the position equal to 0, it wil return position of the First Tab. It's mean our tab position start from 0, 1, and 2. Not start from 1, 2, and 3. Ok add some block looks like image below :
Getting Better Understanding, I created video below and give you detail explaination.
Thank you very much guys for visit my blog see you. In the next tutorials, I'll start to share my project and give you lesson how to integrate with database.
