FillProgressLayout
A simple and flexible Fillable Progress Layout written in Kotlin
Install / Use
/learn @JDevZone/FillProgressLayoutREADME
<a href="https://github.com/JDevZone/FillProgressLayout"> <img align="center" src="sample.gif" width="100%" height="10%" /> </a>
<h4 align="center" >Netflix button animation using FillProgressLayout</h4> <a href="https://github.com/JDevZone/FillProgressLayout"> <img align="center" src="art/netflix_anim.gif" width="100%" height="10%" /> </a>
<a align="center" href="https://github.com/JDevZone/FillProgressLayoutSupport">Support Library alternative is available here</a>
Installation
- Add it in your root build.gradle at the end of repositories:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
- Add the dependency in app gradle
dependencies {
implementation 'com.github.JDevZone:FillProgressLayout:{latest_version}'
}
Basic usage
As
FillProgressLayoutis direct child ofLinearLayoutyou can replace LinearLayout with it as follows
<com.devzone.fillprogresslayout.FillProgressLayout
android:id="@+id/fillL"
android:layout_margin="30dp"
app:fpl_backgroundColor="@color/colorRedTrans"
app:fpl_progressColor="@color/colorGreenTrans"
app:fpl_isRounded="false"
app:fpl_progress="0"
app:fpl_progressDuration="3000"
app:fpl_progressDirection="left_to_right"
app:fpl_shouldRestart="false"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<--childviews-->
</com.devzone.fillprogresslayout.FillProgressLayout>
Alternatively
You can use
FillProgressLayoutas background for other layouts.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<--as background for AppCompatTextView-->
<com.devzone.fillprogresslayout.FillProgressLayout
android:layout_alignBottom="@+id/tv"
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/tv"
android:text="@string/app_name"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</RelativeLayout>
Samples
| Fill Direction | Demo | | --- | :---: | | <p align="center">Left To Right</p> | <img src="art/left_to_right.gif" width="90%"/> | | <p align="center">Right To Left</p> | <img src="art/right_to_left.gif" width="90%" /> | | <p align="center">Top To Bottom</p> | <img src="art/top_to_bottom.gif" width="90%" /> | | <p align="center">Bottom To Top</p> | <img src="art/bottom_to_top.gif" width="90%" /> |
Additional
Rounded Corners sample
<img align="left" src="art/rounded_corners.gif" width="100%" />Gradient Progress sample
<img align="left" src="art/gradient.gif" width="100%" />Customisation
Here are the attributes you can specify through XML or related setters programatically:
fpl_backgroundColor- Set background color.fpl_progressColor- Set progress color.fpl_isRounded- Set true if you need rounded corners.fpl_roundedCornerRadius- Set radius for round corners.fpl_progress- Set current progress.fpl_progressDuration- Set fill duration.fpl_shouldRestart- Set if progress filling should restart from 0.fpl_progressDirection- Set fill direction. i.e.left_to_right,right_to_left,top_to_bottomorbottom_to_topfpl_gradientColors- Set array of gradient colors i.e.@array/gradientColorsfpl_gradientMovement- Set true for gradient movement with progress and false for static fillingfpl_gradientDirection- Set Gradient direction. i.e.left_to_right,right_to_left,top_to_bottom,bottom_to_top,top_left_to_bottom_right,top_right_to_bottom_left,bottom_right_to_top_leftorbottom_left_to_top_right
📄 License
FillProgressLayout is released under the MIT license. See LICENSE for details.
Related Skills
node-connect
351.2kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
110.6kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
351.2kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
qqbot-media
351.2kQQBot 富媒体收发能力。使用 <qqmedia> 标签,系统根据文件扩展名自动识别类型(图片/语音/视频/文件)。
