diff --git a/app.json b/app.json index b17d88c..cc111a9 100644 --- a/app.json +++ b/app.json @@ -1,18 +1,23 @@ { - "pages": [ - "pages/test/swiper", - "pages/test/scrollview", - "pages/test/view", - "pages/index/index", - "pages/logs/logs" - - ], - "window": { - "backgroundTextStyle": "light", - "navigationBarBackgroundColor": "#fff", - "navigationBarTitleText": "Weixin", - "navigationBarTextStyle": "black" - }, - "style": "v2", - "sitemapLocation": "sitemap.json" + "pages": [ + "pages/index/index", + "pages/logs/logs", + "pages/test/icon", + "pages/test/cover-view", + "pages/test/moveable-view", + "pages/test/swiper", + "pages/test/scrollview", + "pages/test/view", + "pages/test/text", + "pages/test/rich-text", + "pages/test/progress" + ], + "window": { + "backgroundTextStyle": "light", + "navigationBarBackgroundColor": "#fff", + "navigationBarTitleText": "Weixin", + "navigationBarTextStyle": "black" + }, + "style": "v2", + "sitemapLocation": "sitemap.json" } \ No newline at end of file diff --git a/images/11.jpg b/images/11.jpg new file mode 100644 index 0000000..e84ef53 Binary files /dev/null and b/images/11.jpg differ diff --git a/pages/index/index.js b/pages/index/index.js index 0bc1771..8389373 100644 --- a/pages/index/index.js +++ b/pages/index/index.js @@ -4,6 +4,27 @@ const app = getApp() Page({ data: { + pages:[ + { + type:'视图容器', + pages:[ + {title:'view组件',url: "../test/view"}, + {title:'scroll-view组件',url: "../test/scrollview"}, + {title:'swiper组件',url: "../test/swiper"}, + {title:'movable-view组件',url: "../test/moveable-view"}, + {title:'cover-view组件',url: "../test/cover-view"} + ] + }, + { + type:'基础内容', + pages:[ + {title:'text组件',url: "../test/text"}, + {title:'rich-text组件',url: "../test/rich-text"}, + {title:'icon组件',url: "../test/icon"}, + {title:'progress组件',url: "../test/progress"} + ] + } + ], motto: 'Hello World', userInfo: {}, hasUserInfo: false, diff --git a/pages/index/index.wxml b/pages/index/index.wxml index f00d294..37cfcb5 100644 --- a/pages/index/index.wxml +++ b/pages/index/index.wxml @@ -21,3 +21,13 @@ {{motto}} + + + {{item.type}} + + + + + + + diff --git a/pages/index/index.wxss b/pages/index/index.wxss index eb64203..00f77fd 100644 --- a/pages/index/index.wxss +++ b/pages/index/index.wxss @@ -16,4 +16,8 @@ .usermotto { margin-top: 200px; -} \ No newline at end of file +} +.pagelist{ + flex-direction: column; + justify-content: space-between; +} diff --git a/pages/test/cover-view.js b/pages/test/cover-view.js new file mode 100644 index 0000000..57a388b --- /dev/null +++ b/pages/test/cover-view.js @@ -0,0 +1,66 @@ +// pages/test/cover-view.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } +}) \ No newline at end of file diff --git a/pages/test/cover-view.json b/pages/test/cover-view.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/test/cover-view.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/test/cover-view.wxml b/pages/test/cover-view.wxml new file mode 100644 index 0000000..ef6f170 --- /dev/null +++ b/pages/test/cover-view.wxml @@ -0,0 +1,12 @@ + +pages/test/cover-view.wxml + + 在地图上放置cover-view + + + Cover-view + + + + + diff --git a/pages/test/cover-view.wxss b/pages/test/cover-view.wxss new file mode 100644 index 0000000..65d9093 --- /dev/null +++ b/pages/test/cover-view.wxss @@ -0,0 +1,15 @@ +/* pages/test/cover-view.wxss */ +map{ + width: 100%; + height: 600rpx; +} +cover-view{ + width: 200rpx; + background-color: lightpink; + margin: 0 auto; +} +cover-image{ + width: 100rpx; + height: 100rpx; + margin: 0 auto; +} \ No newline at end of file diff --git a/pages/test/icon.js b/pages/test/icon.js new file mode 100644 index 0000000..d03ab3e --- /dev/null +++ b/pages/test/icon.js @@ -0,0 +1,68 @@ +// pages/test/icon.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + iconType:['success','success-no-circle','info','warn','waiting','cancel','download','search','clear'], + iconColor:['red','orange','yellow','green','cyan','blue','purple'], + iconSize:[20,25,30,35,40,45,50] + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } +}) \ No newline at end of file diff --git a/pages/test/icon.json b/pages/test/icon.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/test/icon.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/test/icon.wxml b/pages/test/icon.wxml new file mode 100644 index 0000000..5e66dfc --- /dev/null +++ b/pages/test/icon.wxml @@ -0,0 +1,16 @@ + +pages/test/icon.wxml + + 1.内容的变化 + + + + 2.颜色的变化 + + + + 3.大小的变化 + + + + diff --git a/pages/test/icon.wxss b/pages/test/icon.wxss new file mode 100644 index 0000000..d3db696 --- /dev/null +++ b/pages/test/icon.wxss @@ -0,0 +1 @@ +/* pages/test/icon.wxss */ \ No newline at end of file diff --git a/pages/test/moveable-view.js b/pages/test/moveable-view.js new file mode 100644 index 0000000..f2c39df --- /dev/null +++ b/pages/test/moveable-view.js @@ -0,0 +1,66 @@ +// pages/test/moveable-view.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } +}) \ No newline at end of file diff --git a/pages/test/moveable-view.json b/pages/test/moveable-view.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/test/moveable-view.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/test/moveable-view.wxml b/pages/test/moveable-view.wxml new file mode 100644 index 0000000..132d11a --- /dev/null +++ b/pages/test/moveable-view.wxml @@ -0,0 +1,16 @@ + +pages/test/moveable-view.wxml + + 1.moveable-view在moveable-area内 + + + + 2.moveable-view超出moveable-area内 + + + + 3.可缩放moveable-area内 + + + + diff --git a/pages/test/moveable-view.wxss b/pages/test/moveable-view.wxss new file mode 100644 index 0000000..9723e0b --- /dev/null +++ b/pages/test/moveable-view.wxss @@ -0,0 +1,18 @@ +/* pages/test/moveable-view.wxss */ +movable-area{ + width: 150rpx; + height: 150rpx; + background-color: lightblue; + margin: 0 auto; +} +movable-view{ + background-color: red; +} +#mv01,#mv03{ + width: 50rpx; + height: 50rpx; +} +#mv02{ + width: 180rpx; + height: 180rpx; +} \ No newline at end of file diff --git a/pages/test/progress.js b/pages/test/progress.js new file mode 100644 index 0000000..ff17ebf --- /dev/null +++ b/pages/test/progress.js @@ -0,0 +1,66 @@ +// pages/test/progress.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } +}) \ No newline at end of file diff --git a/pages/test/progress.json b/pages/test/progress.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/test/progress.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/test/progress.wxml b/pages/test/progress.wxml new file mode 100644 index 0000000..df77922 --- /dev/null +++ b/pages/test/progress.wxml @@ -0,0 +1,13 @@ + +pages/test/progress.wxml +progress + + 1.进度条右侧显示百分比 + + 2.线条宽度为20px的进度条 + + 3.自定义颜色的进度条 + + 4.带有动画效果的进度条 + + diff --git a/pages/test/progress.wxss b/pages/test/progress.wxss new file mode 100644 index 0000000..42a66ee --- /dev/null +++ b/pages/test/progress.wxss @@ -0,0 +1 @@ +/* pages/test/progress.wxss */ \ No newline at end of file diff --git a/pages/test/rich-text.js b/pages/test/rich-text.js new file mode 100644 index 0000000..699ad9c --- /dev/null +++ b/pages/test/rich-text.js @@ -0,0 +1,94 @@ +// pages/test/rich-text.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + nodes01:[ + { + name:'div', + attrs:{ + style:'line-height:60px;color:red;font-weight:bold' + }, + children:[ + { + type:'text', + text:'Hello World' + } + ] + } + ], + nodes02:[ + { + name:'div', + attrs:{ + class:'myStyle' + }, + children:[ + { + type:'text', + text:'Hello World' + } + ] + } + ], + nodes03:'
Hello World
' + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } +}) \ No newline at end of file diff --git a/pages/test/rich-text.json b/pages/test/rich-text.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/test/rich-text.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/test/rich-text.wxml b/pages/test/rich-text.wxml new file mode 100644 index 0000000..530ef0f --- /dev/null +++ b/pages/test/rich-text.wxml @@ -0,0 +1,11 @@ + +pages/test/rich-text.wxml +rich-text + + 1.元素节点（使用style样式） + + 2.元素节点（使用class样式） + + 3.文本节点 + + \ No newline at end of file diff --git a/pages/test/rich-text.wxss b/pages/test/rich-text.wxss new file mode 100644 index 0000000..40c9731 --- /dev/null +++ b/pages/test/rich-text.wxss @@ -0,0 +1,6 @@ +/* pages/test/rich-text.wxss */ +.myStyle{ + color:red; + line-height: 60px; + font-weight: bold; +} \ No newline at end of file diff --git a/pages/test/text.js b/pages/test/text.js new file mode 100644 index 0000000..91d7f0e --- /dev/null +++ b/pages/test/text.js @@ -0,0 +1,66 @@ +// pages/test/text.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } +}) \ No newline at end of file diff --git a/pages/test/text.json b/pages/test/text.json new file mode 100644 index 0000000..8835af0 --- /dev/null +++ b/pages/test/text.json @@ -0,0 +1,3 @@ +{ + "usingComponents": {} +} \ No newline at end of file diff --git a/pages/test/text.wxml b/pages/test/text.wxml new file mode 100644 index 0000000..119304a --- /dev/null +++ b/pages/test/text.wxml @@ -0,0 +1,13 @@ + +pages/test/text.wxml + + 1.文本可选 + 这是一段长按可以选择的文本内容 + 2.空格显示形式 + 这段代码 中文字符空格一半大小 + 这段代码 中文字符空格大小 + 这段代码 根据字体设置的空格大小 + 3.文本解码 + 无法解析 <>&'   + 可以解析 <>&'   + diff --git a/pages/test/text.wxss b/pages/test/text.wxss new file mode 100644 index 0000000..647b4b1 --- /dev/null +++ b/pages/test/text.wxss @@ -0,0 +1,8 @@ +/* pages/test/text.wxss */ +text{ + margin: 15rpx; + padding: 15rpx; + border: 1rpx solid silver; + display: block; + font-size: 10pt; +} \ No newline at end of file