- Notifications
You must be signed in to change notification settings - Fork30
A cool customizable loading animation with Dots
License
bhargavms/DotLoader
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
(This sucks but you get the idea :))
Currently only gradle supported
Add to your project levelbuild.gradle
'sallprojects
block like this
allprojects { repositories { maven { url "https://jitpack.io" } }}
Next add to your module level (app)build.gradle
's dependencies block like this
Check thereleases section to get the version name for the latest release (i.e the name to replace X.X.X with)
dependencies { compile 'com.github.bhargavms:DotLoader:X.X.X'}
You're all set, Now you can start using the DotLoader class.
This works like any other view in android. You use it in your xml file like this
<com.bhargavms.dotloader.DotLoaderandroid:id="@+id/text_dot_loader"android:layout_width="match_parent"android:layout_height="wrap_content"app:color_array="@array/dot_colors"app:dot_radius="4dp"app:number_of_dots="3"/>
Now I will explain the 3 custom attributes here,
dot_radius
This is the main metric from which all sizes are calculated, if you were to providewrap_content
forlayout_width
andlayout_height
. You can, of course, provide your own height, in which case the animation might look horrible. You can also provide greater width than necessary, but the dots will not spread out to take up width (trust me doesn't look good).
number_of_dots
By default this is 1 (looks ridiculous I know but hey it is your choice!). So just provide the input here for whatever number of dots you want. (you can have a gazzillion, if you can fit in your phone screen xD)
color_array
Ah this is where I made the magic happen! Provide here a reference (like I have in the code aboveapp:color_array="@array/dot_colors"
) to an array of colors which can be declared like so in yourcolors.xml
file
<arrayname="dot_colors"> <item>#03A9F4</item> <item>#E65100</item> <item>#FFBB00</item></array>
What this does is provide the DotLoader instance with a set colors through which the animation iterates over, looks neat don't you think?
If you plan to increase the number of dots on the fly, please remember to call
requestLayout()
on the view, OR provide enough width before hand, then you don't have to callrequestLayout()
and make things choppy
Now for this the DotLoader class comes with thesetNumberOfDots(int numberOfDots)
method. Use this to change the number of dots to whatever you want on the fly and see the magic happen. In the demo app, I demonstrate this by changing the number of dots after a set period using the postDelayed() method from theView
class.
dotLoader.postDelayed(newRunnable() {@Overridepublicvoidrun() {dotLoader.setNumberOfDots(5); }},3000);
This library is heavily inspired bythis design of Blake Manzo
Thats it! QuestionS? ask em in the issues section!Oh aren't I forgetting something? Ah License!
About
A cool customizable loading animation with Dots