Auf dieser Seite wird anhand von Beispielen beschrieben, wie Sie mit verschiedenen Haptik-APIs um benutzerdefinierte Effekte in einer Android-App zu erstellen. Viele der Informationen auf der dass diese Seite auf gute Kenntnisse über die Funktionsweise des Vibrationsantriebs empfehlen wir, die Einführung zum Vibrationsaktuator zu lesen.
Diese Seite enthält die folgenden Beispiele.
- Benutzerdefinierte Vibrationsmuster
<ph type="x-smartling-placeholder">
- </ph>
- Anlaufmuster: Ein Muster, das reibungslos beginnt.
- Wiederholungsmuster: Ein Muster ohne Ende.
- Muster mit Fallback: ein Fallback. Demonstration.
- Vibrationskompositionen
<ph type="x-smartling-placeholder">
- </ph>
- Widerstand: Ein Drag-Effekt mit dynamischer Intensität.
- Maximieren: Ein Anstieg-dann-Effekt.
- Wobble: Ein wackeliger Effekt bei Verwendung des
SPIN-Primitiven. - Bounce: Ein Hüpfeffekt, bei dem das
THUD-Primitive verwendet wird.
Weitere Beispiele finden Sie unter Haptisches Feedback zu Ereignissen hinzufügen. befolgen Sie immer die Haptik-Designprinzipien.
Mit Fallbacks die Gerätekompatibilität gewährleisten
Beachten Sie bei der Implementierung eines benutzerdefinierten Effekts Folgendes:
- Welche Gerätefunktionen für den Effekt erforderlich sind
- Was tun, wenn das Gerät den Effekt nicht wiedergeben kann?
Die Android haptics API-Referenz enthält Details dazu, wie Sie prüfen können, ob Unterstützung für haptische Komponenten, damit Ihre App einheitliches Gesamterlebnis.
Je nach Anwendungsfall solltest du benutzerdefinierte Effekte deaktivieren stellen alternative benutzerdefinierte Effekte bereit, die auf den unterschiedlichen Möglichkeiten basieren.
Planen Sie die folgenden übergeordneten Klassen von Gerätefunktionen ein:
Wenn Sie haptische Primitive verwenden: Geräte, die diese Primitive unterstützen benutzerdefinierten Effekten benötigt. (Im nächsten Abschnitt finden Sie Primitiven.)
Geräte mit Amplitudensteuerung.
Geräte mit einfacher Vibrationsunterstützung (ein/aus), also solche, fehlende Amplitudensteuerung.
Wenn diese Kategorien bei der Auswahl des haptischen Effekts Ihrer App sollte die haptische User Experience für jedes Gerät vorhersehbar bleiben.
Verwendung von haptischen Primitiven
Android enthält mehrere haptische Primitive, die sich sowohl in der Amplitude als auch Häufigkeit. Sie können allein eine Primitive oder mehrere Primitive in Kombination verwenden um haptische Effekte zu erzielen.
- Verwenden Sie Verzögerungen von mindestens 50 ms für erkennbare Lücken zwischen zwei Primitiven unter Berücksichtigung der Primitiven Dauer wenn möglich.
- Verwenden Sie Skalen, die sich um ein Verhältnis von 1,4 oder mehr unterscheiden, sodass die Differenz in die Intensität besser wahrnehmen.
Verwenden Sie Skalen von 0,5, 0,7 und 1,0, um eine niedrige, mittlere und hohe Intensitätsversion einer Primitive.
Benutzerdefinierte Vibrationsmuster erstellen
Vibrationsmuster werden häufig bei der haptischen Aufmerksamkeit, z. B. bei Benachrichtigungen, verwendet
und Klingeltöne. Der Vibrator-Dienst kann lange Vibrationsmuster abspielen,
die Amplitude der Vibration im Laufe der Zeit ändern. Solche Effekte werden als Wellenformen bezeichnet.
Wellenformeffekte sind leicht wahrnehmbar, plötzliche lange Vibrationen können jedoch den Nutzer erschrecken, wenn er in einer ruhigen Umgebung gespielt wird. Ausweitung auf eine Zielamplitude zu schnell werden, könnte dies ebenfalls hörbare Brummgeräusche verursachen. Die Empfehlung für Wellenformmuster haben, besteht darin, die Amplitudenübergänge zu glätten, die Erhöhung bzw. Senkung der Effekte.
Beispiel: Erhöhungsmuster
Wellenformen werden als VibrationEffect mit drei Parametern dargestellt:
- Timings:Ein Array von Dauer in Millisekunden für jede Wellenform Segment.
- Amplituden:die gewünschte Vibrations Amplitude für die angegebene Dauer im ersten Argument, dargestellt durch einen ganzzahligen Wert zwischen 0 und 255, mit 0 „Aus“ steht für „Vibrator“ und 255 ist die maximale Amplitude
- Wiederholungsindex: Index im Array, der im ersten Argument für mit der Wiederholung der Wellenform beginnen oder -1, wenn das Muster nur einmal abgespielt werden soll.
Hier sehen Sie eine Beispielwellenform, die zweimal mit einer Pause von 350 ms dazwischen pulsiert pulsiert. Der erste Impuls ist ein sanfter Anstieg bis zur maximalen Amplitude. Zweitens: eine schnelle Erhöhung zur Aufrechterhaltung der maximalen Amplitude. Das Anhalten am Ende ist definiert durch den negativen Wiederholungsindexwert.
Kotlin
val timings: LongArray = longArrayOf(50, 50, 50, 50, 50, 100, 350, 25, 25, 25, 25, 200) val amplitudes: IntArray = intArrayOf(33, 51, 75, 113, 170, 255, 0, 38, 62, 100, 160, 255) val repeatIndex = -1 // Do not repeat. vibrator.vibrate(VibrationEffect.createWaveform(timings, amplitudes, repeatIndex))
Java
long[] timings = new long[] { 50, 50, 50, 50, 50, 100, 350, 25, 25, 25, 25, 200 };
int[] amplitudes = new int[] { 33, 51, 75, 113, 170, 255, 0, 38, 62, 100, 160, 255 };
int repeatIndex = -1; // Do not repeat.
vibrator.vibrate(VibrationEffect.createWaveform(timings, amplitudes, repeatIndex));
Beispiel: Wiederholungsmuster
Wellenformen können so lange wiederholt abgespielt werden, bis sie abgebrochen werden. Die Art und Weise, mit einer sich wiederholenden Wellenform einen nicht negativen "Repeat"-Parameter festlegen. Wenn Sie eine Wellenform wiederholt, wird die Vibration so lange fortgesetzt, bis sie den Dienst:
Kotlin
void startVibrating() {
val timings: LongArray = longArrayOf(50, 50, 100, 50, 50)
val amplitudes: IntArray = intArrayOf(64, 128, 255, 128, 64)
val repeat = 1 // Repeat from the second entry, index = 1.
VibrationEffect repeatingEffect = VibrationEffect.createWaveform(timings, amplitudes, repeat)
// repeatingEffect can be used in multiple places.
vibrator.vibrate(repeatingEffect)
}
void stopVibrating() {
vibrator.cancel()
}
Java
void startVibrating() {
long[] timings = new long[] { 50, 50, 100, 50, 50 };
int[] amplitudes = new int[] { 64, 128, 255, 128, 64 };
int repeat = 1; // Repeat from the second entry, index = 1.
VibrationEffect repeatingEffect = VibrationEffect.createWaveform(timings, amplitudes, repeat);
// repeatingEffect can be used in multiple places.
vibrator.vibrate(repeatingEffect);
}
void stopVibrating() {
vibrator.cancel();
}
Dies ist sehr nützlich bei unregelmäßigen Ereignissen, bei denen eine Nutzeraktion erforderlich ist. anerkennen. Beispiele für solche Ereignisse sind eingehende Anrufe und hat Alarme ausgelöst.
Beispiel: Muster mit Fallback
Die Steuerung der Amplitude einer Vibration hardwareabhängigen Funktionen. Beim Abspielen einer Wellenform auf einem ein Low-End-Gerät ohne diese Fähigkeit dazu führt, dass es bei maximaler Vibration amplitude für jeden positiven Eintrag im Amplitude-Array. Wenn Ihre App diese Geräte berücksichtigen, sollten Sie darauf achten, wird unter dieser Bedingung kein Brummen erzeugt, Sie entwerfen ein einfacheres EIN/AUS-Muster, das stattdessen als Fallback abgespielt werden kann.
Kotlin
if (vibrator.hasAmplitudeControl()) {
vibrator.vibrate(VibrationEffect.createWaveform(smoothTimings, amplitudes, smoothRepeatIdx))
} else {
vibrator.vibrate(VibrationEffect.createWaveform(onOffTimings, onOffRepeatIdx))
}
Java
if (vibrator.hasAmplitudeControl()) {
vibrator.vibrate(VibrationEffect.createWaveform(smoothTimings, amplitudes, smoothRepeatIdx));
} else {
vibrator.vibrate(VibrationEffect.createWaveform(onOffTimings, onOffRepeatIdx));
}
Vibrationskompositionen erstellen
In diesem Abschnitt werden Möglichkeiten aufgezeigt, wie Sie diese längere und komplexere benutzerdefinierte Effekte. Darüber hinaus kannst du Haptik dank erweiterter Hardwarefunktionen. Sie können Kombinationen Effekte, die Amplitude und Frequenz verändern, um komplexere haptische Effekte zu erzeugen auf Geräten mit haptischen Bedienelementen und einer größeren Frequenzbandbreite.
Das Verfahren zum Erstellen einer benutzerdefinierten Vibrationsfunktion Mustern, die zuvor auf dieser Seite beschrieben wurden, wird erläutert, wie man die Vibrationsstärke reguliert, um gleichmäßige Effekte zu erzeugen. die sich nach oben und unten richten. Mit der Rich-Haptik verbessern wir dieses Konzept durch die breiterer Frequenzbereich des Gerätevibrators, um den Effekt noch gleichmäßiger zu machen. Diese Wellenformen erzeugen besonders effektiv ein Crescendo oder Diminuendo. Effekts.
Die weiter oben auf dieser Seite beschriebenen Zusammensetzungsprimitive werden durch an den Gerätehersteller. Sie erzeugen eine gestochen scharfe, kurze und angenehme Vibration die den Haptikprinzipien für ein klares haptisches Feedback entspricht. Weitere Informationen Weitere Informationen zu diesen Funktionen und ihrer Funktionsweise finden Sie unter Vibrationsbetätiger Primer
Android bietet keine Fallbacks für Kompositionen mit nicht unterstützten Primitiven. Wir empfehlen Ihnen, die folgenden Schritte auszuführen:
Bevor Sie die erweiterte Haptik aktivieren, sollten Sie prüfen, ob das jeweilige Gerät alle von Ihnen verwendeten Primitiven.
Konsistente, nicht unterstützte Websitevarianten deaktivieren, nicht nur die Effekten, bei denen eine Primitive fehlt. Weitere Informationen zum Prüfen der wird folgendermaßen angezeigt:
Mit VibrationEffect.Composition können Sie Vibrationseffekte erstellen.
Hier ist ein Beispiel für einen langsam ansteigenden Effekt, gefolgt von einem scharfen Klickeffekt:
Kotlin
vibrator.vibrate(
VibrationEffect.startComposition().addPrimitive(
VibrationEffect.Composition.PRIMITIVE_SLOW_RISE
).addPrimitive(
VibrationEffect.Composition.PRIMITIVE_CLICK
).compose()
)
Java
vibrator.vibrate(
VibrationEffect.startComposition()
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_SLOW_RISE)
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_CLICK)
.compose());
Eine Komposition wird durch Hinzufügen von Primitiven erstellt, die nacheinander abgespielt werden sollen. Jedes ist auch skalierbar, sodass Sie die Amplitude der Vibration die jeweils von ihnen generiert wurden. Die Skala ist definiert als ein Wert zwischen 0 und 1, wobei 0 einer minimalen Amplitude entspricht, mit der dieses Primitiv die Nutzenden (kaum) fühlen.
Wenn Sie eine schwache und starke Version derselben Primitive erstellen möchten, empfohlen, dass sich die Skalen um ein Verhältnis von 1,4 oder mehr voneinander unterscheiden, sodass der Unterschied Intensität leicht wahrnehmbar sein. Erstellen Sie nicht mehr als drei Intensitätsgraden derselben Primitive, weil sie nicht wahrnehmbar unterschiedlich sein. Verwenden Sie beispielsweise die Skalen 0,5, 0,7 und 1,0, um eine niedrige, mittlere, und Version einer Primitive mit hoher Intensität.
Für die Komposition können auch Verzögerungen angegeben werden, die zwischen aufeinanderfolgenden Elementen hinzugefügt werden sollen. Primitiven. Diese Verzögerung wird in Millisekunden seit dem Ende des das vorherige Primitiv. Im Allgemeinen ist auch eine Lücke von 5 bis 10 ms zwischen zwei Primitiven kurz, um erkennbar zu sein. Verwenden Sie eine Lücke von mindestens 50 ms wenn Sie eine erkennbare Lücke zwischen zwei Primitiven erzeugen möchten. Hier ist eine Beispiel für eine Komposition mit Verzögerungen:
Kotlin
val delayMs = 100
vibrator.vibrate(
VibrationEffect.startComposition().addPrimitive(
VibrationEffect.Composition.PRIMITIVE_SPIN, 0.8f
).addPrimitive(
VibrationEffect.Composition.PRIMITIVE_SPIN, 0.6f
).addPrimitive(
VibrationEffect.Composition.PRIMITIVE_THUD, 1.0f, delayMs
).compose()
)
Java
int delayMs = 100;
vibrator.vibrate(
VibrationEffect.startComposition()
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_SPIN, 0.8f)
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_SPIN, 0.6f)
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_THUD, 1.0f, delayMs)
.compose());
Mit den folgenden APIs kann die Unterstützung bestimmter Primitive:
Kotlin
val primitive = VibrationEffect.Composition.PRIMITIVE_LOW_TICK
if (vibrator.areAllPrimitivesSupported(primitive)) {
vibrator.vibrate(VibrationEffect.startComposition().addPrimitive(primitive).compose())
} else {
// Play a predefined effect or custom pattern as a fallback.
}
Java
int primitive = VibrationEffect.Composition.PRIMITIVE_LOW_TICK;
if (vibrator.areAllPrimitivesSupported(primitive)) {
vibrator.vibrate(VibrationEffect.startComposition().addPrimitive(primitive).compose());
} else {
// Play a predefined effect or custom pattern as a fallback.
}
Es ist auch möglich, mehrere Primitive zu prüfen und dann zu entscheiden, welche je nach Supportstufe des Geräts erstellen:
Kotlin
val effects: IntArray = intArrayOf( VibrationEffect.Composition.PRIMITIVE_LOW_TICK, VibrationEffect.Composition.PRIMITIVE_TICK, VibrationEffect.Composition.PRIMITIVE_CLICK ) val supported: BooleanArray = vibrator.arePrimitivesSupported(primitives);
Java
int[] primitives = new int[] {
VibrationEffect.Composition.PRIMITIVE_LOW_TICK,
VibrationEffect.Composition.PRIMITIVE_TICK,
VibrationEffect.Composition.PRIMITIVE_CLICK
};
boolean[] supported = vibrator.arePrimitivesSupported(effects);
Beispiel: Widerstand (mit niedrigen Teilstrichen)
Sie können die Amplitude der primitiven Vibration steuern, nützliches Feedback zu einer laufenden Aktion erhalten. Nahe beieinander liegende Skalenwerte können zur Erzeugung eines glatten Crescendo-Effekts eines Primitivs. Die Verzögerung zwischen Aufeinanderfolgende Primitive können auch dynamisch basierend auf dem Nutzer festgelegt werden. Interaktion. Dies wird im folgenden Beispiel einer Ansichtsanimation veranschaulicht: gesteuert und durch haptisches Feedback erweitert.
Kotlin
@Composable
fun ResistScreen() {
// Control variables for the dragging of the indicator.
var isDragging by remember { mutableStateOf(false) }
var dragOffset by remember { mutableStateOf(0f) }
// Only vibrates while the user is dragging
if (isDragging) {
LaunchedEffect(Unit) {
// Continuously run the effect for vibration to occur even when the view
// is not being drawn, when user stops dragging midway through gesture.
while (true) {
// Calculate the interval inversely proportional to the drag offset.
val vibrationInterval = calculateVibrationInterval(dragOffset)
// Calculate the scale directly proportional to the drag offset.
val vibrationScale = calculateVibrationScale(dragOffset)
delay(vibrationInterval)
vibrator.vibrate(
VibrationEffect.startComposition().addPrimitive(
VibrationEffect.Composition.PRIMITIVE_LOW_TICK,
vibrationScale
).compose()
)
}
}
}
Screen() {
Column(
Modifier
.draggable(
orientation = Orientation.Vertical,
onDragStarted = {
isDragging = true
},
onDragStopped = {
isDragging = false
},
state = rememberDraggableState { delta ->
dragOffset += delta
}
)
) {
// Build the indicator UI based on how much the user has dragged it.
ResistIndicator(dragOffset)
}
}
}
Java
class DragListener implements View.OnTouchListener {
// Control variables for the dragging of the indicator.
private int startY;
private int vibrationInterval;
private float vibrationScale;
@Override
public boolean onTouch(View view, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
startY = event.getRawY();
vibrationInterval = calculateVibrationInterval(0);
vibrationScale = calculateVibrationScale(0);
startVibration();
break;
case MotionEvent.ACTION_MOVE:
float dragOffset = event.getRawY() - startY;
// Calculate the interval inversely proportional to the drag offset.
vibrationInterval = calculateVibrationInterval(dragOffset);
// Calculate the scale directly proportional to the drag offset.
vibrationScale = calculateVibrationScale(dragOffset);
// Build the indicator UI based on how much the user has dragged it.
updateIndicator(dragOffset);
break;
case MotionEvent.ACTION_CANCEL:
case MotionEvent.ACTION_UP:
// Only vibrates while the user is dragging
cancelVibration();
break;
}
return true;
}
private void startVibration() {
vibrator.vibrate(
VibrationEffect.startComposition()
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_LOW_TICK, vibrationScale)
.compose());
// Continuously run the effect for vibration to occur even when the view
// is not being drawn, when user stops dragging midway through gesture.
handler.postDelayed(this::startVibration, vibrationInterval);
}
private void cancelVibration() {
handler.removeCallbacksAndMessages(null);
}
}
Beispiel: Maximieren (mit Anstieg und Abfall)
Es gibt zwei Primitive zum Erhöhen der empfundenen Vibrationsintensität:
PRIMITIVE_QUICK_RISE
und
PRIMITIVE_SLOW_RISE
Mit beiden wird dasselbe Ziel erreicht, aber mit unterschiedlicher Dauer. Es gibt nur eine
für die Herunterskalierung verwenden,
PRIMITIVE_QUICK_FALL
Diese Primitive arbeiten besser zusammen, um ein Wellenformsegment zu erstellen, das in
und dann ab. Sie können skalierte Primitive ausrichten, um plötzliche
Amplitudensprung zwischen ihnen, was sich auch gut zur Erweiterung des
Dauer des Effekts. Wahrgenommen wird immer mehr als spürbar
Der steigende Teil sollte also kürzer sein als der fallende Teil
um die Betonung auf den fallenden Teil zu verlagern.
Hier ist ein Beispiel für eine Anwendung dieser Komposition zur Erweiterung und um einen Kreis zu minimieren. Der Aufstiegseffekt kann das Expansionsgefühl während der Animation. Die Kombination aus Anstiegs- und Falleffekten betont die die am Ende der Animation wieder minimiert wird.
Kotlin
enum class ExpandShapeState {
Collapsed,
Expanded
}
@Composable
fun ExpandScreen() {
// Control variable for the state of the indicator.
var currentState by remember { mutableStateOf(ExpandShapeState.Collapsed) }
// Animation between expanded and collapsed states.
val transitionData = updateTransitionData(currentState)
Screen() {
Column(
Modifier
.clickable(
{
if (currentState == ExpandShapeState.Collapsed) {
currentState = ExpandShapeState.Expanded
vibrator.vibrate(
VibrationEffect.startComposition().addPrimitive(
VibrationEffect.Composition.PRIMITIVE_SLOW_RISE,
0.3f
).addPrimitive(
VibrationEffect.Composition.PRIMITIVE_QUICK_FALL,
0.3f
).compose()
)
} else {
currentState = ExpandShapeState.Collapsed
vibrator.vibrate(
VibrationEffect.startComposition().addPrimitive(
VibrationEffect.Composition.PRIMITIVE_SLOW_RISE
).compose()
)
}
)
) {
// Build the indicator UI based on the current state.
ExpandIndicator(transitionData)
}
}
}
Java
class ClickListener implements View.OnClickListener {
private final Animation expandAnimation;
private final Animation collapseAnimation;
private boolean isExpanded;
ClickListener(Context context) {
expandAnimation = AnimationUtils.loadAnimation(context, R.anim.expand);
expandAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
vibrator.vibrate(
VibrationEffect.startComposition()
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_SLOW_RISE, 0.3f)
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_QUICK_FALL, 0.3f)
.compose());
}
});
collapseAnimation = AnimationUtils.loadAnimation(context, R.anim.collapse);
collapseAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
vibrator.vibrate(
VibrationEffect.startComposition()
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_SLOW_RISE)
.compose());
}
});
}
@Override
public void onClick(View view) {
view.startAnimation(isExpanded ? collapseAnimation : expandAnimation);
isExpanded = !isExpanded;
}
}
Beispiel: Wackeln (mit Drehungen)
Eines der wichtigsten Haptikprinzipien ist es, die Nutzer zu begeistern. Eine unterhaltsame Art
einen angenehmen unerwarteten Vibrationseffekt zu erzeugen,
PRIMITIVE_SPIN
Dieses Primitiv ist am effektivsten, wenn es mehr als einmal aufgerufen wird. Mehrere
verkettete Drehungen können zu wackeligen und instabilen Effekten führen, die sich
durch die Anwendung einer etwas zufälligen
Skalierung auf jedes Primitive weiter verbessert. Ich
Sie können auch mit der Lücke zwischen aufeinanderfolgenden Spin-Primitiven experimentieren. Zwei Runden
ohne Lücke (0 ms dazwischen) entsteht ein sich drehendes Gefühl. Steigerung
führt die Inter-Spin-Lücke von 10 bis 50 ms zu einem langsameren Drehgefühl.
kann verwendet werden, um die Dauer eines Videos oder einer Animation anzupassen.
Die Verwendung einer Lücke von mehr als 100 ms wird nicht empfohlen, da die Drehungen funktionieren nicht mehr gut und fühlt sich wie einzelne Effekte an.
Hier ist ein Beispiel für eine elastische Form, die nach dem Herunterziehen zurückprallt. und dann veröffentlicht. Die Animation wird mit zwei Dreheffekten optimiert, die mit unterschiedlicher Intensitäten, die proportional zur Verschiebung sind.
Kotlin
@Composable
fun WobbleScreen() {
// Control variables for the dragging and animating state of the elastic.
var dragDistance by remember { mutableStateOf(0f) }
var isWobbling by remember { mutableStateOf(false) }
// Use drag distance to create an animated float value behaving like a spring.
val dragDistanceAnimated by animateFloatAsState(
targetValue = if (dragDistance > 0f) dragDistance else 0f,
animationSpec = spring(
dampingRatio = Spring.DampingRatioHighBouncy,
stiffness = Spring.StiffnessMedium
),
)
if (isWobbling) {
LaunchedEffect(Unit) {
while (true) {
val displacement = dragDistanceAnimated / MAX_DRAG_DISTANCE
// Use some sort of minimum displacement so the final few frames
// of animation don't generate a vibration.
if (displacement > SPIN_MIN_DISPLACEMENT) {
vibrator.vibrate(
VibrationEffect.startComposition().addPrimitive(
VibrationEffect.Composition.PRIMITIVE_SPIN,
nextSpinScale(displacement)
).addPrimitive(
VibrationEffect.Composition.PRIMITIVE_SPIN,
nextSpinScale(displacement)
).compose()
)
}
// Delay the next check for a sufficient duration until the current
// composition finishes. Note that you can use
// Vibrator.getPrimitiveDurations API to calculcate the delay.
delay(VIBRATION_DURATION)
}
}
}
Box(
Modifier
.fillMaxSize()
.draggable(
onDragStopped = {
isWobbling = true
dragDistance = 0f
},
orientation = Orientation.Vertical,
state = rememberDraggableState { delta ->
isWobbling = false
dragDistance += delta
}
)
) {
// Draw the wobbling shape using the animated spring-like value.
WobbleShape(dragDistanceAnimated)
}
}
// Calculate a random scale for each spin to vary the full effect.
fun nextSpinScale(displacement: Float): Float {
// Generate a random offset in [-0.1,+0.1] to be added to the vibration
// scale so the spin effects have slightly different values.
val randomOffset: Float = Random.Default.nextFloat() * 0.2f - 0.1f
return (displacement + randomOffset).absoluteValue.coerceIn(0f, 1f)
}
Java
class AnimationListener implements DynamicAnimation.OnAnimationUpdateListener {
private final Random vibrationRandom = new Random(seed);
private final long lastVibrationUptime;
@Override
public void onAnimationUpdate(DynamicAnimation animation, float value, float velocity) {
// Delay the next check for a sufficient duration until the current
// composition finishes. Note that you can use
// Vibrator.getPrimitiveDurations API to calculcate the delay.
if (SystemClock.uptimeMillis() - lastVibrationUptime < VIBRATION_DURATION) {
return;
}
float displacement = calculateRelativeDisplacement(value);
// Use some sort of minimum displacement so the final few frames
// of animation don't generate a vibration.
if (displacement < SPIN_MIN_DISPLACEMENT) {
return;
}
lastVibrationUptime = SystemClock.uptimeMillis();
vibrator.vibrate(
VibrationEffect.startComposition()
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_SPIN, nextSpinScale(displacement))
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_SPIN, nextSpinScale(displacement))
.compose());
}
// Calculate a random scale for each spin to vary the full effect.
float nextSpinScale(float displacement) {
// Generate a random offset in [-0.1,+0.1] to be added to the vibration
// scale so the spin effects have slightly different values.
float randomOffset = vibrationRandom.nextFloat() * 0.2f - 0.1f
return MathUtils.clamp(displacement + randomOffset, 0f, 1f)
}
}
Beispiel: Hüpfen (mit Knöpfen)
Eine weitere erweiterte Anwendung von Vibrationseffekten besteht darin,
Interaktionen. Die
PRIMITIVE_THUD
kann einen starken und nachhakenden Effekt erzeugen, der mit dem
Visualisierung einer Wirkung, beispielsweise in einem Video oder in einer Animation, um den
User Experience ausmacht.
Hier ist ein Beispiel für eine einfache Balltropfenanimation, die mit einem Thud-Effekt verbessert wurde. jedes Mal gespielt werden, wenn der Ball vom unteren Bildschirmrand abgeprallt wird:
Kotlin
enum class BallPosition {
Start,
End
}
@Composable
fun BounceScreen() {
// Control variable for the state of the ball.
var ballPosition by remember { mutableStateOf(BallPosition.Start) }
var bounceCount by remember { mutableStateOf(0) }
// Animation for the bouncing ball.
var transitionData = updateTransitionData(ballPosition)
val collisionData = updateCollisionData(transitionData)
// Ball is about to contact floor, only vibrating once per collision.
var hasVibratedForBallContact by remember { mutableStateOf(false) }
if (collisionData.collisionWithFloor) {
if (!hasVibratedForBallContact) {
val vibrationScale = 0.7.pow(bounceCount++).toFloat()
vibrator.vibrate(
VibrationEffect.startComposition().addPrimitive(
VibrationEffect.Composition.PRIMITIVE_THUD,
vibrationScale
).compose()
)
hasVibratedForBallContact = true
}
} else {
// Reset for next contact with floor.
hasVibratedForBallContact = false
}
Screen() {
Box(
Modifier
.fillMaxSize()
.clickable {
if (transitionData.isAtStart) {
ballPosition = BallPosition.End
} else {
ballPosition = BallPosition.Start
bounceCount = 0
}
},
) {
// Build the ball UI based on the current state.
BouncingBall(transitionData)
}
}
}
Java
class ClickListener implements View.OnClickListener {
@Override
public void onClick(View view) {
view.animate()
.translationY(targetY)
.setDuration(3000)
.setInterpolator(new BounceInterpolator())
.setUpdateListener(new AnimatorUpdateListener() {
boolean hasVibratedForBallContact = false;
int bounceCount = 0;
@Override
public void onAnimationUpdate(ValueAnimator animator) {
boolean valueBeyondThreshold = (float) animator.getAnimatedValue() > 0.98;
if (valueBeyondThreshold) {
if (!hasVibratedForBallContact) {
float vibrationScale = (float) Math.pow(0.7, bounceCount++);
vibrator.vibrate(
VibrationEffect.startComposition()
.addPrimitive(VibrationEffect.Composition.PRIMITIVE_THUD, vibrationScale)
.compose());
hasVibratedForBallContact = true;
}
} else {
// Reset for next contact with floor.
hasVibratedForBallContact = false;
}
}
});
}
}