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

Jump to bottom

Add gradient center color in progressView #17

Merged
merged 2 commits into from
Jul 2, 2021
Merged

Add gradient center color in progressView #17

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ac9ef6b
Add gradient center color in progressView
Ten-Wang Jun 25, 2021
b7e5050
refactor to the higher order functions
Ten-Wang Jul 2, 2021
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
39 changes: 28 additions & 11 deletions progressview/src/main/java/com/skydoves/progressview/HighlightView.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,11 +91,19 @@ class HighlightView(
updateHighlightView()
}

@ColorInt var colorGradientEnd: Int = NO_COLOR
set(value) {
field = value
updateHighlightView()
}
@ColorInt
var colorGradientCenter: Int = NO_COLOR
set(value) {
field = value
updateHighlightView()
}

@ColorInt
var colorGradientEnd: Int = NO_COLOR
set(value) {
field = value
updateHighlightView()
}

var highlight: Drawable? = null
set(value) {
Expand Down Expand Up @@ -132,12 +140,21 @@ class HighlightView(
if (orientation == ProgressViewOrientation.VERTICAL) {
gradientOrientation = GradientDrawable.Orientation.TOP_BOTTOM
}
GradientDrawable(
gradientOrientation,
intArrayOf(colorGradientStart, colorGradientEnd)
).apply {
applyRadius(this)
}
if (colorGradientCenter == NO_COLOR) {
GradientDrawable(
gradientOrientation,
intArrayOf(colorGradientStart, colorGradientEnd)
).apply {
applyRadius(this)
}
} else {
GradientDrawable(
gradientOrientation,
intArrayOf(colorGradientStart, colorGradientCenter, colorGradientEnd)
).apply {
applyRadius(this)
}
}
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about this way?

GradientDrawable(
        gradientOrientation,
        intArrayOf(colorGradientStart, colorGradientCenter, colorGradientEnd)
          .filter { it != NO_COLOR }.toIntArray()
      ).apply {
        applyRadius(this)
      }

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because I want to do like this picture (yellow progress bar), I want add color in gradient center .
image

Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, exactly. So I added colorGradientCenter on the int array and filtered if the color value is NO_COLOR on my suggestion. 😄

Copy link
Contributor Author

@Ten-Wang Ten-Wang Jul 2, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh! I understand what you said, right.
So I refactor it.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Update at commit b7e5050

} else if (highlight == null) {
GradientDrawable().apply {
setColor(this@HighlightView.color)
Expand Down
6 changes: 6 additions & 0 deletions progressview/src/main/java/com/skydoves/progressview/ProgressView.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -349,6 +349,8 @@ class ProgressView : FrameLayout {
color = a.getColor(R.styleable.ProgressView_progressView_colorProgress, color)
colorGradientStart =
a.getColor(R.styleable.ProgressView_progressView_colorGradientStart, NO_COLOR)
colorGradientCenter =
a.getColor(R.styleable.ProgressView_progressView_colorGradientCenter, NO_COLOR)
colorGradientEnd =
a.getColor(R.styleable.ProgressView_progressView_colorGradientEnd, NO_COLOR)
radius = this@ProgressView.radius
Expand Down Expand Up @@ -694,6 +696,10 @@ class ProgressView : FrameLayout {
this.progressView.highlightView.colorGradientStart = value
}

fun setProgressbarColorGradientCenter(@ColorInt value: Int): Builder = apply {
this.progressView.highlightView.colorGradientCenter = value
}

fun setProgressbarColorGradientEnd(@ColorInt value: Int): Builder = apply {
this.progressView.highlightView.colorGradientEnd = value
}
Expand Down
2 changes: 2 additions & 0 deletions progressview/src/main/res/values/attrs_progressview.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,8 @@
<attr name="progressView_colorBackground" format="color" />
<!-- starting color of the gradient. -->
<attr name="progressView_colorGradientStart" format="color" />
<!-- center color of the gradient. -->
<attr name="progressView_colorGradientCenter" format="color" />
<!-- ending color of the gradient. -->
<attr name="progressView_colorGradientEnd" format="color" />
<!-- starts filling animation automatically when finishing inflate. -->
Expand Down