Skip to content

U
uni-app

anyefeiyu / uni-app
与 Fork 源项目一致

Fork自 DCloud / uni-app

通知 1
Star 1
Fork 0
U
uni-app

体验新版 GitCode，发现更多精彩内容 >>

提交 645e0be7 编写于 作者: H hulinNeil
浏览文件
操作

更新模版和部分bug

上级 6431887c
展开全部 隐藏空白更改
内联 并排
Showing with 10044 addition and 9558 deletion
examples/hello-uniapp/App.vue
浏览文件 @ 645e0be7
<script>
export default {
onLaunch: function () {
console.log('App Launch');
//#ifdef APP-PLUS
/* 5+环境锁定屏幕方向 */
plus.screen.unlockOrientation(); //解除锁定
plus.screen.lockOrientation('portrait-primary'); //锁定
/* 5+环境升级提示 */
var server = "http://uni-app.dcloud.io/update"; //检查更新地址
var req = { //升级检测数据
"appid": plus.runtime.appid,
"version": plus.runtime.version,
"imei": plus.device.imei
};
uni.request({
url: server,
data: req,
success: (res) => {
console.log("success", res);
if (res.statusCode == 200 && res.data.isUpdate) {
let openUrl = plus.os.name === 'iOS' ? res.data.iOS : res.data.Android;
uni.showModal({ //提醒用户更新
title: '更新提示',
content: '是否选择更新',
success: (res) => {
if (res.confirm) {
plus.runtime.openURL(openUrl);
}
}
})
}
}
})
//#endif
},
onShow: function () {
console.log('App Show')
},
onHide: function () {
console.log('App Hide')
}
}
export default {
onLaunch: function () {
console.log('App Launch');
//#ifdef APP-PLUS
/* 5+环境锁定屏幕方向 */
plus.screen.lockOrientation('portrait-primary'); //锁定
/* 5+环境升级提示 */
var server = "https://uniapp.dcloud.io/update"; //检查更新地址
var req = { //升级检测数据
"appid": plus.runtime.appid,
"version": plus.runtime.version,
"imei": plus.device.imei
};
uni.request({
url: server,
data: req,
success: (res) => {
console.log("success", res);
if (res.statusCode == 200 && res.data.isUpdate) {
let openUrl = plus.os.name === 'iOS' ? res.data.iOS : res.data.Android;
uni.showModal({ //提醒用户更新
title: '更新提示',
content: '是否选择更新',
success: (res) => {
if (res.confirm) {
plus.runtime.openURL(openUrl);
}
}
})
}
}
})
//#endif
},
onShow: function () {
console.log('App Show')
},
onHide: function () {
console.log('App Hide')
}
}
</script>
<style>
/* reset */
page {
background-color: #F8F8F8;
height: 100%;
font-size: 32rpx;
line-height: 1.6;
}
checkbox,
radio {
margin-right: 10rpx;
}
button {
margin-top: 20rpx;
margin-bottom: 20rpx;
}
form {
width: 100%;
}
/* page */
.container {
display: flex;
flex-direction: column;
min-height: 100%;
justify-content: space-between;
font-size: 32rpx;
font-family: -apple-system-font, Helvetica Neue, Helvetica, sans-serif;
}
.page-head {
padding: 60rpx 50rpx 80rpx;
text-align: center;
line-height: initial;
height: 60rpx;
}
.page-head-title {
display: inline-block;
padding: 0 40rpx;
font-size: 30rpx;
height: 60rpx;
line-height: 60rpx;
color: #BEBEBE;
box-sizing: border-box;
border-bottom: 2rpx solid #D8D8D8;
}
.page-head-desc {
padding-top: 20rpx;
color: #9B9B9B;
font-size: 32rpx;
}
.page-body {
width: 100%;
flex-grow: 1;
overflow-x: hidden;
}
.page-body-wrapper {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
.page-body-wording {
text-align: center;
padding: 200rpx 100rpx;
}
.page-body-info {
display: flex;
flex-direction: column;
align-items: center;
background-color: #fff;
width: 100%;
padding: 50rpx 0 150rpx 0;
}
.page-body-title {
margin-bottom: 100rpx;
font-size: 32rpx;
}
.page-body-text {
font-size: 30rpx;
line-height: 26px;
color: #ccc;
}
.page-body-text-small {
font-size: 24rpx;
color: #000;
margin-bottom: 100rpx;
}
.page-foot {
margin: 100rpx 0 30rpx 0;
text-align: center;
color: #1aad19;
font-size: 0;
}
.icon-foot {
width: 152rpx;
height: 23rpx;
}
.page-section {
width: 100%;
margin-bottom: 60rpx;
}
.page-section_center {
display: flex;
flex-direction: column;
align-items: center;
}
.page-section:last-child {
margin-bottom: 0;
}
.page-section-gap {
box-sizing: border-box;
padding: 0 30rpx;
}
.page-section-spacing {
box-sizing: border-box;
padding: 0 80rpx;
}
.page-section-title {
font-size: 28rpx;
color: #999999;
margin-top: 10rpx;
margin-bottom: 10rpx;
padding-left: 30rpx;
padding-right: 30rpx;
}
.page-section-gap .page-section-title {
padding-left: 0;
padding-right: 0;
}
/* example */
.index-hd {
padding: 90rpx;
text-align: center;
}
.index-logo {
width: 140rpx;
height: 140rpx;
}
.btn-area {
margin-top: 60rpx;
box-sizing: border-box;
width: 100%;
padding: 0 30rpx;
}
.image-plus {
width: 150rpx;
height: 150rpx;
border: 2rpx solid #D9D9D9;
position: relative;
}
.image-plus-nb {
border: 0;
}
.image-plus-text {
color: #888888;
font-size: 28rpx;
}
.image-plus-horizontal {
position: absolute;
top: 50%;
left: 50%;
background-color: #d9d9d9;
width: 4rpx;
height: 80rpx;
transform: translate(-50%, -50%);
}
.image-plus-vertical {
position: absolute;
top: 50%;
left: 50%;
background-color: #d9d9d9;
width: 80rpx;
height: 4rpx;
transform: translate(-50%, -50%);
}
.color1 {
background-color: #1AAD19;
color: #FFFFFF;
}
.color2 {
background-color: #2782D7;
color: #FFFFFF;
}
.color3 {
background-color: #F1F1F1;
color: #353535;
}
/* 这是页面的公用css */
page {
background-color: #F8F8F8;
height: 100%;
font-size: 32px;
line-height: 1.6;
}
checkbox,
radio {
margin-right: 10px;
}
button {
margin-top: 20px;
margin-bottom: 20px;
}
form {
width: 100%;
}
/* page */
.container {
display: flex;
flex-direction: column;
min-height: 100%;
justify-content: space-between;
font-size: 32px;
font-family: -apple-system-font, Helvetica Neue, Helvetica, sans-serif;
}
.page-head {
padding: 60px 50px 80px;
text-align: center;
line-height: initial;
height: 60px;
}
.page-head-title {
display: inline-block;
padding: 0 40px;
font-size: 30px;
height: 60px;
line-height: 60px;
color: #BEBEBE;
box-sizing: border-box;
border-bottom: 2px solid #D8D8D8;
}
.page-head-desc {
padding-top: 20px;
color: #9B9B9B;
font-size: 32px;
}
.page-body {
width: 100%;
flex-grow: 1;
overflow-x: hidden;
}
.page-body-wrapper {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
.page-body-wording {
text-align: center;
padding: 200px 100px;
}
.page-body-info {
display: flex;
flex-direction: column;
align-items: center;
background-color: #fff;
width: 100%;
padding: 50px 0 150px 0;
}
.page-body-title {
margin-bottom: 100px;
font-size: 32px;
}
.page-body-text {
font-size: 30px;
line-height: 52px;
color: #ccc;
}
.page-body-text-small {
font-size: 24px;
color: #000;
margin-bottom: 100px;
}
.page-foot {
margin: 100px 0 30px 0;
text-align: center;
color: #1aad19;
font-size: 0;
}
.icon-foot {
width: 152px;
height: 23px;
}
.page-section {
width: 100%;
margin-bottom: 60px;
}
.page-section_center {
display: flex;
flex-direction: column;
align-items: center;
}
.page-section:last-child {
margin-bottom: 0;
}
.page-section-gap {
box-sizing: border-box;
padding: 0 30px;
}
.page-section-spacing {
box-sizing: border-box;
padding: 0 80px;
}
.page-section-title {
font-size: 28px;
color: #999999;
margin-top: 10px;
margin-bottom: 10px;
padding-left: 30px;
padding-right: 30px;
}
.page-section-gap .page-section-title {
padding-left: 0;
padding-right: 0;
}
/* example */
.index-hd {
padding: 90px;
text-align: center;
}
.index-logo {
width: 140px;
height: 140px;
}
.btn-area {
margin-top: 60px;
box-sizing: border-box;
width: 100%;
padding: 0 30px;
}
.image-plus {
width: 150px;
height: 150px;
border: 2px solid #D9D9D9;
position: relative;
}
.image-plus-nb {
border: 0;
}
.image-plus-text {
color: #888888;
font-size: 28px;
}
.image-plus-horizontal {
position: absolute;
top: 50%;
left: 50%;
background-color: #d9d9d9;
width: 4px;
height: 80px;
transform: translate(-50%, -50%);
}
.image-plus-vertical {
position: absolute;
top: 50%;
left: 50%;
background-color: #d9d9d9;
width: 80px;
height: 4px;
transform: translate(-50%, -50%);
}
.color1 {
background-color: #1AAD19;
color: #FFFFFF;
}
.color2 {
background-color: #2782D7;
color: #FFFFFF;
}
.color3 {
background-color: #F1F1F1;
color: #353535;
}
</style>
examples/hello-uniapp/common/icon.css
浏览文件 @ 645e0be7
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf') format('truetype');
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf') format('truetype');
}
.uni-icon {
font-family: uniicons;
font-size: 48rpx;
font-weight: normal;
font-style: normal;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
font-family: uniicons;
font-size: 48px;
font-weight: normal;
font-style: normal;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
}
.uni-icon.uni-active {
color: #007aff;
color: #007aff;
}
.uni-icon-contact:before {
content: '\e100';
content: '\e100';
}
.uni-icon-person:before {
content: '\e101';
content: '\e101';
}
.uni-icon-personadd:before {
content: '\e102';
content: '\e102';
}
.uni-icon-contact-filled:before {
content: '\e130';
content: '\e130';
}
.uni-icon-person-filled:before {
content: '\e131';
content: '\e131';
}
.uni-icon-personadd-filled:before {
content: '\e132';
content: '\e132';
}
.uni-icon-phone:before {
content: '\e200';
content: '\e200';
}
.uni-icon-email:before {
content: '\e201';
content: '\e201';
}
.uni-icon-chatbubble:before {
content: '\e202';
content: '\e202';
}
.uni-icon-chatboxes:before {
content: '\e203';
content: '\e203';
}
.uni-icon-phone-filled:before {
content: '\e230';
content: '\e230';
}
.uni-icon-email-filled:before {
content: '\e231';
content: '\e231';
}
.uni-icon-chatbubble-filled:before {
content: '\e232';
content: '\e232';
}
.uni-icon-chatboxes-filled:before {
content: '\e233';
content: '\e233';
}
.uni-icon-weibo:before {
content: '\e260';
content: '\e260';
}
.uni-icon-weixin:before {
content: '\e261';
content: '\e261';
}
.uni-icon-pengyouquan:before {
content: '\e262';
content: '\e262';
}
.uni-icon-chat:before {
content: '\e263';
content: '\e263';
}
.uni-icon-qq:before {
content: '\e264';
content: '\e264';
}
.uni-icon-videocam:before {
content: '\e300';
content: '\e300';
}
.uni-icon-camera:before {
content: '\e301';
content: '\e301';
}
.uni-icon-mic:before {
content: '\e302';
content: '\e302';
}
.uni-icon-location:before {
content: '\e303';
content: '\e303';
}
.uni-icon-mic-filled:before,
.uni-icon-speech:before {
content: '\e332';
content: '\e332';
}
.uni-icon-location-filled:before {
content: '\e333';
content: '\e333';
}
.uni-icon-micoff:before {
content: '\e360';
content: '\e360';
}
.uni-icon-image:before {
content: '\e363';
content: '\e363';
}
.uni-icon-map:before {
content: '\e364';
content: '\e364';
}
.uni-icon-compose:before {
content: '\e400';
content: '\e400';
}
.uni-icon-trash:before {
content: '\e401';
content: '\e401';
}
.uni-icon-upload:before {
content: '\e402';
content: '\e402';
}
.uni-icon-download:before {
content: '\e403';
content: '\e403';
}
.uni-icon-close:before {
content: '\e404';
content: '\e404';
}
.uni-icon-redo:before {
content: '\e405';
content: '\e405';
}
.uni-icon-undo:before {
content: '\e406';
content: '\e406';
}
.uni-icon-refresh:before {
content: '\e407';
content: '\e407';
}
.uni-icon-star:before {
content: '\e408';
content: '\e408';
}
.uni-icon-plus:before {
content: '\e409';
content: '\e409';
}
.uni-icon-minus:before {
content: '\e410';
content: '\e410';
}
.uni-icon-circle:before,
.uni-icon-checkbox:before {
content: '\e411';
content: '\e411';
}
.uni-icon-close-filled:before,
.uni-icon-clear:before {
content: '\e434';
content: '\e434';
}
.uni-icon-refresh-filled:before {
content: '\e437';
content: '\e437';
}
.uni-icon-star-filled:before {
content: '\e438';
content: '\e438';
}
.uni-icon-plus-filled:before {
content: '\e439';
content: '\e439';
}
.uni-icon-minus-filled:before {
content: '\e440';
content: '\e440';
}
.uni-icon-circle-filled:before {
content: '\e441';
content: '\e441';
}
.uni-icon-checkbox-filled:before {
content: '\e442';
content: '\e442';
}
.uni-icon-closeempty:before {
content: '\e460';
content: '\e460';
}
.uni-icon-refreshempty:before {
content: '\e461';
content: '\e461';
}
.uni-icon-reload:before {
content: '\e462';
content: '\e462';
}
.uni-icon-starhalf:before {
content: '\e463';
content: '\e463';
}
.uni-icon-spinner:before {
content: '\e464';
content: '\e464';
}
.uni-icon-spinner-cycle:before {
content: '\e465';
content: '\e465';
}
.uni-icon-search:before {
content: '\e466';
content: '\e466';
}
.uni-icon-plusempty:before {
content: '\e468';
content: '\e468';
}
.uni-icon-forward:before {
content: '\e470';
content: '\e470';
}
.uni-icon-back:before,
.uni-icon-left-nav:before {
content: '\e471';
content: '\e471';
}
.uni-icon-checkmarkempty:before {
content: '\e472';
content: '\e472';
}
.uni-icon-home:before {
content: '\e500';
content: '\e500';
}
.uni-icon-navigate:before {
content: '\e501';
content: '\e501';
}
.uni-icon-gear:before {
content: '\e502';
content: '\e502';
}
.uni-icon-paperplane:before {
content: '\e503';
content: '\e503';
}
.uni-icon-info:before {
content: '\e504';
content: '\e504';
}
.uni-icon-help:before {
content: '\e505';
content: '\e505';
}
.uni-icon-locked:before {
content: '\e506';
content: '\e506';
}
.uni-icon-more:before {
content: '\e507';
content: '\e507';
}
.uni-icon-flag:before {
content: '\e508';
content: '\e508';
}
.uni-icon-home-filled:before {
content: '\e530';
content: '\e530';
}
.uni-icon-gear-filled:before {
content: '\e532';
content: '\e532';
}
.uni-icon-info-filled:before {
content: '\e534';
content: '\e534';
}
.uni-icon-help-filled:before {
content: '\e535';
content: '\e535';
}
.uni-icon-more-filled:before {
content: '\e537';
content: '\e537';
}
.uni-icon-settings:before {
content: '\e560';
content: '\e560';
}
.uni-icon-list:before {
content: '\e562';
content: '\e562';
}
.uni-icon-bars:before {
content: '\e563';
content: '\e563';
}
.uni-icon-loop:before {
content: '\e565';
content: '\e565';
}
.uni-icon-paperclip:before {
content: '\e567';
content: '\e567';
}
.uni-icon-eye:before {
content: '\e568';
content: '\e568';
}
.uni-icon-arrowup:before {
content: '\e580';
content: '\e580';
}
.uni-icon-arrowdown:before {
content: '\e581';
content: '\e581';
}
.uni-icon-arrowleft:before {
content: '\e582';
content: '\e582';
}
.uni-icon-arrowright:before {
content: '\e583';
content: '\e583';
}
.uni-icon-arrowthinup:before {
content: '\e584';
content: '\e584';
}
.uni-icon-arrowthindown:before {
content: '\e585';
content: '\e585';
}
.uni-icon-arrowthinleft:before {
content: '\e586';
content: '\e586';
}
.uni-icon-arrowthinright:before {
content: '\e587';
content: '\e587';
}
.uni-icon-pulldown:before {
content: '\e588';
content: '\e588';
}
examples/hello-uniapp/common/uni.css
浏览文件 @ 645e0be7
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf') format('truetype');
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf') format('truetype');
}
/*通用 */
.uni-flex {
display: flex;
flex-direction: row;
}
/*通用*/
.uni-flex-item {
flex: 1;
}
.uni-flex {
display: flex;
flex-direction: row;
.uni-row {
flex-direction: row;
}
.uni-column {
flex-direction: column;
}
.uni-h6 {
font-size: 24rpx;
color: #8f8f94;
font-size: 24px;
color: #8f8f94;
}
.uni-h5 {
font-size: 28rpx;
color: #8f8f94;
font-size: 28px;
color: #8f8f94;
}
.uni-h4 {
font-size: 36rpx;
font-size: 36px;
}
.uni-h3 {
font-size: 48rpx;
font-weight: 600;
font-size: 48px;
font-weight: 600;
}
.uni-h2 {
font-size: 60rpx;
font-weight: 600;
font-size: 60px;
font-weight: 600;
}
.uni-h1 {
font-size: 72rpx;
font-weight: 600;
font-size: 72px;
font-weight: 600;
}
.uni-ellipsis {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.uni-input {
height: 2.58823529em;
min-height: 2.58823529em;
line-height: 2.58823529em;
height: 80px;
min-height: 80px;
line-height: 80px;
}
.uni-label {
width: 105px;
word-wrap: break-word;
word-break: break-all;
width: 210px;
word-wrap: break-word;
word-break: break-all;
}
/*数字角标*/
/*数字角标 */
.uni-badge {
padding: 4rpx 14rpx;
font-size: 24rpx;
height: 24rpx;
line-height: 1;
color: #333;
background-color: rgba(0, 0, 0, .15);
border-radius: 200rpx;
padding: 4px 14px;
font-size: 24px;
height: 24px;
line-height: 1;
color: #333;
background-color: rgba(0, 0, 0, .15);
border-radius: 200px;
}
.uni-badge.uni-badge-inverted {
padding: 0 5px 0 0;
color: #929292;
background-color: transparent
padding: 0 10px 0 0;
color: #929292;
background-color: transparent
}
.uni-badge-primary {
color: #fff;
background-color: #007aff
color: #fff;
background-color: #007aff
}
.uni-badge-blue.uni-badge-inverted,
.uni-badge-primary.uni-badge-inverted {
color: #007aff;
background-color: transparent
color: #007aff;
background-color: transparent
}
.uni-badge-green,
.uni-badge-success {
color: #fff;
background-color: #4cd964;
color: #fff;
background-color: #4cd964;
}
.uni-badge-green.uni-badge-inverted,
.uni-badge-success.uni-badge-inverted {
color: #4cd964;
background-color: transparent
color: #4cd964;
background-color: transparent
}
.uni-badge-warning,
.uni-badge-yellow {
color: #fff;
background-color: #f0ad4e
color: #fff;
background-color: #f0ad4e
}
.uni-badge-warning.uni-badge-inverted,
.uni-badge-yellow.uni-badge-inverted {
color: #f0ad4e;
background-color: transparent
color: #f0ad4e;
background-color: transparent
}
.uni-badge-danger,
.uni-badge-red {
color: #fff;
background-color: #dd524d
color: #fff;
background-color: #dd524d
}
.uni-badge-danger.uni-badge-inverted,
.uni-badge-red.uni-badge-inverted {
color: #dd524d;
background-color: transparent
color: #dd524d;
background-color: transparent
}
.uni-badge-purple,
.uni-badge-royal {
color: #fff;
background-color: #8a6de9
color: #fff;
background-color: #8a6de9
}
.uni-badge-purple.uni-badge-inverted,
.uni-badge-royal.uni-badge-inverted {
color: #8a6de9;
background-color: transparent
color: #8a6de9;
background-color: transparent
}
/*折叠面板*/
/*折叠面板 */
.uni-collapse-content {
height: 0;
width: 100%;
overflow: hidden;
height: 0;
width: 100%;
overflow: hidden;
}
.uni-collapse-content.uni-active {
height: auto;
height: auto;
}
/*卡片视图*/
/*卡片视图 */
.uni-card {
background: #fff;
border-radius: 8rpx;
margin: 20rpx;
position: relative;
box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
background: #fff;
border-radius: 8px;
margin: 20px;
position: relative;
box-shadow: 0 2px 4px rgba(0, 0, 0, .3);
}
.uni-card-content {
font-size: 30rpx;
font-size: 30px;
}
.uni-card-content-inner {
position: relative;
padding: 30rpx;
position: relative;
padding: 30px;
}
.uni-card-footer,
.uni-card-header {
position: relative;
display: flex;
min-height: 50rpx;
padding: 20rpx 30rpx;
justify-content: space-between;
align-items: center;
position: relative;
display: flex;
min-height: 50px;
padding: 20px 30px;
justify-content: space-between;
align-items: center;
}
.uni-card-header {
font-size: 36rpx;
font-size: 36px;
}
.uni-card-footer {
color: #6d6d72;
color: #6d6d72;
}
.uni-card-footer:before,
.uni-card-header:after {
position: absolute;
top: 0;
right: 0;
left: 0;
height: 2rpx;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
position: absolute;
top: 0;
right: 0;
left: 0;
height: 2px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-card-header:after {
top: auto;
bottom: 0;
top: auto;
bottom: 0;
}
.uni-card-media {
justify-content: flex-start;
justify-content: flex-start;
}
.uni-card-media-logo {
height: 84rpx;
width: 84rpx;
margin-right: 20rpx;
height: 84px;
width: 84px;
margin-right: 20px;
}
.uni-card-media-body {
height: 84rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
height: 84px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
}
.uni-card-media-text-top {
line-height: 36rpx;
font-size: 34rpx;
line-height: 36px;
font-size: 34px;
}
.uni-card-media-text-bottom {
line-height: 30rpx;
font-size: 28rpx;
color: #8f8f94;
line-height: 30px;
font-size: 28px;
color: #8f8f94;
}
.uni-card-link {
color: #007AFF;
color: #007AFF;
}
/*列表*/
/* 列表 */
.uni-list {
background-color: #FFFFFF;
position: relative;
width: 100%;
display: flex;
flex-direction: column;
background-color: #FFFFFF;
position: relative;
width: 100%;
display: flex;
flex-direction: column;
}
.uni-list:after {
position: absolute;
z-index: 10;
right: 0;
bottom: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
position: absolute;
z-index: 10;
right: 0;
bottom: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list:before {
position: absolute;
z-index: 10;
right: 0;
top: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
position: absolute;
z-index: 10;
right: 0;
top: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list-cell {
position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.uni-list-cell-hover {
background-color: #eee;
background-color: #eee;
}
.uni-list-cell-pd {
padding: 22rpx 30rpx;
padding: 22px 30px;
}
.uni-list-cell-left {
padding: 0 30rpx;
padding: 0 30px;
}
.uni-list-cell-db,
.uni-list-cell-right {
flex: 1;
flex: 1;
}
.uni-list-cell:after {
position: absolute;
right: 0;
bottom: 0;
left: 30rpx;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
position: absolute;
right: 0;
bottom: 0;
left: 30px;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list .uni-list-cell:last-child:after {
height: 0px;
height: 0px;
}
.uni-list-cell-last.uni-list-cell:after {
height: 0px;
height: 0px;
}
.uni-list-cell-divider {
position: relative;
display: flex;
color: #999;
background-color: #f7f7f7;
padding: 10rpx 20rpx;
position: relative;
display: flex;
color: #999;
background-color: #f7f7f7;
padding: 10px 20px;
}
.uni-list-cell-divider:before {
position: absolute;
right: 0;
top: 0;
left: 0rpx;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
position: absolute;
right: 0;
top: 0;
left: 0px;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list-cell-divider:after {
position: absolute;
right: 0;
bottom: 0;
left: 0rpx;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
position: absolute;
right: 0;
bottom: 0;
left: 0px;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list-cell-navigate {
padding: 22rpx 30rpx;
line-height: 48rpx;
position: relative;
display: flex;
box-sizing: border-box;
width: 100%;
flex: 1;
justify-content: space-between;
align-items: center;
padding: 22px 30px;
line-height: 48px;
position: relative;
display: flex;
box-sizing: border-box;
width: 100%;
flex: 1;
justify-content: space-between;
align-items: center;
}
.uni-list-cell-navigate {
padding-right: 36rpx;
padding-right: 36px;
}
.uni-navigate-badge {
margin-right: 20rpx;
margin-right: 20px;
}
.uni-list-cell-navigate.uni-navigate-right:after {
font-family: uniicons;
content: '\e583';
position: absolute;
right: 24rpx;
top: 50%;
color: #bbb;
transform: translateY(-50%);
font-family: uniicons;
content: '\e583';
position: absolute;
right: 24px;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.uni-list-cell-navigate.uni-navigate-bottom:after {
font-family: uniicons;
content: '\e581';
position: absolute;
right: 24rpx;
top: 50%;
color: #bbb;
transform: translateY(-50%);
font-family: uniicons;
content: '\e581';
position: absolute;
right: 24px;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.uni-list-cell-navigate.uni-navigate-bottom.uni-active:after {
font-family: uniicons;
content: '\e580';
position: absolute;
right: 24rpx;
top: 50%;
color: #bbb;
transform: translateY(-50%);
font-family: uniicons;
content: '\e580';
position: absolute;
right: 24px;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.uni-collapse.uni-list-cell {
flex-direction: column;
flex-direction: column;
}
.uni-list-cell-navigate.uni-active {
background: #eee;
background: #eee;
}
.uni-list.uni-collapse {
box-sizing: border-box;
height: 0;
overflow: hidden;
box-sizing: border-box;
height: 0;
overflow: hidden;
}
.uni-collapse .uni-list-cell {
padding-left: 36rpx;
padding-left: 36px;
}
.uni-collapse .uni-list-cell:after {
left: 52rpx;
left: 52px;
}
.uni-list.uni-active {
height: auto;
height: auto;
}
/*三行列表*/
/* 三行列表 */
.uni-triplex-row {
display: flex;
flex: 1;
width: 100%;
box-sizing: border-box;
flex-direction: row;
padding: 22rpx 30rpx;
display: flex;
flex: 1;
width: 100%;
box-sizing: border-box;
flex-direction: row;
padding: 22px 30px;
}
.uni-triplex-right,
.uni-triplex-left {
display: flex;
flex-direction: column;
display: flex;
flex-direction: column;
}
.uni-triplex-left {
width: 84%;
width: 84%;
}
.uni-triplex-right {
width: 16%;
text-align: right;
width: 16%;
text-align: right;
}
/*图文列表*/
/* 图文列表 */
.uni-media-list {
padding: 22rpx 30rpx;
box-sizing: border-box;
display: flex;
width: 100%;
flex-direction: row;
padding: 22px 30px;
box-sizing: border-box;
display: flex;
width: 100%;
flex-direction: row;
}
.uni-navigate-right.uni-media-list {
padding-right: 74rpx;
padding-right: 74px;
}
.uni-pull-right {
flex-direction: row-reverse;
flex-direction: row-reverse;
}
.uni-pull-right>.uni-media-list-logo {
margin-right: 0rpx;
margin-left: 20rpx;
margin-right: 0px;
margin-left: 20px;
}
.uni-media-list-logo {
height: 84rpx;
width: 84rpx;
margin-right: 20rpx;
height: 84px;
width: 84px;
margin-right: 20px;
}
.uni-media-list-body {
height: 84rpx;
display: flex;
flex: 1;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
overflow: hidden;
height: 84px;
display: flex;
flex: 1;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
overflow: hidden;
}
.uni-media-list-text-top {
width: 100%;
line-height: 36rpx;
font-size: 34rpx;
width: 100%;
line-height: 36px;
font-size: 34px;
}
.uni-media-list-text-bottom {
width: 100%;
line-height: 30rpx;
font-size: 28rpx;
color: #8f8f94;
width: 100%;
line-height: 30px;
font-size: 28px;
color: #8f8f94;
}
/*九宫格*/
/* 九宫格 */
.uni-grid-9 {
background: #f2f2f2;
width: 750rpx;
display: flex;
flex-direction: row;
flex-wrap: wrap;
border-top: 1px solid #eee;
background: #f2f2f2;
width: 750px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
border-top: 2px solid #eee;
}
.uni-grid-9-item {
width: 250rpx;
height: 200rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-bottom: 2rpx solid;
border-right: 2rpx solid;
border-color: #eee;
box-sizing: border-box;
width: 250px;
height: 200px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-bottom: 2px solid;
border-right: 2px solid;
border-color: #eee;
box-sizing: border-box;
}
.no-border-right {
border-right: none;
border-right: none;
}
.uni-grid-9-image {
width: 100rpx;
height: 100rpx;
width: 100px;
height: 100px;
}
.uni-grid-9-text {
width: 250rpx;
line-height: 50rpx;
height: 50rpx;
text-align: center;
font-size: 30rpx;
width: 250px;
line-height: 50px;
height: 50px;
text-align: center;
font-size: 30px;
}
.uni-grid-9-item-hover {
background: rgba(0, 0, 0, 0.1);
background: rgba(0, 0, 0, 0.1);
}
/*上传*/
/* 上传 */
.uni-uploader {
flex: 1;
flex-direction: column;
flex: 1;
flex-direction: column;
}
.uni-uploader-head {
display: flex;
flex-direction: row;
justify-content: space-between;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.uni-uploader-info {
color: #B2B2B2;
color: #B2B2B2;
}
.uni-uploader-body {
margin-top: 16rpx;
overflow: hidden;
margin-top: 16px;
overflow: hidden;
}
.uni-uploader__file {
float: left;
margin-right: 9px;
margin-bottom: 9px;
float: left;
margin-right: 18px;
margin-bottom: 18px;
}
.uni-uploader__img {
display: block;
width: 79px;
height: 79px;
display: block;
width: 158px;
height: 158px;
}
.uni-uploader__input-box {
float: left;
position: relative;
margin-right: 9px;
margin-bottom: 9px;
width: 77px;
height: 77px;
border: 1px solid #D9D9D9;
float: left;
position: relative;
margin-right: 18px;
margin-bottom: 18px;
width: 154px;
height: 154px;
border: 2px solid #D9D9D9;
}
.uni-uploader__input-box:before,
.uni-uploader__input-box:after {
content: " ";
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #D9D9D9;
content: " ";
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #D9D9D9;
}
.uni-uploader__input-box:before {
width: 2px;
height: 39.5px;
width: 4px;
height: 79px;
}
.uni-uploader__input-box:after {
width: 39.5px;
height: 2px;
width: 79px;
height: 4px;
}
.uni-uploader__input-box:active {
border-color: #999999;
border-color: #999999;
}
.uni-uploader__input-box:active:before,
.uni-uploader__input-box:active:after {
background-color: #999999;
background-color: #999999;
}
.uni-uploader__input {
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
}
/*问题反馈*/
.feedback-title {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 20rpx;
color: #8f8f94;
font-size: 28rpx;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 20px;
color: #8f8f94;
font-size: 28px;
}
.feedback-star-view.feedback-title {
justify-content: flex-start;
margin: 0;
justify-content: flex-start;
margin: 0;
}
.feedback-quick {
position: relative;
padding-right: 40rpx;
position: relative;
padding-right: 40px;
}
.feedback-quick:after {
font-family: uniicons;
font-size: 40rpx;
content: '\e581';
position: absolute;
right: 0;
top: 50%;
color: #bbb;
transform: translateY(-50%);
font-family: uniicons;
font-size: 40px;
content: '\e581';
position: absolute;
right: 0;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.feedback-body {
background: #fff;
background: #fff;
}
.feedback-textare {
height: 200rpx;
font-size: 34rpx;
padding: 20rpx 30rpx 0;
height: 200px;
font-size: 34px;
padding: 20px 30px 0;
}
.feedback-input {
height: 80rpx;
font-size: 34rpx;
padding-left: 20rpx;
height: 80px;
font-size: 34px;
padding-left: 20px;
}
.feedback-uploader {
padding: 22rpx 20rpx;
padding: 22px 20px;
}
.feedback-star {
font-family: uniicons;
font-size: 40rpx;
margin-left: 6rpx;
font-family: uniicons;
font-size: 40px;
margin-left: 6px;
}
.feedback-star-view {
margin-left: 20rpx;
margin-left: 20px;
}
.feedback-star:after {
content: '\e408';
content: '\e408';
}
.feedback-star.active {
color: #FFB400;
color: #FFB400;
}
.feedback-star.active:after {
content: '\e438';
content: '\e438';
}
.feedback-submit {
background: #007AFF;
color: #FFFFFF;
margin: 20rpx;
background: #007AFF;
color: #FFFFFF;
margin: 20px;
}
examples/hello-uniapp/common/util.js
浏览文件 @ 645e0be7
function formatTime(time) {
if (typeof time !== 'number' || time < 0) {
return time
}
if (typeof time !== 'number' || time < 0) {
return time
}
var hour = parseInt(time / 3600)
time = time % 3600
var minute = parseInt(time / 60)
time = time % 60
var second = time
var hour = parseInt(time / 3600)
time = time % 3600
var minute = parseInt(time / 60)
time = time % 60
var second = time
return ([hour, minute, second]).map(function (n) {
n = n.toString()
return n[1] ? n : '0' + n
}).join(':')
return ([hour, minute, second]).map(function (n) {
n = n.toString()
return n[1] ? n : '0' + n
}).join(':')
}
function formatLocation(longitude, latitude) {
if (typeof longitude === 'string' && typeof latitude === 'string') {
longitude = parseFloat(longitude)
latitude = parseFloat(latitude)
}
if (typeof longitude === 'string' && typeof latitude === 'string') {
longitude = parseFloat(longitude)
latitude = parseFloat(latitude)
}
longitude = longitude.toFixed(2)
latitude = latitude.toFixed(2)
longitude = longitude.toFixed(2)
latitude = latitude.toFixed(2)
return {
longitude: longitude.toString().split('.'),
latitude: latitude.toString().split('.')
}
return {
longitude: longitude.toString().split('.'),
latitude: latitude.toString().split('.')
}
}
var dateUtils = {
UNITS: {
'年': 31557600000,
'月': 2629800000,
'天': 86400000,
'小时': 3600000,
'分钟': 60000,
'秒': 1000
},
humanize: function (milliseconds) {
var humanize = '';
for (var key in this.UNITS) {
if (milliseconds >= this.UNITS[key]) {
humanize = Math.floor(milliseconds / this.UNITS[key]) + key + '前';
break;
}
}
return humanize || '刚刚';
},
format: function (dateStr) {
var date = this.parse(dateStr)
var diff = Date.now() - date.getTime();
if (diff < this.UNITS['天']) {
return this.humanize(diff);
}
var _format = function (number) {
return (number < 10 ? ('0' + number) : number);
};
return date.getFullYear() + '/' + _format(date.getMonth() + 1) + '/' + _format(date.getDay()) + '-' +
_format(date.getHours()) + ':' + _format(date.getMinutes());
},
parse: function (str) { //将"yyyy-mm-dd HH:MM:ss"格式的字符串，转化为一个Date对象
var a = str.split(/[^0-9]/);
return new Date(a[0], a[1] - 1, a[2], a[3], a[4], a[5]);
}
UNITS: {
'年': 31557600000,
'月': 2629800000,
'天': 86400000,
'小时': 3600000,
'分钟': 60000,
'秒': 1000
},
humanize: function (milliseconds) {
var humanize = '';
for (var key in this.UNITS) {
if (milliseconds >= this.UNITS[key]) {
humanize = Math.floor(milliseconds / this.UNITS[key]) + key + '前';
break;
}
}
return humanize || '刚刚';
},
format: function (dateStr) {
var date = this.parse(dateStr)
var diff = Date.now() - date.getTime();
if (diff < this.UNITS['天']) {
return this.humanize(diff);
}
var _format = function (number) {
return (number < 10 ? ('0' + number) : number);
};
return date.getFullYear() + '/' + _format(date.getMonth() + 1) + '/' + _format(date.getDay()) + '-' +
_format(date.getHours()) + ':' + _format(date.getMinutes());
},
parse: function (str) { //将"yyyy-mm-dd HH:MM:ss"格式的字符串，转化为一个Date对象
var a = str.split(/[^0-9]/);
return new Date(a[0], a[1] - 1, a[2], a[3], a[4], a[5]);
}
};
module.exports = {
formatTime: formatTime,
formatLocation: formatLocation,
dateUtils: dateUtils
formatTime: formatTime,
formatLocation: formatLocation,
dateUtils: dateUtils
}
examples/hello-uniapp/components/number-box.vue
浏览文件 @ 645e0be7
<template>
<view class="uni-numbox">
<view class="uni-numbox-minus" :class="{'uni-numbox-disabled': disableSubtract}" @click="subtract">-</view>
<input class="uni-numbox-value" type="number" v-model="value" @blur="handleBlur">
<view class="uni-numbox-plus" :class="{'uni-numbox-disabled': disableAdd}" @click="add">+</view>
</view>
<view class="uni-numbox">
<view class="uni-numbox-minus" :class="{'uni-numbox-disabled': disableSubtract}" @click="subtract">-</view>
<input class="uni-numbox-value" type="number" v-model="value" @blur="handleBlur">
<view class="uni-numbox-plus" :class="{'uni-numbox-disabled': disableAdd}" @click="add">+</view>
</view>
</template>
<script>
export default {
name: 'number-box',
props: {
value: {
type: Number,
default: 0
},
min: {
type: Number,
default: -Infinity
},
max: {
type: Number,
default: Infinity
},
step: {
type: Number,
default: 1
}
},
computed: {
disableSubtract() {
return this.value <= this.min
},
disableAdd() {
return this.value >= this.max
}
},
methods: {
subtract(evt) {
this._handleStep('subtract');
},
add(evt) {
this._handleStep('add');
},
_handleStep(type) {
let value = this.value;
if (type === 'subtract') {
value -= this.step
} else if (type === 'add') {
value += this.step
}
if (value < this.min || value > this.max) {
return
}
this.value = value
},
handleBlur(evt) {
let value = evt.detail.value;
if (!value) {
this.value = 0;
return
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min
}
this.value = value
}
}
}
export default {
name: 'number-box',
props: {
value: {
type: Number,
default: 0
},
min: {
type: Number,
default: -Infinity
},
max: {
type: Number,
default: Infinity
},
step: {
type: Number,
default: 1
}
},
computed: {
disableSubtract() {
return this.value <= this.min
},
disableAdd() {
return this.value >= this.max
}
},
onUnload(){
this.value = 0,
this.step = 1,
this.max = Infinity,
this.min = -Infinity;
},
methods: {
subtract(evt) {
this._handleStep('subtract');
},
add(evt) {
this._handleStep('add');
},
_handleStep(type) {
let value = this.value;
if (type === 'subtract') {
value -= this.step
} else if (type === 'add') {
value += this.step
}
if (value < this.min || value > this.max) {
return
}
this.value = value
},
handleBlur(evt) {
let value = evt.detail.value;
if (!value) {
this.value = 0;
return
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min
}
this.value = value
}
}
}
</script>
<style>
.uni-numbox {
display: flex;
flex-direction: row;
justify-content: flex-start;
height: 70rpx;
}
.uni-numbox {
display: flex;
flex-direction: row;
justify-content: flex-start;
height: 70px;
}
.uni-numbox-minus,
.uni-numbox-plus {
margin: 0;
background-color: #f9f9f9;
width: 80rpx;
height: 100%;
line-height: 70rpx;
text-align: center;
color: #555555;
}
.uni-numbox-minus,
.uni-numbox-plus {
margin: 0;
background-color: #f9f9f9;
width: 80px;
height: 100%;
line-height: 70px;
text-align: center;
color: #555555;
}
.uni-numbox-minus {
border: 2rpx solid #cccccc;
border-right: none;
border-top-left-radius: 6rpx;
border-bottom-left-radius: 6rpx;
}
.uni-numbox-minus {
border: 2px solid #cccccc;
border-right: none;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
.uni-numbox-plus {
border: 2rpx solid #cccccc;
border-left: none;
border-top-right-radius: 6rpx;
border-bottom-right-radius: 6rpx;
}
.uni-numbox-plus {
border: 2px solid #cccccc;
border-left: none;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.uni-numbox-value {
border: 2rpx solid #cccccc;
background-color: #ffffff;
width: 80rpx;
height: 100%;
text-align: center;
}
.uni-numbox-value {
border: 2px solid #cccccc;
background-color: #ffffff;
width: 80px;
height: 100%;
text-align: center;
}
.uni-numbox-disabled {
color: #c0c0c0;
}
.uni-numbox-disabled {
color: #c0c0c0;
}
</style>
examples/hello-uniapp/components/page-head.vue
浏览文件 @ 645e0be7
<template name="page-head">
<view class="page-head">
<view class="page-head-title">{{title}}</view>
<view class="page-head-line"></view>
<view v-if="desc" class="page-head-desc">{{desc}}</view>
</view>
<view class="page-head">
<view class="page-head-title">{{title}}</view>
</view>
</template>
<script>
export default {
name: "page-head",
props: {
title: {
type: String,
default: ""
}
}
}
export default {
name: "page-head",
props: {
title: {
type: String,
default: ""
}
}
}
</script>
examples/hello-uniapp/main.js
浏览文件 @ 645e0be7
......@@ -10,7 +10,7 @@ Vue.prototype.$store = store
App.mpType = 'app'
const app = new Vue({
store,
...App
store,
...App
})
app.$mount()
examples/hello-uniapp/manifest.json
浏览文件 @ 645e0be7
{
"name": "hello uni-app",
"appid": "__UNI__123213213",
"description": "应用描述",
"versionName": "1.0.0",
"versionCode": "100",
"app-plus": { // 5+App特有相关
"modules": {},
"distribute": {
"android": {},
"ios": {},
"sdkConfigs": {}
}
},
"quickapp": { // 快应用特有相关
},
"mp-weixin": { // 小程序特有相关
}
"name": "hello uni-app",
"appid": "__UNI__123213213",
"description": "应用描述",
"versionName": "1.0.0",
"versionCode": "100",
"app-plus": {/* 5+App特有相关 */
"modules": {
"OAuth": {},
"Payment": {},
"Push": {},
"Share": {},
"Speech": {}
},
"distribute": {/* 应用发布信息 */
"android": {/* android打包配置 */
"permissions": [
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_MOCK_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.GET_TASKS\"/>",
"<uses-permission android:name=\"android.permission.INTERNET\"/>",
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.READ_SMS\"/>",
"<uses-permission android:name=\"android.permission.RECEIVE_BOOT_COMPLETED\"/>",
"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
"<uses-permission android:name=\"android.permission.SEND_SMS\"/>",
"<uses-permission android:name=\"android.permission.SYSTEM_ALERT_WINDOW\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
"<uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SMS\"/>",
"<uses-permission android:name=\"android.permission.RECEIVE_USER_PRESENT\"/>"
]
},
"ios": {},/* ios打包配置 */
"sdkConfigs": {},/* SDK配置 */
"orientation": ["portrait-primary"]
}
},
"quickapp": {},/* 快应用特有相关 */
"mp-weixin": {}/* 小程序特有相关 */
}
examples/hello-uniapp/pages.json
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/API.vue 0 → 100644
浏览文件 @ 645e0be7
<template>
<view class="index">
<view class="index-hd">
<image class="index-logo" src="../../static/apiIndex.png"></image>
<view class="page-section-title">以下将演示uni-app接口能力，具体属性参数详见uni-app开发文档。</view>
</view>
<view class="uni-card" v-for="(list,index) in lists" :key="index">
<view class="uni-list">
<view class="uni-list-cell uni-collapse">
<view class="uni-list-cell-navigate uni-navigate-bottom" hover-class="uni-list-cell-hover" :class="list.open ? 'uni-active' : ''"
@click="trigerCollapse(index)">
{{list.name}}
</view>
<view class="uni-list uni-collapse" :class="list.open ? 'uni-active' : ''">
<view class="uni-list-cell" hover-class="uni-list-cell-hover" v-for="(item,key) in list.pages" :key="key" :url="item.url"
@click="goDetailPage(item.url)">
<view class="uni-list-cell-navigate uni-navigate-right"> {{item.name}} </view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
let list = [
{
id: 'page',
name: '界面',
open: false,
pages: [{
name: '设置界面标题',
url: 'set-navigation-bar-title'
}, {
name: '标题栏加载动画',
url: 'navigation-bar-loading'
}, {
name: '页面跳转',
url: 'navigator'
}, {
name: '下拉刷新',
url: 'pull-down-refresh'
}, {
name: '创建动画',
url: 'animation'
}, {
name: '创建绘画',
url: 'canvas'
}, {
name: '显示操作菜单',
url: 'action-sheet'
}, {
name: '显示模态弹窗',
url: 'modal'
}, {
name: '显示消息提示框',
url: 'toast'
}]
}, {
id: 'device',
name: '设备',
open: false,
pages: [{
name: '获取手机网络状态',
url: 'get-network-type'
}, {
name: '获取手机系统信息',
url: 'get-system-info'
}, {
name: '打电话',
url: 'make-phone-call'
}, {
name: '扫码',
url: 'scan-code'
}, {
name: '剪贴板',
url: 'clipboard'
}, {
name: '监听加速度传感器',
url: 'on-accelerometer-change'
}, {
name: '监听罗盘数据',
url: 'on-compass-change'
}
//#ifdef APP-PLUS
, {
name: '监听距离传感器',
url: '/platforms/app-plus/proximity/proximity'
}, {
name: '监听方向传感器',
url: '/platforms/app-plus/orientation/orientation'
}
//#endif
]
}, {
id: 'network',
name: '网络',
open: false,
pages: [{
name: '发起一个请求',
url: 'request'
}, {
name: '上传文件',
url: 'upload-file'
}, {
name: '下载文件',
url: 'download-file'
}]
}, {
id: 'media',
name: '媒体',
open: false,
pages: [{
name: '图片',
url: 'image'
}, {
name: '录音',
url: 'voice'
}, {
name: '背景音频',
url: 'background-audio'
}, {
name: '视频',
url: 'video'
}, {
name: '文件',
url: 'file'
}]
}, {
id: 'location',
name: '位置',
open: false,
pages: [{
name: '获取当前位置',
url: 'get-location'
}, {
name: '使用地图查看位置',
url: 'open-location'
}, {
name: '使用地图选择位置',
url: 'choose-location'
}]
}, {
id: 'storage',
name: '数据',
open: false,
pages: [{
name: '数据存储',
url: 'storage'
}]
}, {
id: 'login',
name: '登录',
open: false,
pages: [{
name: '登录',
url: 'login'
}, {
name: '获取用户信息',
url: 'get-user-info'
}]
}, {
id: 'payment',
name: '支付',
open: false,
pages: [{
name: '发起支付',
url: 'request-payment'
}]
}
//#ifdef APP-PLUS
, {
id: 'share',
name: '分享',
open: false,
pages: [{
name: '分享',
url: '/platforms/app-plus/share/share'
}]
}, {
id: 'speech',
name: '语音',
open: false,
pages: [{
name: '语音识别',
url: '/platforms/app-plus/speech/speech'
}]
}, {
id: 'push',
name: '推送',
open: false,
pages: [{
name: '推送',
url: '/platforms/app-plus/push/push'
}]
}
//#endif
];
return {
lists: list
}
},
onShareAppMessage() {
return {
title: '欢迎体验uniapp',
path: '/pages/API/API'
}
},
methods: {
trigerCollapse(e) {
for (let i = 0, len = this.lists.length; i < len; ++i) {
if (e === i) {
this.lists[i].open = !this.lists[i].open;
} else {
this.lists[i].open = false;
}
}
},
goDetailPage(e) {
let url = ~e.indexOf('platform') ? e : '/pages/API/' + e + '/' + e;
uni.navigateTo({
url: url
})
}
}
}
</script>
<style>
@import "../../common/uni.css";
.index{
padding-bottom: 1px;
}
.uni-card {
box-shadow: none;
}
.uni-list:after {
height: 0;
}
.uni-list:before {
height: 0;
}
</style>
examples/hello-uniapp/pages/API/action-sheet/action-sheet.vue 0 → 100644
浏览文件 @ 645e0be7
<template>
<view>
<page-head :title="title"></page-head>
<view class="page-body">
<view class="btn-area">
<button type="default" @tap="actionSheetTap">弹出action sheet</button>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
export default {
data() {
return {
title: 'action-sheet'
}
},
methods: {
actionSheetTap() {
uni.showActionSheet({
itemList: ['item1', 'item2', 'item3', 'item4'],
success: (e) => {
console.log(e.tapIndex)
}
})
}
},
components: {
pageHead
}
}
</script>
examples/hello-uniapp/pages/API/action-sheet/index.vue 已删除 100644 → 0
浏览文件 @ 6431887c
<template>
<view class="index">
<page-head :title="title"></page-head>
<view class="page-body">
<view class="btn-area">
<button type="default" @tap="actionSheetTap">弹出action sheet</button>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
export default {
data() {
return {
title: 'action-sheet'
}
},
methods: {
actionSheetTap() {
uni.showActionSheet({
itemList: ['item1', 'item2', 'item3', 'item4'],
success: (e) => {
console.log(e.tapIndex)
}
})
}
},
components: {
pageHead
}
}
</script>
examples/hello-uniapp/pages/API/animation/animation.vue 0 → 100644
浏览文件 @ 645e0be7
<template>
<view>
<page-head :title="title"></page-head>
<view class="page-body">
<view class="page-section">
<view class="animation-element-wrapper">
<view class="animation-element" :animation="animationData"></view>
</view>
<scroll-view class="animation-buttons" scroll-y="true">
<button class="animation-button" @tap="rotate">旋转</button>
<button class="animation-button" @tap="scale">缩放</button>
<button class="animation-button" @tap="translate">移动</button>
<button class="animation-button" @tap="skew">倾斜</button>
<button class="animation-button" @tap="rotateAndScale">旋转并缩放</button>
<button class="animation-button" @tap="rotateThenScale">旋转后缩放</button>
<button class="animation-button" @tap="all">同时展示全部</button>
<button class="animation-button" @tap="allInQueue">顺序展示全部</button>
<button class="animation-button animation-button-reset" @tap="reset">还原</button>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
export default {
data() {
return {
title: 'createAnimation',
animationData: ''
}
},
onUnload(){
this.animationData = ''
},
onLoad() {
this.animation = uni.createAnimation()
},
methods: {
rotate: function () {
this.animation.rotate(Math.random() * 720 - 360).step()
this.animationData = this.animation.export()
},
scale: function () {
this.animation.scale(Math.random() * 2).step()
this.animationData = this.animation.export()
},
translate: function () {
this.animation.translate(Math.random() * 100 - 50, Math.random() * 100 - 50).step()
this.animationData = this.animation.export()
},
skew: function () {
this.animation.skew(Math.random() * 90, Math.random() * 90).step()
this.animationData = this.animation.export()
},
rotateAndScale: function () {
this.animation.rotate(Math.random() * 720 - 360)
.scale(Math.random() * 2)
.step()
this.animationData = this.animation.export()
},
rotateThenScale: function () {
this.animation.rotate(Math.random() * 720 - 360).step()
.scale(Math.random() * 2).step()
this.animationData = this.animation.export()
},
all: function () {
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.animationData = this.animation.export()
},
allInQueue: function () {
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.animationData = this.animation.export()
},
reset: function () {
this.animation.rotate(0, 0)
.scale(1)
.translate(0, 0)
.skew(0, 0)
.step({
duration: 0
})
this.animationData = this.animation.export()
}
},
components: {
pageHead
}
}
</script>
<style>
.animation-element-wrapper {
display: flex;
width: 100%;
padding-top: 150px;
padding-bottom: 150px;
justify-content: center;
overflow: hidden;
background-color: #ffffff;
}
.animation-element {
width: 200px;
height: 200px;
background-color: #1AAD19;
}
.animation-buttons {
padding: 30px 50px 10px;
width: 100%;
height: 360px;
box-sizing: border-box;
}
.animation-button {
float: left;
line-height: 2;
width: 300px;
margin: 15px 12px;
}
.animation-button-reset {
width: 620px;
}
</style>
examples/hello-uniapp/pages/API/animation/index.vue 已删除 100644 → 0
浏览文件 @ 6431887c
<template>
<view class="index">
<page-head :title="title"></page-head>
<view class="page-body">
<view class="page-section">
<view class="animation-element-wrapper">
<view class="animation-element" :animation="animationData"></view>
</view>
<scroll-view class="animation-buttons" scroll-y="true">
<button class="animation-button" @tap="rotate">旋转</button>
<button class="animation-button" @tap="scale">缩放</button>
<button class="animation-button" @tap="translate">移动</button>
<button class="animation-button" @tap="skew">倾斜</button>
<button class="animation-button" @tap="rotateAndScale">旋转并缩放</button>
<button class="animation-button" @tap="rotateThenScale">旋转后缩放</button>
<button class="animation-button" @tap="all">同时展示全部</button>
<button class="animation-button" @tap="allInQueue">顺序展示全部</button>
<button class="animation-button animation-button-reset" @tap="reset">还原</button>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
export default {
data() {
return {
title: 'createAnimation',
animationData: ''
}
},
onReady: function () {
this.animation = uni.createAnimation()
},
methods: {
rotate: function () {
this.animation.rotate(Math.random() * 720 - 360).step()
this.animationData = this.animation.export()
},
scale: function () {
this.animation.scale(Math.random() * 2).step()
this.animationData = this.animation.export()
},
translate: function () {
this.animation.translate(Math.random() * 100 - 50, Math.random() * 100 - 50).step()
this.animationData = this.animation.export()
},
skew: function () {
this.animation.skew(Math.random() * 90, Math.random() * 90).step()
this.animationData = this.animation.export()
},
rotateAndScale: function () {
this.animation.rotate(Math.random() * 720 - 360)
.scale(Math.random() * 2)
.step()
this.animationData = this.animation.export()
},
rotateThenScale: function () {
this.animation.rotate(Math.random() * 720 - 360).step()
.scale(Math.random() * 2).step()
this.animationData = this.animation.export()
},
all: function () {
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.animationData = this.animation.export()
},
allInQueue: function () {
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.animationData = this.animation.export()
},
reset: function () {
this.animation.rotate(0, 0)
.scale(1)
.translate(0, 0)
.skew(0, 0)
.step({
duration: 0
})
this.animationData = this.animation.export()
}
},
components: {
pageHead
}
}
</script>
<style>
.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;
}
</style>
examples/hello-uniapp/pages/API/background-audio/background-audio.vue 0 → 100644
浏览文件 @ 645e0be7
<template>
<view>
<page-head :title="title"></page-head>
<view class="page-section">
<view class="page-body-info">
<text class="time-big">{{formatedPlayTime}}</text>
<slider class="slider" min="0" max="21" step="1" :value="playTime" @change="seek"></slider>
<view class="play-time">
<text>00:00</text>
<text>00:21</text>
</view>
</view>
<view class="page-body-text">注意：离开当前页面后背景音乐将保持播放，但退出uni-app将停止</view>
<view class="page-body-buttons">
<block v-if="playing === true">
<view class="page-body-button" @tap="stop">
<image src="../../../static/stop.png"></image>
</view>
<view class="page-body-button" @tap="pause">
<image src="../../../static/pause.png"></image>
</view>
</block>
<block v-if="playing === false">
<view class="page-body-button"></view>
<view class="page-body-button" @tap="play">
<image src="../../../static/play.png"></image>
</view>
</block>
<view class="page-body-button"></view>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
var util = require('../../../common/util.js');
export default {
data() {
return {
title: 'backgroundAudio',
bgAudioMannager: null,
dataUrl: 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.mp3',
playing: false,
playTime: 0,
formatedPlayTime: '00:00:00'
}
},
onLoad: function () {
const bgAudioMannager = uni.getBackgroundAudioManager();
bgAudioMannager.title = '致爱丽丝';
bgAudioMannager.singer = '暂无';
bgAudioMannager.coverImgUrl = 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.jpg';
bgAudioMannager.onPlay(() => {
console.log("开始播放");
this.playing = true;
})
bgAudioMannager.onPause(() => {
console.log("暂停播放");
this.playing = false;
})
bgAudioMannager.onEnded(() => {
this.playing = false;
this.playTime = 0;
this.formatedPlayTime = util.formatTime(0);
})
bgAudioMannager.onTimeUpdate((e) => {
if (Math.floor(this.bgAudioMannager.currentTime) > Math.floor(this.playTime)) {
this.formatedPlayTime = util.formatTime(Math.floor(this.bgAudioMannager.currentTime));
}
this.playTime = this.bgAudioMannager.currentTime;
})
this.bgAudioMannager = bgAudioMannager;
},
methods: {
play: function (res) {
if (!this.bgAudioMannager.src) {
this.bgAudioMannager.startTime = this.playTime;
this.bgAudioMannager.src = this.dataUrl;
} else {
this.bgAudioMannager.seek(this.playTime);
this.bgAudioMannager.play();
}
},
seek: function (e) {
this.bgAudioMannager.seek(e.target.value);
},
pause: function () {
this.bgAudioMannager.pause();
},
stop: function () {
this.bgAudioMannager.stop();
this.playing = false;
this.playTime = 0;
this.formatedPlayTime = util.formatTime(0);
}
},
components: {
pageHead
}
}
</script>
<style>
image {
width: 150px;
height: 150px;
}
.page-body-text {
padding: 0 30px;
}
.page-body-wrapper {
margin-top: 0;
}
.page-body-info {
padding-bottom: 50px;
}
.time-big {
font-size: 60px;
margin: 20px;
}
.slider {
width: 650px;
}
.play-time {
font-size: 28px;
width: 700px;
padding: 20px 0;
display: flex;
justify-content: space-between;
box-sizing: border-box;
}
.page-body-buttons {
display: flex;
justify-content: space-around;
margin-top: 100px;
}
.page-body-button {
width: 250px;
text-align: center;
}
</style>
examples/hello-uniapp/pages/API/background-audio/index.vue 已删除 100644 → 0
浏览文件 @ 6431887c
<template>
<view class="index">
<page-head :title="title"></page-head>
<view class="page-section">
<view class="page-body-info">
<text class="time-big">{{formatedPlayTime}}</text>
<slider class="slider" min="0" max="46" step="1" :value="playTime" @change="seek"></slider>
<view class="play-time">
<text>00:00</text>
<text>00:46</text>
</view>
</view>
<view class="page-body-text">注意：离开当前页面后背景音乐将保持播放，但退出uni-app将停止</view>
<view class="page-body-buttons">
<block v-if="playing === true">
<view class="page-body-button" @tap="stop">
<image src="../../../static/stop.png"></image>
</view>
<view class="page-body-button" @tap="pause">
<image src="../../../static/pause.png"></image>
</view>
</block>
<block v-if="playing === false">
<view class="page-body-button"></view>
<view class="page-body-button" @tap="play">
<image src="../../../static/play.png"></image>
</view>
</block>
<view class="page-body-button"></view>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
var util = require('../../../common/util.js');
export default {
data() {
return {
title: 'backgroundAudio',
bgAudioMannager: null,
dataUrl: 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/friendship.mp3',
playing: false,
playTime: 0,
formatedPlayTime: '00:00:00'
}
},
onLoad: function () {
const bgAudioMannager = uni.getBackgroundAudioManager();
bgAudioMannager.title = '友谊地久天长';
bgAudioMannager.singer = '群星';
bgAudioMannager.coverImgUrl = 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/friendship.jpg';
bgAudioMannager.onPlay(() => {
console.log("开始播放");
this.playing = true;
})
bgAudioMannager.onPause(() => {
console.log("暂停播放");
this.playing = false;
})
bgAudioMannager.onEnded(() => {
this.playing = false;
this.playTime = 0;
this.formatedPlayTime = util.formatTime(0);
})
bgAudioMannager.onTimeUpdate((e) => {
if (Math.floor(this.bgAudioMannager.currentTime) > Math.floor(this.playTime)) {
this.formatedPlayTime = util.formatTime(Math.floor(this.bgAudioMannager.currentTime));
}
this.playTime = this.bgAudioMannager.currentTime;
})
this.bgAudioMannager = bgAudioMannager;
},
methods: {
play: function (res) {
if (!this.bgAudioMannager.src) {
this.bgAudioMannager.startTime = this.playTime;
this.bgAudioMannager.src = this.dataUrl;
} else {
this.bgAudioMannager.seek(this.playTime);
this.bgAudioMannager.play();
}
},
seek: function (e) {
this.bgAudioMannager.seek(e.target.value);
},
pause: function () {
this.bgAudioMannager.pause();
},
stop: function () {
this.bgAudioMannager.stop();
this.playing = false;
this.playTime = 0;
this.formatedPlayTime = util.formatTime(0);
}
},
components: {
pageHead
}
}
</script>
<style>
image {
width: 150rpx;
height: 150rpx;
}
.page-body-text {
padding: 0 30rpx;
}
.page-body-wrapper {
margin-top: 0;
}
.page-body-info {
padding-bottom: 50rpx;
}
.time-big {
font-size: 60rpx;
margin: 20rpx;
}
.slider {
width: 650rpx;
}
.play-time {
font-size: 28rpx;
width: 700rpx;
padding: 20rpx 0;
display: flex;
justify-content: space-between;
box-sizing: border-box;
}
.page-body-buttons {
display: flex;
justify-content: space-around;
margin-top: 100rpx;
}
.page-body-button {
width: 250rpx;
text-align: center;
}
</style>
examples/hello-uniapp/pages/API/canvas/canvas.vue 0 → 100644
浏览文件 @ 645e0be7
<template>
<view>
<page-head :title="title"></page-head>
<view class="page-body">
<view class="page-section">
<canvas class="canvas-element" canvas-id="canvas"></canvas>
<scroll-view class="canvas-buttons" scroll-y="true">
<block v-for="(name, index) in names" :key="index">
<button class="canvas-button" @tap="handleCanvasButton(name)">{{name}}</button>
</block>
<button class="canvas-button" @tap="toTempFilePath" type="primary">toTempFilePath</button>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
var context = null;
export default {
data() {
return {
title: 'createContext',
names: ["rotate", "scale", "reset", "translate", "save", "restore", "drawImage", "fillText", "fill",
"stroke", "clearRect", "beginPath", "closePath", "moveTo", "lineTo", "rect", "arc",
"quadraticCurveTo", "bezierCurveTo", "setFillStyle", "setStrokeStyle", "setGlobalAlpha",
"setShadow", "setFontSize", "setLineCap", "setLineJoin", "setLineWidth", "setMiterLimit"
]
}
},
onReady: function () {
context = uni.createCanvasContext('canvas')
},
methods: {
toTempFilePath: function () {
uni.canvasToTempFilePath({
canvasId: 'canvas',
success: function (res) {
console.log(res)
},
fail: function (res) {
console.log(res)
}
})
},
handleCanvasButton: function (name) {
this[name]()
},
rotate: function () {
context.beginPath()
context.rotate(10 * Math.PI / 180)
context.rect(225, 75, 20, 10)
context.fill()
context.draw()
},
scale: function () {
context.beginPath()
context.rect(25, 25, 50, 50)
context.stroke()
context.scale(2, 2)
context.beginPath()
context.rect(25, 25, 50, 50)
context.stroke()
context.draw()
},
reset: function () {
context.beginPath()
context.setFillStyle('#000000')
context.setStrokeStyle('#000000')
context.setFontSize(10)
context.setGlobalAlpha(1)
context.setShadow(0, 0, 0, 'rgba(0, 0, 0, 0)')
context.setLineCap('butt')
context.setLineJoin('miter')
context.setLineWidth(1)
context.setMiterLimit(10)
context.draw()
},
translate: function () {
context.beginPath()
context.rect(10, 10, 100, 50)
context.fill()
context.translate(70, 70)
context.beginPath()
context.fill()
context.draw()
},
save: function () {
context.beginPath()
context.setStrokeStyle('#00ff00')
context.save()
context.scale(2, 2)
context.setStrokeStyle('#ff0000')
context.rect(0, 0, 100, 100)
context.stroke()
context.restore()
context.rect(0, 0, 50, 50)
context.stroke()
context.draw()
},
restore: function () {
[3, 2, 1].forEach(function (item) {
context.beginPath()
context.save()
context.scale(item, item)
context.rect(10, 10, 100, 100)
context.stroke()
context.restore()
});
context.draw()
},
drawImage: function () {
context.drawImage('../../../static/uni@2x.png', 0, 0)
context.draw()
},
fillText: function () {
context.setStrokeStyle('#ff0000')
context.beginPath()
context.moveTo(0, 10)
context.lineTo(300, 10)
context.stroke()
// context.save()
// context.scale(1.5, 1.5)
// context.translate(20, 20)
context.setFontSize(10)
context.fillText('Hello World', 0, 30)
context.setFontSize(20)
context.fillText('Hello World', 100, 30)
// context.restore()
context.beginPath()
context.moveTo(0, 30)
context.lineTo(300, 30)
context.stroke()
context.draw()
},
fill: function () {
context.beginPath()
context.rect(20, 20, 150, 100)
context.setStrokeStyle('#00ff00')
context.fill()
context.draw()
},
stroke: function () {
context.beginPath()
context.moveTo(20, 20)
context.lineTo(20, 100)
context.lineTo(70, 100)
context.setStrokeStyle('#00ff00')
context.stroke()
context.draw()
},
clearRect: function () {
context.setFillStyle('#ff0000')
context.beginPath()
context.rect(0, 0, 300, 150)
context.fill()
context.clearRect(20, 20, 100, 50)
context.draw()
},
beginPath: function () {
context.beginPath()
context.setLineWidth(5)
context.setStrokeStyle('#ff0000')
context.moveTo(0, 75)
context.lineTo(250, 75)
context.stroke()
context.beginPath()
context.setStrokeStyle('#0000ff')
context.moveTo(50, 0)
context.lineTo(150, 130)
context.stroke()
context.draw()
},
closePath: function () {
context.beginPath()
context.setLineWidth(1)
context.moveTo(20, 20)
context.lineTo(20, 100)
context.lineTo(70, 100)
context.closePath()
context.stroke()
context.draw()
},
moveTo: function () {
context.beginPath()
context.moveTo(0, 0)
context.lineTo(300, 150)
context.stroke()
context.draw()
},
lineTo: function () {
context.beginPath()
context.moveTo(20, 20)
context.lineTo(20, 100)
context.lineTo(70, 100)
context.stroke()
context.draw()
},
rect: function () {
context.beginPath()
context.rect(20, 20, 150, 100)
context.stroke()
context.draw()
},
arc: function () {
context.beginPath()
context.setLineWidth(2)
context.arc(75, 75, 50, 0, Math.PI * 2, true)
context.moveTo(110, 75)
context.arc(75, 75, 35, 0, Math.PI, false)
context.moveTo(65, 65)
context.arc(60, 65, 5, 0, Math.PI * 2, true)
context.moveTo(95, 65)
context.arc(90, 65, 5, 0, Math.PI * 2, true)
context.stroke()
context.draw()
},
quadraticCurveTo: function () {
context.beginPath()
context.moveTo(20, 20)
context.quadraticCurveTo(20, 100, 200, 20)
context.stroke()
context.draw()
},
bezierCurveTo: function () {
context.beginPath()
context.moveTo(20, 20)
context.bezierCurveTo(20, 100, 200, 100, 200, 20)
context.stroke()
context.draw()
},
setFillStyle: function () {
['#fef957', 'rgb(242,159,63)', 'rgb(242,117,63)', '#e87e51'].forEach(function (item, index) {
context.setFillStyle(item)
context.beginPath()
context.rect(0 + 75 * index, 0, 50, 50)
context.fill()
})
context.draw()
},
setStrokeStyle: function () {
['#fef957', 'rgb(242,159,63)', 'rgb(242,117,63)', '#e87e51'].forEach(function (item, index) {
context.setStrokeStyle(item)
context.beginPath()
context.rect(0 + 75 * index, 0, 50, 50)
context.stroke()
})
context.draw()
},
setGlobalAlpha: function () {
context.setFillStyle('#000000');
[1, 0.5, 0.1].forEach(function (item, index) {
context.setGlobalAlpha(item)
context.beginPath()
context.rect(0 + 75 * index, 0, 50, 50)
context.fill()
})
context.draw()
context.setGlobalAlpha(1)
},
setShadow: function () {
context.beginPath()
context.setShadow(10, 10, 10, 'rgba(0, 0, 0, 199)')
context.rect(10, 10, 100, 100)
context.fill()
context.draw()
},
setFontSize: function () {
[10, 20, 30, 40].forEach(function (item, index) {
context.setFontSize(item)
context.fillText('Hello, world', 20, 20 + 40 * index)
})
context.draw()
},
setLineCap: function () {
context.setLineWidth(10);
['butt', 'round', 'square'].forEach(function (item, index) {
context.beginPath()
context.setLineCap(item)
context.moveTo(20, 20 + 20 * index)
context.lineTo(100, 20 + 20 * index)
context.stroke()
})
context.draw()
},
setLineJoin: function () {
context.setLineWidth(10);
['bevel', 'round', 'miter'].forEach(function (item, index) {
context.beginPath()
context.setLineJoin(item)
context.moveTo(20 + 80 * index, 20)
context.lineTo(100 + 80 * index, 50)
context.lineTo(20 + 80 * index, 100)
context.stroke()
})
context.draw()
},
setLineWidth: function () {
[2, 4, 6, 8, 10].forEach(function (item, index) {
context.beginPath()
context.setLineWidth(item)
context.moveTo(20, 20 + 20 * index)
context.lineTo(100, 20 + 20 * index)
context.stroke()
})
context.draw()
},
setMiterLimit: function () {
context.setLineWidth(4);
[2, 4, 6, 8, 10].forEach(function (item, index) {
context.beginPath()
context.setMiterLimit(item)
context.moveTo(20 + 80 * index, 20)
context.lineTo(100 + 80 * index, 50)
context.lineTo(20 + 80 * index, 100)
context.stroke()
})
context.draw()
}
},
components: {
pageHead
}
}
</script>
<style>
.canvas-element-wrapper {
display: block;
margin-bottom: 100px;
}
.canvas-element {
width: 100%;
height: 500px;
background-color: #ffffff;
}
.canvas-buttons {
padding: 30px 50px 10px;
width: 100%;
height: 360px;
box-sizing: border-box;
}
.canvas-button {
float: left;
line-height: 2;
width: 300px;
margin: 15px 12px;
}
</style>
examples/hello-uniapp/pages/API/choose-location/choose-location.vue 0 → 100644
浏览文件 @ 645e0be7
<template>
<view>
<page-head :title="title"></page-head>
<view class="page-body">
<view class="page-section">
<view class="page-body-info">
<text class="page-body-text-small">当前位置信息</text>
<block v-if="hasLocation === false">
<text class="page-body-text">未选择位置</text>
</block>
<block v-if="hasLocation === true">
<text class="page-body-text">{{locationAddress}}</text>
<view class="page-body-text-location">
<text>E: {{location.longitude[0]}}°{{location.longitude[1]}}′</text>
<text>N: {{location.latitude[0]}}°{{location.latitude[1]}}′</text>
</view>
</block>
</view>
<view class="btn-area">
<button type="primary" @tap="chooseLocation">选择位置</button>
<button @tap="clear">清空</button>
</view>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
var util = require('../../../common/util.js');
var formatLocation = util.formatLocation;
export default {
data() {
return {
title: 'chooseLocation',
hasLocation: false,
location: {},
locationAddress: ''
}
},
methods: {
chooseLocation: function () {
uni.chooseLocation({
success: (res) => {
this.hasLocation = true,
this.location = formatLocation(res.longitude, res.latitude),
this.locationAddress = res.address
}
})
},
clear: function () {
this.hasLocation = false
}
},
components: {
pageHead
}
}
</script>
<style>
.page-body-info {
padding-bottom: 0;
height: 440px;
}
</style>
examples/hello-uniapp/pages/API/choose-location/index.vue 已删除 100644 → 0
浏览文件 @ 6431887c
<template>
<view class="index">
<page-head :title="title"></page-head>
<view class="page-body">
<view class="page-section">
<view class="page-body-info">
<text class="page-body-text-small">当前位置信息</text>
<block v-if="hasLocation === false">
<text class="page-body-text">未选择位置</text>
</block>
<block v-if="hasLocation === true">
<text class="page-body-text">{{locationAddress}}</text>
<view class="page-body-text-location">
<text>E: {{location.longitude[0]}}°{{location.longitude[1]}}′</text>
<text>N: {{location.latitude[0]}}°{{location.latitude[1]}}′</text>
</view>
</block>
</view>
<view class="btn-area">
<button class="btn-chooselocation" @tap="chooseLocation">选择位置</button>
<button @tap="clear">清空</button>
</view>
</view>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
var util = require('../../../common/util.js');
var formatLocation = util.formatLocation;
export default {
data() {
return {
title: 'chooseLocation',
hasLocation: false,
location: {},
locationAddress: ''
}
},
methods: {
chooseLocation: function () {
var that = this
uni.chooseLocation({
success: function (res) {
console.log('.......' + res)
that.hasLocation = true,
that.location = formatLocation(res.longitude, res.latitude),
that.locationAddress = res.address
}
})
},
clear: function () {
this.hasLocation = false
}
},
components: {
pageHead
}
}
</script>
<style>
.page-body-info {
padding-bottom: 0;
height: 440rpx;
}
.btn-chooselocation {
background-color: #007aff;
color: #ffffff;
}
</style>
examples/hello-uniapp/pages/API/clipboard/clipboard.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/download-file/download-file.vue 0 → 100644
浏览文件 @ 645e0be7
<template>
<view>
<page-head :title="title"></page-head>
<view class="page-body">
<image v-if="imageSrc" :src="imageSrc" mode="center" />
<block v-else>
<view class="page-body-wording">
<text class="page-body-text">
点击按钮下载服务端示例图片
</text>
</view>
<view class="btn-area">
<button type="primary" @tap="downloadImage">下载</button>
</view>
</block>
</view>
</view>
</template>
<script>
import pageHead from '../../../components/page-head.vue';
export default {
data() {
return {
title: 'downloadFile',
imageSrc: ''
}
},
onUnload() {
this.imageSrc = '';
},
methods: {
downloadImage: function () {
var self = this
uni.downloadFile({
url: "https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png",
success: (res) => {
console.log('downloadFile success, res is', res)
self.imageSrc = res.tempFilePath
},
fail: (err) => {
console.log('downloadFile fail, err is:', err)
}
})
}
},
components: {
pageHead
}
}
</script>
<style>
.page-body image {
width: 600px;
height: 600px;
margin: 0 75px;
}
</style>
examples/hello-uniapp/pages/API/file/file.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/image/image.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/index.vue 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/pages/API/login/login.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/modal/modal.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/navigator/navigator.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/request/request.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/scan-code/scan-code.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/storage/storage.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/toast/toast.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/video/video.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/API/voice/voice.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/audio/audio.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/button/button.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/canvas/canvas.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/component.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/form/form.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/icon/icon.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/image/image.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/input/input.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/label/label.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/map/map.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/picker/picker.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/radio/radio.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/slider/slider.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/swiper/swiper.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/switch/switch.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/text/text.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/video/video.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/component/view/view.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/template/badge/badge.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/template/grid/grid.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/template/popup/popup.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/template/tabbar/tabbar.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/pages/template/template.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/platforms/app-plus/push/push.vue 0 → 100644
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/api.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/apiHL.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c1.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c2.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c3.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c4.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c5.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c6.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c7.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c8.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/c9.png
浏览文件 @ 645e0be7
此差异已折叠。
examples/hello-uniapp/static/cbd.jpg 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/eye-1.png 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/eye-2.png 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/muwu.jpg 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/shake/1.jpg 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/shake/2.jpg 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/shake/3.jpg 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/shake/4.jpg 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/shake/shake.wav 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/shake/shakeup.png 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
examples/hello-uniapp/static/shuijiao.jpg 已删除 100644 → 0
浏览文件 @ 6431887c
此差异已折叠。
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或