In this article, we will learn about how to add Croller in android. Croller is used to implement circular Seekbar in android. Seekbar is a type of progress bar. We can drag the seekbar from left to right and vice versa and hence changes the current progress. This is how a Croller look like.
Table of Attributes
| XML Attribute | Java set method | Functionality |
| anticlockwise | setAntiClockwise(boolean anticlockwise) | Set the direction of rotation |
| progress | setProgress(int progress) | Set the current progress of the seekbar |
| label | setLabel(String str) | Set the label |
| label_size | setLabelSize(int size) | Set the label size |
| label_color | setLabelColor(int color) | Set the label color |
| is_continuous | setIsContinuous(boolean bool) | Set whether seekbar is conitnuous or discrete |
| max | setMax(int max) | Set the maximum value of the seekbar |
| min | setMin(int min) | Set the minimum value of the seekbar (Default is 1) |
| start_offset | setStartOffset(int offset) | Set the seekbar start offset angle from bottom horizontal center |
| sweep_angle | setSweepAngle(int angle) | Set the total angle covered by the seekbar |
| progress_primary_stroke_width | setProgressPrimaryStrokeWidth(float width) | Set the primary progress thickness for continuous type |
| progress_secondary_stroke_width | setProgressSecondaryStrokeWidth(float width) | Set the secondary progress thickness for continuous type |
| progress_primary_circle_size | setProgressPrimaryCircleSize(float size) | Set the primary progress circle size for discrete type |
| progress_secondary_circle_size | setProgressSecondaryCircleSize(float size) | Set the secondary progress circle size for discrete type |
| indicator_width | setIndicatorWidth(float width) | Set the progress indicator width |
| indicator_color | setIndicatorColor(int color) | Set the progress indicator color |
| progress_primary_color | setProgressPrimaryColor(int color) | Set the progress primary(active) color |
| progress_secondary_color | setProgressSecondaryColor(int color) | Set the progress secondary(inactive) color |
| progress_radius | Â setProgressRadius(float radius) | Set the radius of the progress arc |
| main_circle_radius | setMainCircleRadius(float radius) | Set the main(front) circle radius |
| back_circle_radius | setBackCircleRadius(float radius) | Set the back circle radius |
| main_circle_color | setMainCircleColor(int color) | Set the main(front) circle color |
| back_circle_color | setBackCircleColor(int color) | Set the back circle color |
Getting Started
Step 1: Add the support Library in build.gradle file and add dependency in the dependencies section.
implementation ‘com.sdsmdg.harjot:croller:1.0.7’
Step 2: Add the following code in activity_main.xml file. In this file we add our Croller to the layout.
activity_main.xml
   <?xml version="1.0" encoding="utf-8"?><RelativeLayout     android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="#FFFFFF"    tools:context=".MainActivity">      <com.sdsmdg.harjot.crollerTest.Croller        android:id="@+id/croller"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_centerInParent="true"        app:back_circle_color="#EDEDED"        app:indicator_color="#0B3C49"        app:indicator_width="10"        app:is_continuous="false"        app:label="Set Difficulty Level"        app:label_color="#000000"        app:main_circle_color="#FFFFFF"        app:max="50"        app:progress_primary_color="#0B3C49"        app:progress_secondary_color="#EDEDED"        app:start_offset="45">  </RelativeLayout> |
Step 3: Add the following code in MainActivity.java file. In this we add setOnCrollerChangeListener() to our croller so whenever there is a change in progress setOnCrollerChangeListener() get invoked automatically.
MainActivity.xml
   package org.neveropen.croller  import androidx.appcompat.app.AppCompatActivity;import android.os.Bundle;import android.widget.Toast;import com.sdsmdg.harjot.crollerTest.Croller;import com.sdsmdg.harjot.crollerTest.OnCrollerChangeListener;  public class MainActivity extends AppCompatActivity {      @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);          Croller croller = findViewById(R.id.croller);          // when there is a change in the progress of croller        // this function get invoked automatically        croller.setOnCrollerChangeListener(            new OnCrollerChangeListener() {            @Override            public void onProgressChanged(Croller croller,                        int progress) {              }                          // when the user is starting to change the progress            // this function gets invoked automatically.            @Override            public void onStartTrackingTouch(Croller croller) {                Toast.makeText(MainActivity.this,                       "Start", Toast.LENGTH_SHORT).show();            }              // when the user stops to change the progress            // this function gets invoked automatically.            @Override            public void onStopTrackingTouch(Croller croller) {                Toast.makeText(MainActivity.this,                       "Stop", Toast.LENGTH_SHORT).show();            }        });      }} |
