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.

Sign up for GitHub

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

Added customization to Slider #365

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Added customization to Slider #365

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
24353fb
Added customization to Slider
jaytj95 Dec 16, 2015
e585f59
[FIX] changed rippleColor error
jaytj95 Dec 16, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
120 changes: 91 additions & 29 deletions MaterialDesignLibrary/MaterialDesign/src/main/java/com/gc/materialdesign/views/Slider.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,12 @@

public class Slider extends CustomView {

private int backgroundColor = Color.parseColor("#4CAF50");
private int trackColorProgress = Color.parseColor("#4CAF50");
private int trackColorNoProg = Color.parseColor("#B0B0B0");
private int ballColor = Color.parseColor("#4CAF50");
private int trackThickness = 2;
private boolean enablePaddingLr = true;

private Ball ball;
private Bitmap bitmap;
private int max = 100;
Expand Down Expand Up @@ -85,8 +90,12 @@ public void run() {
else {
this.value = value;
float division = (ball.xFin - ball.xIni) / max;
ViewHelper.setX(ball,
value * division + getHeight() / 2 - ball.getWidth() / 2);
if(enablePaddingLr) {
ViewHelper.setX(ball,
value * division + getHeight() / 2 - ball.getWidth() / 2);
} else {
ViewHelper.setX(ball, value * division);
}
ball.changeBackground();
}

Expand Down Expand Up @@ -172,9 +181,18 @@ public boolean onTouchEvent(MotionEvent event) {

@Override
public void setBackgroundColor(int color) {
backgroundColor = color;
//progress color
trackColorProgress = color;
if (isEnabled())
beforeBackground = backgroundColor;
beforeBackground = trackColorProgress;
}

public void setBackgroundColorNoProg(int color) {
trackColorNoProg = color;
}

public void setBallColor(int color) {
ballColor = color;
}

/**
Expand All @@ -183,9 +201,9 @@ public void setBackgroundColor(int color) {
* @return
*/
protected int makePressColor() {
int r = (this.backgroundColor >> 16) & 0xFF;
int g = (this.backgroundColor >> 8) & 0xFF;
int b = (this.backgroundColor >> 0) & 0xFF;
int r = (this.trackColorProgress >> 16) & 0xFF;
int g = (this.trackColorProgress >> 8) & 0xFF;
int b = (this.trackColorProgress >> 0) & 0xFF;
r = (r - 30 < 0) ? 0 : r - 30;
g = (g - 30 < 0) ? 0 : g - 30;
b = (b - 30 < 0) ? 0 : b - 30;
Expand All @@ -210,10 +228,15 @@ protected void onDraw(Canvas canvas) {
canvas.getHeight(), Bitmap.Config.ARGB_8888);
}
Canvas temp = new Canvas(bitmap);
paint.setColor(Color.parseColor("#B0B0B0"));
paint.setStrokeWidth(Utils.dpToPx(2, getResources()));
temp.drawLine(getHeight() / 2, getHeight() / 2, getWidth()
- getHeight() / 2, getHeight() / 2, paint);
paint.setColor(trackColorProgress);
paint.setStrokeWidth(Utils.dpToPx(trackThickness, getResources()));

if(enablePaddingLr) {
temp.drawLine(getHeight() / 2, getHeight() / 2, getWidth()
- getHeight() / 2, getHeight() / 2, paint);
} else {
temp.drawLine(0, getHeight() / 2, getWidth(), getHeight() / 2, paint);
}
Paint transparentPaint = new Paint();
transparentPaint.setColor(getResources().getColor(
android.R.color.transparent));
Expand All @@ -226,21 +249,29 @@ protected void onDraw(Canvas canvas) {
canvas.drawBitmap(bitmap, 0, 0, new Paint());
} else {

paint.setColor(Color.parseColor("#B0B0B0"));
paint.setStrokeWidth(Utils.dpToPx(2, getResources()));
canvas.drawLine(getHeight() / 2, getHeight() / 2, getWidth()
- getHeight() / 2, getHeight() / 2, paint);
paint.setColor(backgroundColor);
paint.setColor(trackColorNoProg);
paint.setStrokeWidth(Utils.dpToPx(trackThickness, getResources()));
if(enablePaddingLr) {
canvas.drawLine(getHeight() / 2, getHeight() / 2, getWidth()
- getHeight() / 2, getHeight() / 2, paint);
} else {
canvas.drawLine(0, getHeight()/2, getWidth(), getHeight()/2, paint);
}
paint.setColor(trackColorProgress);
float division = (ball.xFin - ball.xIni) / (max - min);
int value = this.value - min;

canvas.drawLine(getHeight() / 2, getHeight() / 2, value * division
+ getHeight() / 2, getHeight() / 2, paint);

if(enablePaddingLr) {
canvas.drawLine(getHeight() / 2, getHeight() / 2, value * division
+ getHeight() / 2, getHeight() / 2, paint);
} else {
canvas.drawLine(0, getHeight() / 2, value * division
+ ball.getWidth(), getHeight() / 2, paint);
}
}

if (press && !showNumberIndicator) {
paint.setColor(backgroundColor);
paint.setColor(ballColor);
paint.setAntiAlias(true);
canvas.drawCircle(ViewHelper.getX(ball) + ball.getWidth() / 2,
getHeight() / 2, getHeight() / 3, paint);
Expand All @@ -265,10 +296,25 @@ protected void setAttributes(AttributeSet attrs) {
setBackgroundColor(getResources().getColor(bacgroundColor));
} else {
// Color by hexadecimal
int background = attrs.getAttributeIntValue(ANDROIDXML, "background", -1);
int background = attrs.getAttributeIntValue(MATERIALDESIGNXML, "sliderTrackColor", -1);
if (background != -1)
setBackgroundColor(background);
}
int t_tracknoprog = attrs.getAttributeIntValue(MATERIALDESIGNXML, "sliderTrackColorNoProgress", -1);
if(t_tracknoprog != -1) {
setBackgroundColorNoProg(t_tracknoprog);
}

int t_ballcolor = attrs.getAttributeIntValue(MATERIALDESIGNXML, "sliderBallColor", -1);
if(t_ballcolor != -1) {
setBallColor(t_ballcolor);
}

int t_thickness = attrs.getAttributeIntValue(MATERIALDESIGNXML, "sliderTrackThicknessDp", 2);
setTrackThickness(t_thickness);

boolean t_padding = attrs.getAttributeBooleanValue(MATERIALDESIGNXML, "sliderEnablePaddingLR", true);
setEnablePaddingLr(t_padding);

showNumberIndicator = attrs.getAttributeBooleanValue(MATERIALDESIGNXML,
"showNumberIndicator", false);
Expand All @@ -292,11 +338,27 @@ protected void setAttributes(AttributeSet attrs) {
}

private void placeBall() {
ViewHelper.setX(ball, getHeight() / 2 - ball.getWidth() / 2);
ball.xIni = ViewHelper.getX(ball);
ball.xFin = getWidth() - getHeight() / 2 - ball.getWidth() / 2;
ball.xCen = getWidth() / 2 - ball.getWidth() / 2;
placedBall = true;
if(enablePaddingLr) {
ViewHelper.setX(ball, getHeight() / 2 - ball.getWidth() / 2);
ball.xIni = ViewHelper.getX(ball);
ball.xFin = getWidth() - getHeight() / 2 - ball.getWidth() / 2;
ball.xCen = getWidth() / 2 - ball.getWidth() / 2;
placedBall = true;
} else {
ViewHelper.setX(ball, ball.getWidth());
ball.xIni = 0;//ViewHelper.getX(ball);
ball.xFin = getWidth() - ball.getWidth();// - getHeight() / 2 - ball.getWidth() / 2;
ball.xCen = getWidth() / 2 - ball.getWidth() / 2;
placedBall = true;
}
}

public void setTrackThickness(int trackThickness) {
this.trackThickness = trackThickness;
}

public void setEnablePaddingLr(boolean enablePaddingLr) {
this.enablePaddingLr = enablePaddingLr;
}

// Event when slider change value
Expand All @@ -319,7 +381,7 @@ public void changeBackground() {
LayerDrawable layer = (LayerDrawable) getBackground();
GradientDrawable shape = (GradientDrawable) layer
.findDrawableByLayerId(R.id.shape_bacground);
shape.setColor(backgroundColor);
shape.setColor(ballColor);
} else {
setBackgroundResource(R.drawable.background_switch_ball_uncheck);
}
Expand Down Expand Up @@ -363,7 +425,7 @@ protected void onDraw(Canvas canvas) {

Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setColor(backgroundColor);
paint.setColor(ballColor);
if (animate) {
if (y == 0)
y = finalY + finalSize * 2;
Expand Down
12 changes: 11 additions & 1 deletion MaterialDesignLibrary/MaterialDesign/src/main/res/values/attributes.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<declare-styleable name="CustomAttributes">

<!-- Color of ripple animation -->
<attr name="rippleColor" format="color|reference" />
<attr name="material_rippleColor" format="color|reference" />
<!-- Speed of ripple animation -->
<attr name="rippleSpeed" format="float" />
<!-- indicate if the slider must show number indicator -->
Expand Down Expand Up @@ -32,6 +32,16 @@
<attr name="rippleBorderRadius" format="float" />
<!-- if true, delays calls to OnClickListeners until ripple effect ends -->
<attr name="clickAfterRipple" format="boolean" />
<!-- color for the slider track (left of the ball)-->
<attr name="sliderTrackColor" format="color"/>
<!-- color for part of slider to the right of the progress ball-->
<attr name="sliderTrackColorNoProgress" format="color"/>
<!-- color for the slider ball-->
<attr name="sliderBallColor" format="color"/>
<!-- Slider track thickness-->
<attr name="sliderTrackThicknessDp" format="integer"/>
<!-- Slider disable left/right padding -->
<attr name="sliderEnablePaddingLR" format="boolean"/>
</declare-styleable>

</resources>
14 changes: 7 additions & 7 deletions ...brary/MaterialDesignDemo/src/main/java/com/gc/materialdesigndemo/ui/ProgressActivity.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,13 +24,13 @@ protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_progress);

int color = getIntent().getIntExtra("BACKGROUND", Color.BLACK);
findViewById(R.id.progressBarCircularIndetermininate).setBackgroundColor(color);
findViewById(R.id.progressBarIndeterminate).setBackgroundColor(color);
findViewById(R.id.progressBarIndeterminateDeterminate).setBackgroundColor(color);
findViewById(R.id.progressDeterminate).setBackgroundColor(color);
findViewById(R.id.slider).setBackgroundColor(color);
findViewById(R.id.sliderNumber).setBackgroundColor(color);
// int color = getIntent().getIntExtra("BACKGROUND", Color.BLACK);
// findViewById(R.id.progressBarCircularIndetermininate).setBackgroundColor(color);
// findViewById(R.id.progressBarIndeterminate).setBackgroundColor(color);
// findViewById(R.id.progressBarIndeterminateDeterminate).setBackgroundColor(color);
// findViewById(R.id.progressDeterminate).setBackgroundColor(color);
// findViewById(R.id.slider).setBackgroundColor(color);
// findViewById(R.id.sliderNumber).setBackgroundColor(color);


progreesBarDeterminate = (ProgressBarDeterminate) findViewById(R.id.progressDeterminate);
Expand Down
11 changes: 8 additions & 3 deletions MaterialDesignLibrary/MaterialDesignDemo/src/main/res/layout/activity_progress.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -163,9 +163,13 @@
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#1E88E5"
materialdesign:max="50"
materialdesign:min="0"
materialdesign:sliderTrackColor="#37ff00"
materialdesign:sliderBallColor="#000"
materialdesign:sliderTrackColorNoProgress="#d92e1d"
materialdesign:sliderTrackThicknessDp="10"
materialdesign:sliderEnablePaddingLR="false"
/>
</RelativeLayout>

Expand Down Expand Up @@ -197,10 +201,11 @@
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#1E88E5"
materialdesign:max="50"
materialdesign:min="0"
materialdesign:showNumberIndicator="true" />
materialdesign:showNumberIndicator="true"
materialdesign:sliderTrackColor="#000"
materialdesign:sliderTrackColorNoProgress="#6d6de8"/>
</RelativeLayout>
</LinearLayout>

Expand Down