Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature Request for Inactive step color #132

Open
paramarthasaha96 opened this issue Mar 31, 2020 · 4 comments
Open

Feature Request for Inactive step color #132

paramarthasaha96 opened this issue Mar 31, 2020 · 4 comments

Comments

@paramarthasaha96
Copy link

First of Thanks for the wonderful library.
I would like to ask for a feature where we can set inactive step color. Currently we can select only the step color but it would be very useful if we can select colors for inactive steps and active steps separately. Thanks once again!

@rajBopche
Copy link

Any updates on this, many are waiting for this feature, cool library though, already did a lot for us.

@rajBopche
Copy link

rajBopche commented May 7, 2020

Extending this project, I actually implemented a way to have a different colour for steps which are activated i.e steps which are within the range. Works only for app:rsb_mode="range"

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;

import com.jaygoo.widget.RangeSeekBar;
import com.jaygoo.widget.SeekBarState;

public class CustomRangePickerJava extends RangeSeekBar {


    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
    }

    public CustomRangePickerJava(Context context) {
        super(context);
    }

    public CustomRangePickerJava(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    public void onDrawSteps(Canvas canvas, Paint paint) {
        float stepIncrementer = getMinProgress();
        RectF stepDivRect = new RectF();
        SeekBarState[] states = getRangeSeekBarState();
        int stepMarks = getProgressWidth() / (getSteps());
        float extHeight = (getStepsHeight() - getProgressHeight()) / 2f;
        for (int k = 0; k <= getSteps(); k++) {
            float x = getProgressLeft() + k * stepMarks - getStepsWidth() / 2f;
            stepDivRect.set(x, getProgressTop() - extHeight, x + getStepsWidth(), getProgressBottom() + extHeight);
            paint.setColor(getStepsColor());
            if (stepIncrementer >= states[0].value && stepIncrementer <= states[1].value) {
                paint.setColor(getProgressColor());
            }
            canvas.drawRoundRect(stepDivRect, getStepsRadius(), getStepsRadius(), paint);
            stepIncrementer += getMaxProgress() / getSteps();
        }
    }
}

Just paste this class in your project and then use in XML as follows

<com.example.seekbartest.CustomRangePickerJava
        android:id="@+id/seekbar2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/seekbar"
        app:rsb_gravity="center"
        app:rsb_indicator_background_color="#333333"
        app:rsb_indicator_height="wrap_content"
        app:rsb_indicator_padding_bottom="8dp"
        app:rsb_indicator_padding_left="8dp"
        app:rsb_indicator_padding_right="8dp"
        app:rsb_indicator_padding_top="8dp"
        app:rsb_indicator_show_mode="alwaysShowAfterTouch"
        app:rsb_indicator_text_color="#ffffff"
        app:rsb_indicator_text_size="10sp"
        app:rsb_indicator_width="wrap_content"
        app:rsb_max="5000"
        app:rsb_min="0"
        app:rsb_mode="range"
        app:rsb_progress_color="#0a9883"
        app:rsb_progress_default_color="#e0e0e0"
        app:rsb_progress_height="6dp"
        app:rsb_step_auto_bonding="true"
        app:rsb_step_color="#e0e0e0"
        app:rsb_step_height="8dp"
        app:rsb_step_radius="2dp"
        app:rsb_step_width="8dp"
        app:rsb_steps="10"
        app:rsb_thumb_drawable="@drawable/ic_scroll_control"
        app:rsb_thumb_height="20dp"
        app:rsb_thumb_inactivated_drawable="@drawable/ic_scroll_control"
        app:rsb_thumb_width="20dp" />

@paramarthasaha96
Copy link
Author

Yea did it in the same way but would be a great addition to the library if it is supported from the xml layout directly.

@rajBopche
Copy link

This could be easily implemented from XML. I would like to raise a PR request for this feature if the original author wishes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants