Description
Small library allowing you to make a smooth indeterminate progress bar. You can either user your progress bars and set this drawable or use directly the SmoothProgressBarView.
Demo:
Sample app available on the Play Store
How does it work
I wrote a blog post about that.
Integration
SmoothProgressBar (min API 7):
CircularProgressBar (min API 14):
The lib is now on Maven Central. All you have to do is add it on your gradle build:
dependencies {
// of course, do not write x.x.x but the version number
compile 'com.github.castorflex.smoothprogressbar:library:x.x.x'
// or
compile 'com.github.castorflex.smoothprogressbar:library-circular:x.x.x'
}
You can find the last stable version on Gradle Please
Or you can try the latest snapshots:
repositories {
maven { url "https://oss.sonatype.org/content/repositories/snapshots/" }
}
dependencies {
compile 'com.github.castorflex.smoothprogressbar:library:1.0.1-SNAPSHOT@aar'
compile 'com.github.castorflex.smoothprogressbar:library-circular:1.0.1-SNAPSHOT@aar'
}
If you really want (or have) to use Eclipse, please look at the forks.
Usage
- Use directly SmoothProgressBar:
<fr.castorflex.android.smoothprogressbar.SmoothProgressBar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:indeterminate="true"
app:spb_sections_count="4"
app:spb_color="#FF0000"
app:spb_speed="2.0"
app:spb_stroke_width="4dp"
app:spb_stroke_separator_length="4dp"
app:spb_reversed="false"
app:spb_mirror_mode="false"
app:spb_progressiveStart_activated="true"
app:spb_progressiveStart_speed="1.5"
app:spb_progressiveStop_speed="3.4"
/>
<fr.castorflex.android.circularprogressbar.CircularProgressBar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:indeterminate="true"
app:cpb_color="#FFee44"
app:cpb_colors="@array/mycolors"
app:cpb_rotation_speed="1.0"
app:cpb_sweep_speed="1.0"
app:cpb_stroke_width="4dp"
app:cpb_min_sweep_angle="10"
app:cpb_max_sweep_angle="300"
/>
Or use styles:
<style name="AppTheme">
<item name="spbStyle">@style/GNowProgressBar</item>
<item name="cpbStyle">@style/CircularThemeProgressBar</item>
</style>
<style name="GNowProgressBar" parent="SmoothProgressBar">
<item name="spb_stroke_separator_length">0dp</item>
<item name="spb_sections_count">2</item>
<item name="spb_speed">1.7</item>
<item name="spb_progressiveStart_speed">2</item>
<item name="spb_progressiveStop_speed">3.4</item>
<item name="spb_interpolator">spb_interpolator_acceleratedecelerate</item>
<item name="spb_mirror_mode">true</item>
<item name="spb_reversed">true</item>
<item name="spb_colors">@array/gplus_colors</item>
<item name="spb_progressiveStart_activated">true</item>
</style>
<style name="CircularThemeProgressBar" parent="android:Widget.Holo.ProgressBar">
<item name="cpb_color">@color/cpb_default_color</item>
<item name="cpb_stroke_width">@dimen/cpb_default_stroke_width</item>
<item name="cpb_min_sweep_angle">@integer/cpb_default_min_sweep_angle</item>
<item name="cpb_max_sweep_angle">@integer/cpb_default_max_sweep_angle</item>
<item name="cpb_sweep_speed">@string/cpb_default_sweep_speed</item>
<item name="cpb_rotation_speed">@string/cpb_default_rotation_speed</item>
</style>
You can find more styles in the sample app
- Or instantiate a
SmoothProgressDrawable/CircularProgressDrawableand set it to your ProgressBar
mProgressBar.setIndeterminateDrawable(new SmoothProgressDrawable.Builder(context)
.color(0xff0000)
.interpolator(new DecelerateInterpolator())
.sectionsCount(4)
.separatorLength(8) //You should use Resources#getDimensionPixelSize
.strokeWidth(8f) //You should use Resources#getDimension
.speed(2f) //2 times faster
.progressiveStartSpeed(2)
.progressiveStopSpeed(3.4f)
.reversed(false)
.mirrorMode(false)
.progressiveStart(true)
.progressiveStopEndedListener(mListener) //called when the stop animation is over
.build());
mProgressBar.setIndeterminateDrawable(new CircularProgressDrawable
.Builder(this)
.colors(getResources().getIntArray(R.array.gplus_colors))
.sweepSpeed(1f)
.strokeWidth(mStrokeWidth)
.style(CircularProgressDrawable.Style.ROUNDED)
[ ... ]
.build();
You can also set many colors for one bar (see G+ app)
-
via xml (use the
app:spb_colorsattribute with ainteger-arrayreference for that) -
programmatically (use
SmoothProgressDrawable.Builder#colors(int[])method).
License
Copyright 2014 Antoine Merle
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.
Badges
Travis master:
Travis dev:
And infinite bars. For example, when sections count is not defined and bar width is defined, bars will repeat on all available width.
1.2k Jan 3, 2023
162 Dec 2, 2022
1.5k Jan 9, 2023
1.3k Nov 15, 2022
6k Jan 7, 2023
206 Dec 18, 2022
40 Dec 11, 2022
957 Nov 15, 2022
1.1k Nov 19, 2022
409 Dec 3, 2022
2.2k Jan 1, 2023
541 Jan 1, 2023
399 Dec 29, 2022
881 Dec 30, 2022
93 Nov 29, 2022
2.1k Dec 31, 2022
90 Dec 15, 2022