loading-balls

A highly configurable library to do loading progress with animated balls

Subscribe to updates I use loading-balls


Statistics on loading-balls

Number of watchers on Github 897
Number of open issues 8
Average time to close an issue about 16 hours
Main language Java
Open pull requests 0+
Closed pull requests 0+
Last commit over 2 years ago
Repo Created over 2 years ago
Repo Last Updated 5 months ago
Size 13.2 MB
Organization / Authorglomadrian
Contributors1
Page Updated
Do you use loading-balls? Leave a review!
View open issues (8)
View loading-balls activity
View on github
Latest Open Source Launches
Trendy new open source projects in your inbox! View examples

Subscribe to our mailing list

Evaluating loading-balls for your project? Score Explanation
Commits Score (?)
Issues & PR Score (?)

Loading Balls

Download

A highly configurable library to do loading progress with animated balls for Android

Demo Screenshot

How to use

Custom attributes

lib:path="triangle"

The shape of the movement, available:

*  infinite
*  square
*  triangle
*  circle
*  diamond
*  star
lib:balls="3"

Number of balls used in the animation

lib:movement_cycle_time="1500"

The time which the ball takes to do a complete cicle

lib:enable_size_animation="true"

Enables the size animation in the balls (by default is false)

lib:size_cycle_time="500"

The time it takes to the ball to grow up and decrease the size one time

lib:ball_size="6dp"

Set the balls size

lib:min_ball_size="5dp"
lib:max_ball_size="12dp"

To use with enable_size_animation=true, set the min and the max ball size

lib:ball_colors="@array/colors"

Array of colors for the balls, if there are more balls than colors then repeat color balls

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <color name="ball1">#FFD91C</color>
  <color name="ball2">#FF4B4A</color>
  <color name="ball3">#3D8EFF</color>

  <integer-array name="colors">
    <item>@color/ball1</item>
    <item>@color/ball2</item>
    <item>@color/ball3</item>
  </integer-array>
</resources>

Sample colors array

For Gradle

Add repository

repositories {
  maven {
    url "http://dl.bintray.com/glomadrian/maven"
  }
}

Add dependency

  compile 'com.github.glomadrian:loadingballs:1.1@aar'

Some Samples

Default Infinite shape

Sample

<com.github.glomadrian.loadingballs.BallView
     android:layout_margin="30dp"
     android:layout_width="100dp"
     android:layout_height="100dp"
     lib:balls="3"
     lib:movement_cycle_time="1500"
     lib:enable_size_animation="true"
     lib:size_cycle_time="500"
     lib:min_ball_size="5dp"
     lib:max_ball_size="12dp"
     lib:ball_colors="@array/colors"
     android:layout_gravity="center"
     />

Infinite shape without size animation

Sample

<com.github.glomadrian.loadingballs.BallView
      android:layout_margin="30dp"
      android:layout_width="100dp"
      android:layout_height="100dp"
      lib:balls="3"
      lib:movement_cycle_time="1000"
      lib:enable_size_animation="false"
      lib:ball_colors="@array/colors"
      android:layout_gravity="center"
      />

Infinite shape with 5 balls

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="5"
    lib:movement_cycle_time="1500"
    lib:enable_size_animation="true"
    lib:size_cycle_time="500"
    lib:min_ball_size="5dp"
    lib:max_ball_size="12dp"
    lib:ball_colors="@array/colors"
    android:layout_gravity="center"
    />

Triangle shape with 3 balls and size animation

Sample

<com.github.glomadrian.loadingballs.BallView
       android:layout_margin="30dp"
       android:layout_width="100dp"
       android:layout_height="100dp"
       lib:balls="3"
       lib:movement_cycle_time="1500"
       lib:enable_size_animation="true"
       lib:size_cycle_time="500"
       lib:min_ball_size="5dp"
       lib:max_ball_size="12dp"
       lib:ball_colors="@array/colors"
       lib:path="triangle"
       android:layout_gravity="center"
       />

Triangle shape with 2 balls

Sample

<com.github.glomadrian.loadingballs.BallView
        android:layout_margin="30dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        lib:balls="2"
        lib:movement_cycle_time="800"
        lib:enable_size_animation="false"
        lib:ball_colors="@array/colors"
        lib:path="triangle"
        android:layout_gravity="center"
        />

Square shape with 3 balls

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="3"
    lib:movement_cycle_time="800"
    lib:enable_size_animation="false"
    lib:ball_colors="@array/colors"
    lib:path="square"
    android:layout_gravity="center"
    />

Square shape with 5 balls and size animation

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="5"
    lib:movement_cycle_time="1200"
    lib:enable_size_animation="true"
    lib:size_cycle_time="500"
    lib:min_ball_size="5dp"
    lib:max_ball_size="12dp"
    lib:ball_colors="@array/colors"
    lib:path="square"
    android:layout_gravity="center"
    />

Circle shape with 3 balls and size animation

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="3"
    lib:movement_cycle_time="1200"
    lib:enable_size_animation="true"
    lib:size_cycle_time="1500"
    lib:min_ball_size="5dp"
    lib:max_ball_size="12dp"
    lib:ball_colors="@array/colors"
    lib:path="circle"
    android:layout_gravity="center"
    />

Circle shape with 2 balls without size animation

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="2"
    lib:movement_cycle_time="700"
    lib:enable_size_animation="false"
    lib:ball_colors="@array/colors"
    lib:path="circle"
    android:layout_gravity="center"
    />

Star shape with 10 balls without size animation

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="10"
    lib:movement_cycle_time="2500"
    lib:enable_size_animation="false"
    lib:ball_colors="@array/colors"
    lib:path="star"
    lib:ball_size="5dp"
    android:layout_gravity="center"
    />

Star shape with 5 balls and size animation

Sample

<com.github.glomadrian.loadingballs.BallView
         android:layout_margin="30dp"
         android:layout_width="100dp"
         android:layout_height="100dp"
         lib:balls="5"
         lib:movement_cycle_time="2500"
         lib:ball_colors="@array/colors"
         lib:path="star"
         lib:ball_size="5dp"
         lib:enable_size_animation="true"
         lib:size_cycle_time="800"
         lib:min_ball_size="5dp"
         lib:max_ball_size="8dp"
         android:layout_gravity="center"
         />

Star shape with 3 balls and size animation

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="3"
    lib:movement_cycle_time="2500"
    lib:ball_colors="@array/colors"
    lib:path="star"
    lib:ball_size="5dp"
    lib:enable_size_animation="true"
    lib:size_cycle_time="800"
    lib:min_ball_size="5dp"
    lib:max_ball_size="8dp"
    android:layout_gravity="center"
    />

Diamond shape with 5 balls without size animation

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="5"
    lib:movement_cycle_time="2500"
    lib:ball_colors="@array/colors"
    lib:path="diamond"
    lib:ball_size="6dp"
    android:layout_gravity="center"
    />

Diamond shape with 4 balls and size animation

Sample

<com.github.glomadrian.loadingballs.BallView
         android:layout_margin="30dp"
         android:layout_width="100dp"
         android:layout_height="100dp"
         lib:balls="4"
         lib:movement_cycle_time="2500"
         lib:ball_colors="@array/colors"
         lib:path="diamond"
         lib:ball_size="5dp"
         lib:enable_size_animation="true"
         lib:size_cycle_time="800"
         lib:min_ball_size="5dp"
         lib:max_ball_size="8dp"
         android:layout_gravity="center"
         />

Diamond shape with 10 balls without size animation

Sample

<com.github.glomadrian.loadingballs.BallView
    android:layout_margin="30dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    lib:balls="10"
    lib:movement_cycle_time="2500"
    lib:ball_colors="@array/colors"
    lib:path="diamond"
    lib:ball_size="4dp"
    android:layout_gravity="center"
    />

Developed By

Adrin Garca Lomas - glomadrian@gmail.com

License

Copyright 2015 Adrin Garca Lomas

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
loading-balls open issues Ask a question     (View All Issues)
  • about 2 years android:allowBackup=true shouldn't be used in the library
  • about 2 years Balls don't always respect configurations
  • over 2 years ClassNotFoundError : BaseInterpolator
  • over 2 years Auto start/stop with visibility change
  • over 2 years High CPU use after stopping the animation with size animation enabled
  • over 2 years Add support for creating BallView programmtically
loading-balls list of languages used
Other projects in Java