Connect with us

Code

Android Circular Slider – Highly Customizable Circular Slider for Jetpack Compose

Features

  • Great look and feel with lots of customization
  • Customisable circular slider
  • Customisable simple thumb
  • Simple to Implement

Attributes

Attribute Description
maxNum To provide maximum number for the slider
radiusCircle Radius of the circular slider
percentageFontSize Font size of the percentage text
percentageColor Color of the percentage text
progressWidth Width of the Progress
animDuration To set duration for the sliding animation
animDelay To set delay for the sliding animation
strokeCap To set strokes of the ends
thumbRadius To set the radius of the thumb
tickColor To set the color of the minute-like clock arms
tickhighlightedColor To set the color of the hour-like clock arms
dialColor Dial color
progressColor Color of the progress bar
startThumbCircleColor Initial thumb color
thumbColor Thumb color
trackColor Track color
trackOpacity Opacity of the track
trackWidth Width of the track
isDisabled Flag to set enabled/disabled circular slider
staticProgress Static progress in case if isDisabled is true

thinking How to use it?

1. Add this in your root build.gradle at the end of repositories:

allprojects {
          repositories {
              maven { url 'https://jitpack.io' }
          }
}

2. Add the dependency in your app’s build.gradle file:

dependencies {
    implementation 'com.github.Mindinventory:circularslider:X.X.X'
}

3. Use this code inside your composable:

fun CircularProgressBar(
    maxNum: Int = 50,
    radiusCircle: Dp = 150.dp,
    percentageFontSize: TextUnit = 28.sp,
    percentageColor: Color = DeepBlue,
    progressWidth: Float = 28f,
    animDuration: Int = 1000,
    animDelay: Int = 0,
    strokeCap: StrokeCap = StrokeCap.Round,
    thumbRadius: Float = 40f,
    tickColor: Color = SkyBlue,
    tickhighlightedColor: Color = TextWhite,
    dialColor: Color = DullPurple,
    progressColor: Brush = Brush.linearGradient(colors = listOf(SkyBlue, Color.White)),
    startThumbCircleColor: List<Color> = listOf(SkyBlue, SkyBlue),
    thumbColor: List<Color> = listOf(Color.White, Color.White),
    trackColor: Color = Color.Black,
    trackOpacity: Float = 0.10f,
    trackWidth: Float = 20f,
    isDisabled: Boolean = false,
    staticProgress: Float = 0f,
)
Android Circular Slider on GitHub: https://github.com/Mindinventory/AndroidCircularSlider
Platform: Android
⭐️: 23
Related Topics:
Advertisement

Trending