动效
流畅的动画有助于给用户界面带来很棒的感觉。使用Vue的过渡系统和可复用的功能组件,您可以轻松地控制应用程序的动画效果。大多数组件可以通过transition
属性来改变他们的过渡。
API
Framework.Transitions.
Framework.Transitions.
Framework.Transitions.
Framework.Transitions.
Framework.Transitions.
示例
X轴滑动过渡
滑动x过渡可沿水平方向移动。
Y轴滑动过渡
过渡地使用应用程序$primary-transition
.
缩放过渡
许多Vuetify组件都包含一个transition
属性允许你指定你自己的效果
淡入淡出过渡
另一个淡入淡出过渡的示例可以在圆盘传送带组件上找到。
Expand transition
The expand transition is used in Expansion Panels and List Groups. There is also a horizonal version available with v-expand-x-transition
.
自定义原点
通过使用一个简单的属性来可编程地控制过渡原点。
Todo list
Using multiple custom transitions, it is easy to bring a simple todo list to life!
创建您自己的
您可以用Vuetify的过渡辅助器函数来创建您自己的自定义的过渡效果,这个函数会返回一个可以导入到Vue的对象。使用Vue的 函数式组件 配置将确保您的过渡效果尽可能高效。只需要导入函数:
其中createSimpleTransition
函数接受1个参数,即名称。这将是您可以与您的样式挂钩的名称。这是一个展示v-fade-transition
的示例: