How to create fan control dial with android custom view.

Fan control dial example, In this example we create circular UI which represent physical fan dial control.



we use Custom view which extends from View class for draw a circular fan dial control and this custom view also draw text labels and indicator for settings fan speed.

0 means fan is off.
1 means fan is law.
2 means fan is medium.
3 means fan is high. 

When user click on fan dail then we move dial indicator to next position and we also change the fan dial color from Off to On when section is 1-3 for indicating that fan is turn on.  

Step -1       
First we create attribute file under the res/value folder this file is named attrs.xml.
In this attrs.xml file we create custom attribute for our custom fan dial view. 
attrs.xml 

Step - 2
In this step we create FanControlView class which extends View class, we will put all the logic inside this class.
 
FanControlView.java

  
Step - 3
In 3th Step we create activity_main.xml file under the res/layout.In activity_main.xml we use the 
FanControlView Class which we created in step-2. 

activity_main.xml

Step -4
In 4th Step we create MainActivity class which extends AppCompactActivity class,
This class is our main activity we uses activity_main.xml file to draw UI.

MainActivity.java
Please Leave your comment and let us know your thoughts.
So we can provide more useful tutorials.

No comments:

Post a Comment