0

[Remoting Android] Use Material Design's Ripple Expansion Function for Touch Feedback

Currently the radius of the touch feedback animation is linear to time, making
it spend the same amount of time when showing the large circle as when showing
the smaller circle.

This CL changes the radius-time function to a decelerating function as the
material design spec suggested. This will make the animation looks more rapid
given the same duration.

This CL also increases the animation duration to 300ms, which is a balanced
value for showing both simple touch and press-and-hold feedback.

BUG=638317

Review-Url: https://codereview.chromium.org/2265053005
Cr-Commit-Position: refs/heads/master@{#413666}
This commit is contained in:
yuweih
2016-08-22 21:46:26 -07:00
committed by Commit bot
parent 4c022860cc
commit cdc3c1395e

@ -5,6 +5,7 @@
#include "remoting/client/gl_cursor_feedback.h"
#include <math.h>
#include <array>
#include "base/logging.h"
@ -15,7 +16,29 @@
#include "remoting/client/gl_texture_ids.h"
namespace {
const float kAnimationDurationMs = 220.f;
const float kAnimationDurationMs = 300.f;
// This function is for calculating the size of the feedback animation circle at
// the moment when the animation progress is |progress|.
// |progress|: [0, 1], indicating the progress of the animation.
// Returns a coefficient in [0, 1]. It will be multiplied with the maximum
// diameter of the feedback circle to get the current diameter of the feedback
// circle.
float GetExpansionCoefficient(float progress) {
DCHECK(progress >= 0 && progress <= 1);
// Decelerating expansion. This is conforming to the material design spec.
// More time will be spent showing the larger circle and the animation will
// look more rapid given the same time duration.
auto get_unnormalized_coeff = [](float progress) {
static const float kExpansionBase = 400.f;
return 1.f - pow(kExpansionBase, -progress);
};
static const float kExpansionNormalization = get_unnormalized_coeff(1);
return get_unnormalized_coeff(progress) / kExpansionNormalization;
}
} // namespace
namespace remoting {
@ -54,12 +77,14 @@ bool GlCursorFeedback::Draw() {
animation_start_time_ = base::TimeTicks();
return false;
}
float diameter = progress * max_diameter_;
float diameter = GetExpansionCoefficient(progress) * max_diameter_;
std::array<float, 8> positions;
FillRectangleVertexPositions(cursor_x_ - diameter / 2,
cursor_y_ - diameter / 2,
diameter, diameter, &positions);
layer_->SetVertexPositions(positions);
// Linear fade-out.
layer_->Draw(1.f - progress);
return true;
}