Add new conversation button set glow

This commit is contained in:
nielsandriesse 2020-09-08 15:38:39 +10:00
parent 28db2a79a5
commit 70ccb976cb
6 changed files with 57 additions and 31 deletions

View File

@ -7,5 +7,5 @@
<corners android:radius="@dimen/medium_button_corner_radius" /> <corners android:radius="@dimen/medium_button_corner_radius" />
<stroke android:width="@dimen/border_thickness" android:color="?colorAccent" /> <stroke android:width="@dimen/border_thickness" android:color="@color/accent" />
</shape> </shape>

View File

@ -76,7 +76,8 @@
<RelativeLayout <RelativeLayout
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="match_parent"> android:layout_height="match_parent"
android:clipChildren="false">
<androidx.recyclerview.widget.RecyclerView <androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerView" android:id="@+id/recyclerView"

View File

@ -25,6 +25,7 @@
<color name="compose_text_view_background">#141414</color> <color name="compose_text_view_background">#141414</color>
<color name="quote_not_found_background">#99FFFFFF</color> <color name="quote_not_found_background">#99FFFFFF</color>
<color name="new_conversation_button_collapsed_background">#1F1F1F</color> <color name="new_conversation_button_collapsed_background">#1F1F1F</color>
<color name="new_conversation_button_shadow">#077C44</color>
<color name="pn_option_background">#1B1B1B</color> <color name="pn_option_background">#1B1B1B</color>
<color name="pn_option_border">#212121</color> <color name="pn_option_border">#212121</color>
<color name="paths_building">#FFCE3A</color> <color name="paths_building">#FFCE3A</color>

View File

@ -90,3 +90,36 @@ class PNModeView : LinearLayout, GlowView {
} }
// endregion // endregion
} }
class NewConversationButtonImageView : androidx.appcompat.widget.AppCompatImageView, GlowView {
@ColorInt override var mainColor: Int = 0
set(newValue) { field = newValue; paint.color = newValue }
@ColorInt override var sessionShadowColor: Int = 0
set(newValue) { field = newValue; paint.setShadowLayer(toPx(6, resources).toFloat(), 0.0f, 0.0f, newValue) }
private val paint: Paint by lazy {
val result = Paint()
result.style = Paint.Style.FILL
result.isAntiAlias = true
result
}
// region Lifecycle
constructor(context: Context) : super(context) { }
constructor(context: Context, attrs: AttributeSet) : super(context, attrs) { }
constructor(context: Context, attrs: AttributeSet, defStyleAttr: Int) : super(context, attrs, defStyleAttr) { }
init {
setWillNotDraw(false)
}
// endregion
// region Updating
override fun onDraw(c: Canvas) {
val w = width.toFloat()
val h = height.toFloat()
c.drawCircle(w / 2, h / 2, w / 2, paint)
super.onDraw(c)
}
// endregion
}

View File

@ -16,7 +16,7 @@ class LabeledSeparatorView : RelativeLayout {
private val path = Path() private val path = Path()
private val paint: Paint by lazy{ private val paint: Paint by lazy {
val result = Paint() val result = Paint()
result.style = Paint.Style.STROKE result.style = Paint.Style.STROKE
result.color = ThemeUtil.getThemedColor(context, R.attr.dividerHorizontal) result.color = ThemeUtil.getThemedColor(context, R.attr.dividerHorizontal)

View File

@ -7,9 +7,7 @@ import android.animation.ValueAnimator
import android.content.Context import android.content.Context
import android.content.Context.VIBRATOR_SERVICE import android.content.Context.VIBRATOR_SERVICE
import android.content.res.ColorStateList import android.content.res.ColorStateList
import android.graphics.Color
import android.graphics.PointF import android.graphics.PointF
import android.graphics.drawable.GradientDrawable
import android.os.Build import android.os.Build
import android.os.VibrationEffect import android.os.VibrationEffect
import android.os.VibrationEffect.DEFAULT_AMPLITUDE import android.os.VibrationEffect.DEFAULT_AMPLITUDE
@ -66,24 +64,25 @@ class NewConversationButtonSetView : RelativeLayout {
private val collapsedImageViewPosition by lazy { PointF((expandedSize - collapsedSize) / 2, (expandedSize - collapsedSize) / 2) } private val collapsedImageViewPosition by lazy { PointF((expandedSize - collapsedSize) / 2, (expandedSize - collapsedSize) / 2) }
private val imageView by lazy { private val imageView by lazy {
val result = ImageView(context) val result = NewConversationButtonImageView(context)
val size = collapsedSize.toInt() val size = collapsedSize.toInt()
result.layoutParams = LayoutParams(size, size) result.layoutParams = LayoutParams(size, size)
result.setBackgroundResource(R.drawable.new_conversation_button_background) result.setBackgroundResource(R.drawable.new_conversation_button_background)
val background = result.background as GradientDrawable @ColorRes val backgroundColorID = if (isMain) R.color.accent else R.color.new_conversation_button_collapsed_background
@ColorRes val backgroundColorID = if (isMain) @ColorRes val shadowColorID = if (isMain) {
R.color.accent else R.color.new_conversation_button_shadow
R.color.new_conversation_button_collapsed_background } else {
background.color = ColorStateList.valueOf(resources.getColorWithID(backgroundColorID, context.theme)) if (UiModeUtilities.isDayUiMode(context)) R.color.transparent_black_30 else R.color.black
}
result.mainColor = resources.getColorWithID(backgroundColorID, context.theme)
result.sessionShadowColor = resources.getColorWithID(shadowColorID, context.theme)
result.scaleType = ImageView.ScaleType.CENTER result.scaleType = ImageView.ScaleType.CENTER
result.setImageResource(iconID) result.setImageResource(iconID)
result.imageTintList = if (isMain) {
result.imageTintList = if (isMain)
// Always use white icon for the main button.
ColorStateList.valueOf(resources.getColorWithID(android.R.color.white, context.theme)) ColorStateList.valueOf(resources.getColorWithID(android.R.color.white, context.theme))
else } else {
ColorStateList.valueOf(resources.getColorWithID(R.color.text, context.theme)) ColorStateList.valueOf(resources.getColorWithID(R.color.text, context.theme))
}
result result
} }
@ -106,30 +105,21 @@ class NewConversationButtonSetView : RelativeLayout {
} }
fun expand() { fun expand() {
animateImageViewColorChange(R.color.new_conversation_button_collapsed_background, R.color.accent) GlowViewUtilities.animateColorChange(context, imageView, R.color.new_conversation_button_collapsed_background, R.color.accent)
@ColorRes val startShadowColorID = if (UiModeUtilities.isDayUiMode(context)) R.color.transparent_black_30 else R.color.black
GlowViewUtilities.animateShadowColorChange(context, imageView, startShadowColorID, R.color.new_conversation_button_shadow)
imageView.animateSizeChange(R.dimen.new_conversation_button_collapsed_size, R.dimen.new_conversation_button_expanded_size, animationDuration) imageView.animateSizeChange(R.dimen.new_conversation_button_collapsed_size, R.dimen.new_conversation_button_expanded_size, animationDuration)
animateImageViewPositionChange(collapsedImageViewPosition, expandedImageViewPosition) animateImageViewPositionChange(collapsedImageViewPosition, expandedImageViewPosition)
} }
fun collapse() { fun collapse() {
animateImageViewColorChange(R.color.accent, R.color.new_conversation_button_collapsed_background) GlowViewUtilities.animateColorChange(context, imageView, R.color.accent, R.color.new_conversation_button_collapsed_background)
@ColorRes val endShadowColorID = if (UiModeUtilities.isDayUiMode(context)) R.color.transparent_black_30 else R.color.black
GlowViewUtilities.animateShadowColorChange(context, imageView, R.color.new_conversation_button_shadow, endShadowColorID)
imageView.animateSizeChange(R.dimen.new_conversation_button_expanded_size, R.dimen.new_conversation_button_collapsed_size, animationDuration) imageView.animateSizeChange(R.dimen.new_conversation_button_expanded_size, R.dimen.new_conversation_button_collapsed_size, animationDuration)
animateImageViewPositionChange(expandedImageViewPosition, collapsedImageViewPosition) animateImageViewPositionChange(expandedImageViewPosition, collapsedImageViewPosition)
} }
private fun animateImageViewColorChange(@ColorRes startColorID: Int, @ColorRes endColorID: Int) {
val drawable = imageView.background as GradientDrawable
val startColor = resources.getColorWithID(startColorID, context.theme)
val endColor = resources.getColorWithID(endColorID, context.theme)
val animation = ValueAnimator.ofObject(ArgbEvaluator(), startColor, endColor)
animation.duration = animationDuration
animation.addUpdateListener { animator ->
val color = animator.animatedValue as Int
drawable.color = ColorStateList.valueOf(color)
}
animation.start()
}
private fun animateImageViewPositionChange(startPosition: PointF, endPosition: PointF) { private fun animateImageViewPositionChange(startPosition: PointF, endPosition: PointF) {
val animation = ValueAnimator.ofObject(PointFEvaluator(), startPosition, endPosition) val animation = ValueAnimator.ofObject(PointFEvaluator(), startPosition, endPosition)
animation.duration = animationDuration animation.duration = animationDuration
@ -170,6 +160,7 @@ class NewConversationButtonSetView : RelativeLayout {
constructor(context: Context, attrs: AttributeSet, defStyleAttr: Int, defStyleRes: Int) : super(context, attrs, defStyleAttr, defStyleRes) { setUpViewHierarchy() } constructor(context: Context, attrs: AttributeSet, defStyleAttr: Int, defStyleRes: Int) : super(context, attrs, defStyleAttr, defStyleRes) { setUpViewHierarchy() }
private fun setUpViewHierarchy() { private fun setUpViewHierarchy() {
disableClipping()
// Set up session button // Set up session button
addView(sessionButton) addView(sessionButton)
sessionButton.alpha = 0.0f sessionButton.alpha = 0.0f