diff --git a/app.json b/app.json
index 9f78913..d0b9bd5 100644
--- a/app.json
+++ b/app.json
@@ -50,7 +50,9 @@
"pages/API/load-font-face/load-font-face",
"pages/API/video/video",
"pages/API/audio/audio",
- "pages/API/storage/storage"
+ "pages/API/storage/storage",
+ "pages/API/animation/animation",
+ "pages/API/menu-info/menu-info"
],
"window": {
"backgroundTextStyle": "light",
diff --git a/pages/API/animation/animation.js b/pages/API/animation/animation.js
new file mode 100644
index 0000000..5891d8f
--- /dev/null
+++ b/pages/API/animation/animation.js
@@ -0,0 +1,87 @@
+Page({
+ onShareAppMessage() {
+ return {
+ title: '动画',
+ path: 'page/API/pages/animation/animation',
+ containerStyle1: '',
+
+ }
+ },
+
+ onReady() {
+ this.animation = wx.createAnimation()
+ },
+ rotate() {
+ this.animation.rotate(Math.random() * 720 - 360).step()
+ this.setData({animation: this.animation.export()})
+ },
+ scale() {
+ this.animation.scale(Math.random() * 2).step()
+ this.setData({animation: this.animation.export()})
+ },
+ translate() {
+ this.animation.translate(Math.random() * 100 - 50, Math.random() * 100 - 50).step()
+ this.setData({animation: this.animation.export()})
+ },
+ skew() {
+ this.animation.skew(Math.random() * 90, Math.random() * 90).step()
+ this.setData({animation: this.animation.export()})
+ },
+ rotateAndScale() {
+ this.animation.rotate(Math.random() * 720 - 360)
+ .scale(Math.random() * 2)
+ .step()
+ this.setData({animation: this.animation.export()})
+ },
+ rotateThenScale() {
+ this.animation.rotate(Math.random() * 720 - 360).step()
+ .scale(Math.random() * 2).step()
+ this.setData({animation: this.animation.export()})
+ },
+ all() {
+ this.animation.rotate(Math.random() * 720 - 360)
+ .scale(Math.random() * 2)
+ .translate(Math.random() * 100 - 50, Math.random() * 100 - 50)
+ .skew(Math.random() * 90, Math.random() * 90)
+ .step()
+ this.setData({animation: this.animation.export()})
+ },
+ allInQueue() {
+ this.animation.rotate(Math.random() * 720 - 360).step()
+ .scale(Math.random() * 2).step()
+ .translate(Math.random() * 100 - 50, Math.random() * 100 - 50)
+ .step()
+ .skew(Math.random() * 90, Math.random() * 90)
+ .step()
+ this.setData({animation: this.animation.export()})
+ },
+ reset() {
+ this.animation.rotate(0, 0)
+ .scale(1)
+ .translate(0, 0)
+ .skew(0, 0)
+ .step({duration: 0})
+ this.setData({animation: this.animation.export()})
+ },
+ change: function () {
+ this.animate('#container1', [
+ { opacity: 1.0, rotate: 0, backgroundColor: '#FF0000' },
+ { opacity: 0.5, rotate: 45, backgroundColor: '#00FF00', offset: 0.9},
+ { opacity: 0.0, rotate: 90, backgroundColor: '#FF0000' },
+ ], 5000, function () {
+ this.clearAnimation('#container1', { opacity: true, rotate: true }, function () {
+ console.log("清除了#container上的动画属性")
+ })
+ }.bind(this))
+ this.animate('.block1', [
+ { scale: [1, 1], rotate: 0, ease: 'ease-out' },
+ { scale: [1.5, 1.5], rotate: 45, ease: 'ease-in', offset: 0.9},
+ { scale: [2, 2], rotate: 90},
+ ], 5000, function () {
+ this.clearAnimation('.block1', { scale: true, rotate: true}, function () {
+ console.log("清除了.block1上的动画属性")
+ })
+ }.bind(this)
+ )
+ },
+})
\ No newline at end of file
diff --git a/pages/API/animation/animation.json b/pages/API/animation/animation.json
new file mode 100644
index 0000000..1351e16
--- /dev/null
+++ b/pages/API/animation/animation.json
@@ -0,0 +1,3 @@
+{
+ "navigationBarTitleText": "动画"
+}
diff --git a/pages/API/animation/animation.wxml b/pages/API/animation/animation.wxml
new file mode 100644
index 0000000..9cce474
--- /dev/null
+++ b/pages/API/animation/animation.wxml
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 关键帧动画\n\n从小程序基础库 2.9.0 开始支持一种更友好的动画创建方式，用于代替旧的 wx.createAnimation
+
+
+
+ 示例超链接
+ 示例文本
+
+
+
+
+
\ No newline at end of file
diff --git a/pages/API/animation/animation.wxss b/pages/API/animation/animation.wxss
new file mode 100644
index 0000000..2a5052d
--- /dev/null
+++ b/pages/API/animation/animation.wxss
@@ -0,0 +1,35 @@
+.animation-element-wrapper {
+ display: flex;
+ width: 100%;
+ padding-top: 150rpx;
+ padding-bottom: 150rpx;
+ justify-content: center;
+ overflow: hidden;
+ background-color: #ffffff;
+}
+.animation-element {
+ width: 200rpx;
+ height: 200rpx;
+ background-color: #1AAD19;
+}
+.animation-buttons {
+ padding: 30rpx 50rpx 10rpx;
+ width: 100%;
+ height: 360rpx;
+ box-sizing: border-box;
+}
+.animation-button {
+ float: left;
+ line-height: 2;
+ width: 300rpx;
+ margin: 15rpx 12rpx;
+}
+
+.animation-button-reset {
+ width: 620rpx;
+}
+
+.btn-row {
+ display: flex;
+ justify-content: space-between;
+}
\ No newline at end of file
diff --git a/pages/API/app-level-event/app-level-event.wxml b/pages/API/app-level-event/app-level-event.wxml
index 6bd620b..a6e73a0 100644
--- a/pages/API/app-level-event/app-level-event.wxml
+++ b/pages/API/app-level-event/app-level-event.wxml
@@ -1,5 +1,5 @@
-
-
+
+
diff --git a/pages/API/index/index.js b/pages/API/index/index.js
index b43c8c1..c3f3494 100644
--- a/pages/API/index/index.js
+++ b/pages/API/index/index.js
@@ -54,6 +54,14 @@ Page({
zh: '页面滚动',
url: 'page-scroll/page-scroll'
},
+ {
+ zh: '动画',
+ url: 'animation/animation'
+ },
+ {
+ zh: '菜单位置信息',
+ url: 'menu-info/menu-info'
+ },
]
}, {
id: 'device',
diff --git a/pages/API/menu-info/menu-info.js b/pages/API/menu-info/menu-info.js
new file mode 100644
index 0000000..f066829
--- /dev/null
+++ b/pages/API/menu-info/menu-info.js
@@ -0,0 +1,26 @@
+Page({
+ data: {
+ launchOptions: {},
+ items: [
+ 'width', 'height', 'top', 'bottom', 'left',
+ ],
+ },
+ getLaunchOptions() {
+ const that = this
+ const result = wx.getMenuButtonBoundingClientRect()
+ console.log('wx.getMenuButtonBoundingClientRect', result);
+ for(const key in result) {
+ if(typeof result[key] === 'object') {
+ result[key] = JSON.stringify(result[key])
+ }
+ }
+ that.setData({
+ launchOptions: result
+ })
+ },
+ clear() {
+ this.setData({
+ launchOptions: {}
+ })
+ }
+})
diff --git a/pages/API/menu-info/menu-info.json b/pages/API/menu-info/menu-info.json
new file mode 100644
index 0000000..507e012
--- /dev/null
+++ b/pages/API/menu-info/menu-info.json
@@ -0,0 +1,3 @@
+{
+ "launchOptions": "获取小程序启动时的参数"
+}
diff --git a/pages/API/menu-info/menu-info.wxml b/pages/API/menu-info/menu-info.wxml
new file mode 100644
index 0000000..4436d51
--- /dev/null
+++ b/pages/API/menu-info/menu-info.wxml
@@ -0,0 +1,25 @@
+
+
+
+
+
+
+
+
+
+ 菜单按钮（右上角胶囊按钮）的布局位置信息
+
+
+ {{item}}: {{launchOptions[item]}}
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/pages/API/menu-info/menu-info.wxss b/pages/API/menu-info/menu-info.wxss
new file mode 100644
index 0000000..2860688
--- /dev/null
+++ b/pages/API/menu-info/menu-info.wxss
@@ -0,0 +1,7 @@
+.page-body-info {
+ height: 180px;
+}
+
+.btn-area {
+ width: 100%;
+}