react-native - 表情符号在本机反应中旋转动画
问题描述
我想动画表情符号波做这样的事情: https ://codepen.io/jakejarvis/pen/pBZWZw
知道如何在React Native上实现这一点吗?
<span class="wave"></span>
.wave {
animation-name: wave-animation; /* Refers to the name of your @keyframes element below */
animation-duration: 2.5s; /* Change to speed up or slow down */
animation-iteration-count: infinite; /* Never stop waving :) */
transform-origin: 70% 70%; /* Pivot around the bottom-left palm */
display: inline-block;
}
@keyframes wave-animation {
0% { transform: rotate( 0.0deg) }
10% { transform: rotate(14.0deg) } /* The following five values can be played with to make the waving more or less extreme */
20% { transform: rotate(-8.0deg) }
30% { transform: rotate(14.0deg) }
40% { transform: rotate(-4.0deg) }
50% { transform: rotate(10.0deg) }
60% { transform: rotate( 0.0deg) } /* Reset for the last half to pause */
100% { transform: rotate( 0.0deg) }
}
/* For demonstration purposes only: */
body { font-size: 3.5em }
h1 { font-size: 0.5em }
解决方案
推荐阅读
- python - “TypeError:列表索引必须是整数或切片,而不是浮点数”
- amazon-ec2 - 运行此“ansible -m ping all”命令时出错,但可以 ssh
- azure - 无法使用高级服务计划部署 Azure Function
- html - 我的导航栏无法正确填充 100% 的屏幕宽度。导航栏中的项目水平对齐
- google-cloud-platform - GCP Cloud Armor DDoS 设置
- java - 当我们使用 Kodein Aware 框架时,是否也需要使用 Dagger?
- javascript - 边界改变后清除标记,vue cookbook google map
- angular - 从角度 9 中的一个组件单击按钮时显示组件
- regex - 如何匹配包含多个给定单词的字符串?
- qt - 达到屏幕限制后,突出显示矩形被放置在列表元素后面