pyx3e4zb6
/
HotClass
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

2021-12-24

Browse Source
master
wuxiang 3 years ago
parent ff7b7c0cca
commit 6d4097ded4
29 changed files with 631 additions and 17 deletions
Show Stats Download Patch File Download Diff File

11
app.json
Unescape View File

@ -1,11 +1,16 @@
{
"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/index/index",
"pages/logs/logs"
"pages/test/text",
"pages/test/rich-text",
"pages/test/progress"
],
"window": {
"backgroundTextStyle": "light",

BIN
images/11.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 220 KiB

21
pages/index/index.js
Unescape View File

@ -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,

10
pages/index/index.wxml
Unescape View File

@ -21,3 +21,13 @@
<text class="user-motto">{{motto}}</text>
</view>
</view>
<view class="pagelist">
<block wx:for="{{pages}}" wx:key="index">
<view class="title">{{item.type}}</view>
<block wx:for="{{item.pages}}" wx:key="index">
<navigator url="{{item.url}}" class="pageitem">
<button type="primary">{{item.title}}</button>
</navigator>
</block>
</block>
</view>

4
pages/index/index.wxss
Unescape View File

@ -17,3 +17,7 @@
.usermotto {
margin-top: 200px;
}
.pagelist{
flex-direction: column;
justify-content: space-between;
}

66
pages/test/cover-view.js
Unescape View File

@ -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 () {
}
})

3
pages/test/cover-view.json
Unescape View File

@ -0,0 +1,3 @@
{
"usingComponents": {}
}

12
pages/test/cover-view.wxml
Unescape View File

@ -0,0 +1,12 @@
<!--pages/test/cover-view.wxml-->
<text>pages/test/cover-view.wxml</text>
<view class="demobox">
<view class="title">在地图上放置cover-view</view>
<map>
<cover-view>
<cover-view>Cover-view</cover-view>
<cover-image src="../../images/11.jpg"></cover-image>
<button type="primary" size="mini">这是按钮</button>
</cover-view>
</map>
</view>

15
pages/test/cover-view.wxss
Unescape View File

@ -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;
}

68
pages/test/icon.js
Unescape View File

@ -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 () {
}
})

3
pages/test/icon.json
Unescape View File

@ -0,0 +1,3 @@
{
"usingComponents": {}
}

16
pages/test/icon.wxml
Unescape View File

@ -0,0 +1,16 @@
<!--pages/test/icon.wxml-->
<text>pages/test/icon.wxml</text>
<view class="demobox">
<view class="title">1.内容的变化</view>
<block wx:for="{{iconType}}">
<icon type="{{item}}" size="36"></icon>
</block>
<view class="title">2.颜色的变化</view>
<block wx:for="{{iconColor}}">
<icon type="info" size="36" color="{{item}}"></icon>
</block>
<view class="title">3.大小的变化</view>
<block wx:for="{{iconSize}}">
<icon type="info" size="{{item}}"></icon>
</block>
</view>

1
pages/test/icon.wxss
Unescape View File

@ -0,0 +1 @@
/* pages/test/icon.wxss */

66
pages/test/moveable-view.js
Unescape View File

@ -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 () {
}
})

3
pages/test/moveable-view.json
Unescape View File

@ -0,0 +1,3 @@
{
"usingComponents": {}
}

16
pages/test/moveable-view.wxml
Unescape View File

@ -0,0 +1,16 @@
<!--pages/test/moveable-view.wxml-->
<text>pages/test/moveable-view.wxml</text>
<view class="demobox">
<view class="title">1.moveable-view在moveable-area内</view>
<movable-area>
<movable-view id='mv01' direction="all"></movable-view>
</movable-area>
<view class="title">2.moveable-view超出moveable-area内</view>
<movable-area>
<movable-view id='mv02' direction="all"></movable-view>
</movable-area>
<view class="title">3.可缩放moveable-area内</view>
<movable-area scale-area="true">
<movable-view id='mv03' direction="all" scale="true"></movable-view>
</movable-area>
</view>

18
pages/test/moveable-view.wxss
Unescape View File

@ -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;
}

66
pages/test/progress.js
Unescape View File

@ -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 () {
}
})

3
pages/test/progress.json
Unescape View File

@ -0,0 +1,3 @@
{
"usingComponents": {}
}

13
pages/test/progress.wxml
Unescape View File

@ -0,0 +1,13 @@
<!--pages/test/progress.wxml-->
<text>pages/test/progress.wxml</text>
<view class="title">progress</view>
<view class="demobox">
<view class="title">1.进度条右侧显示百分比</view>
<progress percent="25" show-info="true"></progress>
<view class="title">2.线条宽度为20px的进度条</view>
<progress percent="50" stroke-width="20"></progress>
<view class="title">3.自定义颜色的进度条</view>
<progress percent="80" activeColor="red"></progress>
<view class="title">4.带有动画效果的进度条</view>
<progress percent="100" active="true"></progress>
</view>

1
pages/test/progress.wxss
Unescape View File

@ -0,0 +1 @@
/* pages/test/progress.wxss */

94
pages/test/rich-text.js
Unescape View File

@ -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:'<div style="line-height:60px;color:red;font-weight:bold">Hello World</div>'
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})

3
pages/test/rich-text.json
Unescape View File

@ -0,0 +1,3 @@
{
"usingComponents": {}
}

11
pages/test/rich-text.wxml
Unescape View File

@ -0,0 +1,11 @@
<!--pages/test/rich-text.wxml-->
<text>pages/test/rich-text.wxml</text>
<view class="title">rich-text</view>
<view class="demobox">
<view class="title">1.元素节点（使用style样式）</view>
<rich-text nodes="{{nodes01}}"></rich-text>
<view class="title">2.元素节点（使用class样式）</view>
<rich-text nodes="{{nodes02}}"></rich-text>
<view class="title">3.文本节点</view>
<rich-text nodes="{{nodes03}}"></rich-text>
</view>

6
pages/test/rich-text.wxss
Unescape View File

@ -0,0 +1,6 @@
/* pages/test/rich-text.wxss */
.myStyle{
color:red;
line-height: 60px;
font-weight: bold;
}

66
pages/test/text.js
Unescape View File

@ -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 () {
}
})

3
pages/test/text.json
Unescape View File

@ -0,0 +1,3 @@
{
"usingComponents": {}
}

13
pages/test/text.wxml
Unescape View File

@ -0,0 +1,13 @@
<!--pages/test/text.wxml-->
<text>pages/test/text.wxml</text>
<view class="demobox">
<view class="title">1.文本可选</view>
<text selectable="true">这是一段长按可以选择的文本内容</text>
<view class="title">2.空格显示形式</view>
<text space="ensp">这段代码 中文字符空格一半大小</text>
<text space="emsp">这段代码 中文字符空格大小</text>
<text space="nbsp">这段代码 根据字体设置的空格大小</text>
<view class="title">3.文本解码</view>
<text>无法解析&nbsp;&lt;&gt;&amp;&apos;&ensp;&emsp;</text>
<text decode="true">可以解析&nbsp;&lt;&gt;&amp;&apos;&ensp;&emsp;</text>
</view>

8
pages/test/text.wxss
Unescape View File

@ -0,0 +1,8 @@
/* pages/test/text.wxss */
text{
margin: 15rpx;
padding: 15rpx;
border: 1rpx solid silver;
display: block;
font-size: 10pt;
}
Write Preview
Loading…
Cancel
Save