Polish the rounded box ripple.

Bug: b/237282686
Test: Manual
Change-Id: I46cdba086d8419d7471ebc36cac898edcd91f22c
This commit is contained in:
Yein Jo
2022-08-12 22:31:48 +00:00
parent 83d28ff707
commit cb4ed7ce60
3 changed files with 33 additions and 9 deletions

View File

@@ -30,6 +30,8 @@ import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.core.graphics.ColorUtils;
import com.android.settingslib.Utils;
import com.android.systemui.R;
import com.android.systemui.animation.Interpolators;
@@ -42,7 +44,8 @@ import java.text.NumberFormat;
* @hide
*/
final class WirelessChargingLayout extends FrameLayout {
private static final long RIPPLE_ANIMATION_DURATION = 1500;
private static final long CIRCLE_RIPPLE_ANIMATION_DURATION = 1500;
private static final long ROUNDED_BOX_RIPPLE_ANIMATION_DURATION = 1750;
private static final int SCRIM_COLOR = 0x4C000000;
private static final int SCRIM_FADE_DURATION = 300;
private RippleView mRippleView;
@@ -131,17 +134,30 @@ final class WirelessChargingLayout extends FrameLayout {
"backgroundColor", SCRIM_COLOR, Color.TRANSPARENT);
scrimFadeOutAnimator.setDuration(SCRIM_FADE_DURATION);
scrimFadeOutAnimator.setInterpolator(Interpolators.LINEAR);
scrimFadeOutAnimator.setStartDelay(RIPPLE_ANIMATION_DURATION - SCRIM_FADE_DURATION);
scrimFadeOutAnimator.setStartDelay((rippleShape == RippleShape.CIRCLE
? CIRCLE_RIPPLE_ANIMATION_DURATION : ROUNDED_BOX_RIPPLE_ANIMATION_DURATION)
- SCRIM_FADE_DURATION);
AnimatorSet animatorSetScrim = new AnimatorSet();
animatorSetScrim.playTogether(scrimFadeInAnimator, scrimFadeOutAnimator);
animatorSetScrim.start();
mRippleView = findViewById(R.id.wireless_charging_ripple);
mRippleView.setupShader(rippleShape);
if (mRippleView.getRippleShape() == RippleShape.ROUNDED_BOX) {
mRippleView.setDuration(ROUNDED_BOX_RIPPLE_ANIMATION_DURATION);
mRippleView.setSparkleStrength(0.22f);
int color = Utils.getColorAttr(mRippleView.getContext(),
android.R.attr.colorAccent).getDefaultColor();
mRippleView.setColor(ColorUtils.setAlphaComponent(color, 28));
} else {
mRippleView.setDuration(CIRCLE_RIPPLE_ANIMATION_DURATION);
mRippleView.setColor(Utils.getColorAttr(mRippleView.getContext(),
android.R.attr.colorAccent).getDefaultColor());
}
OnAttachStateChangeListener listener = new OnAttachStateChangeListener() {
@Override
public void onViewAttachedToWindow(View view) {
mRippleView.setDuration(RIPPLE_ANIMATION_DURATION);
mRippleView.startRipple();
mRippleView.removeOnAttachStateChangeListener(this);
}
@@ -232,13 +248,13 @@ final class WirelessChargingLayout extends FrameLayout {
int height = getMeasuredHeight();
mRippleView.setCenter(width * 0.5f, height * 0.5f);
if (mRippleView.getRippleShape() == RippleShape.ROUNDED_BOX) {
mRippleView.setMaxSize(width * 1.5f, height * 1.5f);
// Those magic numbers are introduced for visual polish. This aspect ratio maps with
// the tablet's docking station.
mRippleView.setMaxSize(width * 1.36f, height * 1.46f);
} else {
float maxSize = Math.max(width, height);
mRippleView.setMaxSize(maxSize, maxSize);
}
mRippleView.setColor(Utils.getColorAttr(mRippleView.getContext(),
android.R.attr.colorAccent).getDefaultColor());
}
super.onLayout(changed, left, top, right, bottom);

View File

@@ -67,7 +67,7 @@ class RippleShader internal constructor(rippleShape: RippleShape = RippleShape.C
float rippleInsideAlpha = (1.-inside) * in_fadeFill;
float rippleRingAlpha = (1.-sparkleRing) * in_fadeRing;
float rippleAlpha = max(rippleInsideAlpha, rippleRingAlpha) * 0.45;
float rippleAlpha = max(rippleInsideAlpha, rippleRingAlpha) * in_color.a;
vec4 ripple = in_color * rippleAlpha;
return mix(ripple, vec4(sparkle), sparkle * in_sparkle_strength);
}
@@ -83,7 +83,7 @@ class RippleShader internal constructor(rippleShape: RippleShape = RippleShape.C
float rippleInsideAlpha = (1.-inside) * in_fadeFill;
float rippleRingAlpha = (1.-sparkleRing) * in_fadeRing;
float rippleAlpha = max(rippleInsideAlpha, rippleRingAlpha) * 0.45;
float rippleAlpha = max(rippleInsideAlpha, rippleRingAlpha) * in_color.a;
vec4 ripple = in_color * rippleAlpha;
return mix(ripple, vec4(sparkle), sparkle * in_sparkle_strength);
}
@@ -99,7 +99,7 @@ class RippleShader internal constructor(rippleShape: RippleShape = RippleShape.C
float rippleInsideAlpha = (1.-inside) * in_fadeFill;
float rippleRingAlpha = (1.-sparkleRing) * in_fadeRing;
float rippleAlpha = max(rippleInsideAlpha, rippleRingAlpha) * 0.45;
float rippleAlpha = max(rippleInsideAlpha, rippleRingAlpha) * in_color.a;
vec4 ripple = in_color * rippleAlpha;
return mix(ripple, vec4(sparkle), sparkle * in_sparkle_strength);
}

View File

@@ -81,6 +81,7 @@ open class RippleView(context: Context?, attrs: AttributeSet?) : View(context, a
rippleShader.color = RIPPLE_DEFAULT_COLOR
rippleShader.progress = 0f
rippleShader.sparkleStrength = RIPPLE_SPARKLE_STRENGTH
rippleShader.pixelDensity = resources.displayMetrics.density
ripplePaint.shader = rippleShader
}
@@ -124,6 +125,13 @@ open class RippleView(context: Context?, attrs: AttributeSet?) : View(context, a
rippleShader.rippleFill = rippleFill
}
/**
* Set the intensity of the sparkles.
*/
fun setSparkleStrength(strength: Float) {
rippleShader.sparkleStrength = strength
}
override fun onDraw(canvas: Canvas?) {
if (canvas == null || !canvas.isHardwareAccelerated) {
// Drawing with the ripple shader requires hardware acceleration, so skip