SelectorBoundarySize is cut-off

[df1994]

In my rangebar I set 'mrb_selectorBoundarySize' to 4dp. Those 4dp are cut of at the left and right of the rangebar view. I set paddingLeft and paddingRight but this doesn't seem to have any impact.

[krazykira]

Which version of materialrangebar are you using ?

[df1994]

The last one, 1.4.3

[krazykira]

Can you paste your xml file, or maybe try forking the repository and changing the sample so that it displays the matrialrangebar in the same way as your screenshot. In that way it will be easy to troubleshoot what is causing the boundary selectors to cut off.

[antonsarmatin]

The same issue. I found that selector boundary starts cutting when selector size more than 11dp.

11dp:

16dp:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="275dp"
    android:background="@drawable/bg_white_bottom_rounded_25dp">

    <TextView
        android:id="@+id/textTitle"
        style="@style/DarkText18"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="14dp"
        android:layout_marginLeft="14dp"
        android:layout_marginTop="21dp"
        android:text="text"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.appyvet.materialrangebar.RangeBar
        android:id="@+id/ageRangeBar"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginStart="17dp"
        android:layout_marginLeft="17dp"
        android:layout_marginEnd="17dp"
        android:layout_marginRight="17dp"
        android:layout_marginBottom="4dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/textTitle"
        app:mrb_barWeight="2dp"
        app:mrb_connectingLineColor="@color/purple"
        app:mrb_connectingLineWeight="2dp"
        app:mrb_pinColor="@android:color/transparent"
        app:mrb_pinTextColor="@android:color/transparent"
        app:mrb_rangeBarColor="@color/grey_25"
        app:mrb_rangeBarPaddingBottom="30dp"
        app:mrb_rangeBar_rounded="true"
        app:mrb_selectorBoundaryColor="@color/orange"
        app:mrb_selectorBoundarySize="2dp"
        app:mrb_selectorColor="@color/white"
        app:mrb_selectorSize="16dp"
        app:mrb_tickColor="@android:color/transparent"
        app:mrb_tickEnd="99"
        app:mrb_tickStart="18" />

</androidx.constraintlayout.widget.ConstraintLayout>

[androuis]

Any update on this? I have the same issue :(

[df1994]

Hi,

I managed to fix this, bu it's some time ago so I'm not sure how anymore.

Here is my XML:

<com.appyvet.materialrangebar.RangeBar
                android:id="@+id/range_bar"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:layout_marginStart="16dp"
                android:layout_marginTop="16dp"
                android:layout_marginEnd="16dp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/range_bar_label"
                app:mrb_connectingLineColor="@color/colorPrimary"
                app:mrb_connectingLineWeight="2dp"
                app:mrb_pinRadius="0dp"
                app:mrb_rangeBarColor="@color/colorPrimaryTransparent"
                app:mrb_selectorBoundaryColor="@color/colorPrimary"
                app:mrb_selectorBoundarySize="4dp"
                app:mrb_selectorColor="@android:color/white"
                app:mrb_selectorSize="12dp"
                app:mrb_tickHeight="0dp" />

If I remember correctly I made 2 changes to the library: In RangeBar.java line 377 change this: final float marginLeft = Math.max(mExpandedPinRadius, mCircleSize); by final float marginLeft = getMarginLeft();

And change getMarginLeft() method at line 1243: return Math.max(mExpandedPinRadius, (mCircleSize + mCircleBoundarySize));

Let me know if this fixes it 👍

[androuis]

I managed to hack it somehow, but your solution is much better...why don't you create a pull request to get the fix merged?

[df1994]

Don't know how....

And not sure that doesn't break other things :s

[Oknesif]

I made a pull request that fixes this issue: https://github.com/oli107/material-range-bar/pull/173