Android Implementation of Dynamic Range Control Widget

Let's take a look at the effect first:

I. Steps to add dependency libraries

1Modify the following changes in the gradle file of the project

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

2.Add the latest version of the dependency library, as shown on the right, change the version at the end (because I sometimes forget to update the version in readme when I update the version)

dependencies {
   compile 'com.github.Brioal:BrioalSetting:1.0'
   ////For example, the latest version above is1.1, then just change1.0 to1.1You can use the latest version
 }

Second, steps for use:

1.xml layout file

In actual use, if used with other components, the sliding event will fail. The temporary solution has not been found in the code, and setting focus does not work. The temporary solution is to add a parent layout for the component and not include other components. As follows:

<LinearLayout
  android:id="@"+id/layout"
android:layout_centerInParent="true"
  android:layout_width="match_parent"
  android:layout_height="wrap_content">
  <com.brioal.rangeseek.view.RangeBar
   android:id="@"+id/main_container"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:layout_centerInParent="true"/>
 </LinearLayout>

2.Code setting

mRangeBar = (RangeBar) findViewById(R.id.main_container);
   //Add data source
  final List<RangeEntity> list = new ArrayList<>();
  //The text to be displayed and the actual value are of String and Object types, respectively
  list.add(new RangeEntity("15℃", 15));
  list.add(new RangeEntity("18℃", 18));
  list.add(new RangeEntity("21℃", 21));
  list.add(new RangeEntity("24℃", 24));
  list.add(new RangeEntity("27℃", 27));
  list.add(new RangeEntity("30℃", 30));
  //Set data source
  mRangeBar.setValues(list);
  //Add range change listener
  mRangeBar.addOnRangeChangedListener(new OnRangeChangedListener() {
   @Override
   public void selected(int startIndex, int endIndex) {
   //The data obtained is the index of the start and end in the List
    mTvMin.setText(list.get(startIndex).getValue() + ");
    mTvMax.setText(list.get(endIndex).getValue() + ");
   }
  });

3.Methods provided for custom views

Method Function
void addOnRangeChangedListener(OnRangeChangedListener listener) Set the event listener
void setLineColor(int lineColor) Set the line color in the middle
void setLineWidth(int lineWidth) Set the line width in the middle
void setCircleColor(int circleColor) Set the border color of the point
void setCircleRadius(int circleRadius) Set the radius of the point
void setCircleWidth(int circleWidth) Set the line width of the point
void setCenterColor(int centerColor) Set the fill color of the selected point
void setPointColor(int pointColor) Set the fill color of the cursor
void setStartIndex(int startIndex) Set the selected start index
int getStartIndex() Get the selected start index
void setEndIndex(int endIndex) Set the end index
int getEndIndex() Get the end index

Summary

That is all the content of this article, I hope this article can bring some help to everyone's learning or work, if you have any questions, you can leave a message for communication.