标签: animation

我已经在音频播放器屏幕上实现了图像旋转动画，当音频开始而不是图像旋转时，当用户点击暂停按钮动画停止时，我使用 clearAnimation() 方法来停止动画，当用户恢复时我调用 startAnimation() 方法，但是这个看起来很糟糕，因为当我清除动画图像时，如 90 度不同，当我再次 startAnimation() 时，其起点为 0。请查看此视频，播放/暂停音频时动画出现问题观看此视频。

所以我找到了一个 pause()/resume() 动画以获得更好的平滑度。谁能帮我解决动画平滑度或工作面糊？

我有一个 React 应用程序。我正在使用 React Spring 来制作整体动画。我无法为两件事制作动画 - 我正在试验的动画是一个简单的不透明动画。

              import { useSpring, animated } from "react-spring";

              /***
              Some code
              ***/

              const styleProps = useSpring({
                 to: { opacity: 1 },
                 from: { opacity: 0 }
              });

1) 是条件元素。请参考以下代码 -

              <section>
                {!flag ? (
                <animated.div style={styleProps}>
                  Some random text
                </animated.div>
              ) : (
                <animated.div style={styleProps}>
                  To appear with animation
                </animated.div>
              )
             }
             </section>

问题是react-spring 的animated.div 的动画不一样。什么是正确的方法？有没有办法在没有反应弹簧的情况下制作相同的动画？

2）我有一个基于标志的条件引导类名。我想制作相同的动画

            <animated.div style={styleProps} className={classnames({
                 "col-lg-6": !flag,
                 "col-lg-12": flag
            })}
            >
                Random Content
            </animated.div>

对于这一点，问题在于它没有动画。什么是正确的方法？

我想知道是否可以在iOS中进行某种摇摆动画.例如,摇摆动画就像一个在风中飘扬的商店标志.想想西部片.按下按钮时我想做这种动画.我想要一种西方式的感觉,这真的会让它超越顶级.如果您知道如何做这样的事情,请提前感谢.

如果您访问以下站点：http : //www.justinaguilar.com/animations/scrolling.html

您会注意到动画发生在 Scroll 上，而对我而言，当我下载它时却没有。我该怎么做才能让我的动画出现在滚动上？

以最简单的形式，我想制作一个像这个网站一样的加载页面。

我想使用自定义 SVG 徽标（我在 illustrator 中制作的）并在页面加载时水平填充徽标。

就像 SVG 剪辑蒙版进度条（或其他东西）。

拜托，请帮帮我！

谢谢，乔恩

我想为路径上的图像设置动画并显示对象的路线（例如飞机飞过地图）。它应该看起来像这张图片：

但是破折号应该在对象到达位置后应用，所以破折号显示在对象之后。

我已经尝试了很多次，但我只能做一次。路径上的破折号动画或平面。有人知道解决办法吗。

所以我试着在我网站的链接中添加一个简单的振动动画,但它根本不起作用.有人发现我的代码有问题吗？

我从animista.net上获取了动画代码,然后他们就在那里工作了

这是我的代码:

a {
  text-decoration: none;
  animation: vibrate 1s linear infinite both;
}

@keyframes vibrate {
  0% {
    transform: translate(0);
  }
  20% {
    transform: translate(-2px, 2px);
  }
  40% {
    transform: translate(-2px, -2px);
  }
  60% {
    transform: translate(2px, 2px);
  }
  80% {
    transform: translate(2px, -2px);
  }
  100% {
    transform: translate(0);
  }
}

<a href="mailto:me@eduardstefan.com" id="cta">Drop me a line and let’s do cool things together!</a>

[编辑] 我推送了一个包含零高度约束的解决方案的提交，但是，现在我必须处理隐式 UISV 约束。

我花了几个小时来了解如何更改堆栈视图中出现/消失项目的动画。我想从屏幕底部为这两个按钮的出现设置动画，但是，它们总是从右上角飞出：

是否有任何 Cocoa 方法可以将动画配置为从底部开始？PS项目链接。

动画块：

UIView.animate(withDuration: 5.0,
                   delay: 0.5,
                   options: .curveEaseInOut,
                   animations:
        {
            self.buttons.forEach { $0.isHidden = !$0.isHidden }
            self.stack.layoutIfNeeded()
        }, completion: nil)

我想实现的个人资料照片像Instagram的故事有点像圆动画此。
我怎样才能做到这一点？

下面的 QML 代码为两个矩形设置动画。一个使用PropertyAnimation，而另一个使用NumberAnimation。两个矩形的移动方式相似。我看不出这两种动画类型有什么不同。

import QtQuick 2.0
import QtQuick.Window 2.0

Window {
    visible: true
    width: 640
    height: 480

    Rectangle {
        id: r1
        width: 100; height: 100
        color: "red"

        Behavior on x { PropertyAnimation {} }
    }

    Rectangle {
        id: r2
        y: 150
        width: 100; height: 100
        color: "blue"

        Behavior on x { NumberAnimation {} }
    }

    // click anywhere to start animation
    MouseArea { anchors.fill: parent; onClicked: r1.x = r2.x = 200 }
}

是有什么区别PropertyAnimation和 …