46 lines
2.1 KiB
Plaintext
46 lines
2.1 KiB
Plaintext
|
<import src="../../common/head.wxml" />
|
||
|
|
<import src="../../common/foot.wxml" />
|
||
|
|
|
||
|
|
<view class="container">
|
||
|
|
<template is="head" data="{{title: 'createAnimation'}}"/>
|
||
|
|
|
||
|
|
<view class="page-body">
|
||
|
|
<view class="page-section">
|
||
|
|
|
||
|
|
<view class="animation-element-wrapper">
|
||
|
|
<view class="animation-element" animation="{{animation}}"></view>
|
||
|
|
</view>
|
||
|
|
<view class="btn-row">
|
||
|
|
<button class="animation-button" bindtap="rotate">旋转</button>
|
||
|
|
<button class="animation-button" bindtap="scale">缩放</button>
|
||
|
|
</view>
|
||
|
|
<view class="btn-row">
|
||
|
|
<button class="animation-button" bindtap="translate">移动</button>
|
||
|
|
<button class="animation-button" bindtap="skew">倾斜</button>
|
||
|
|
</view>
|
||
|
|
<view class="btn-row">
|
||
|
|
<button class="animation-button" bindtap="rotateAndScale">旋转并缩放</button>
|
||
|
|
<button class="animation-button" bindtap="rotateThenScale">旋转后缩放</button>
|
||
|
|
</view>
|
||
|
|
<view class="btn-row">
|
||
|
|
<button class="animation-button" bindtap="all">同时展示全部</button>
|
||
|
|
<button class="animation-button" bindtap="allInQueue">顺序展示全部</button>
|
||
|
|
</view>
|
||
|
|
<view class="btn-row">
|
||
|
|
<button class="animation-button animation-button-reset" bindtap="reset">还原</button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="page-section">
|
||
|
|
<view class="page-section-title">
|
||
|
|
<text>关键帧动画\n\n从小程序基础库 2.9.0 开始支持一种更友好的动画创建方式，用于代替旧的 wx.createAnimation</text>
|
||
|
|
</view>
|
||
|
|
<view id="container1" style="{{containerStyle1}}">
|
||
|
|
<button class="block1" style="width: 300rpx; margin: 100rpx auto;">示例按钮</button>
|
||
|
|
<a class="block1" style="display: block; margin: 100rpx auto; width: 300rpx; text-align: center;">示例超链接</a>
|
||
|
|
<text class="block1" style="display: block; margin: 100rpx auto; width: 300rpx; text-align: center;">示例文本</text>
|
||
|
|
</view>
|
||
|
|
<button type="primary" bindtap="change">开启动画</button>
|
||
|
|
</view>
|
||
|
|
<template is="foot" />
|
||
|
|
</view>
|