Skip to content

Commit

Permalink
Update quick app demo (#52)
Browse files Browse the repository at this point in the history
* refactor: change demo card path & delete dead code for demo

* fix: update size-factor logic for demo

* chore: update hap.test snapshot
  • Loading branch information
ZhangYingchun-OPPO authored Sep 12, 2023
1 parent 511d1fd commit 790efe1
Show file tree
Hide file tree
Showing 13 changed files with 137 additions and 150 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export default {
.wrapper {
@include flex-box-mixins(column, center, center);
.title {
font-size: 8 * $size-factor;
font-size: 18 * $size-factor;
text-align: center;
color: $black;
}
Expand Down
30 changes: 0 additions & 30 deletions packages/hap-dsl-xvm/templates/app/demo/src/CardDemo/index.ux

This file was deleted.

55 changes: 0 additions & 55 deletions packages/hap-dsl-xvm/templates/app/demo/src/Demo/index.ux

This file was deleted.

34 changes: 0 additions & 34 deletions packages/hap-dsl-xvm/templates/app/demo/src/DemoDetail/index.ux

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ $white: #ffffff;
$black: #000000;
$grey: #9393aa;
$red: #fa0101;
$green: #ffff00;
$yellow: #ffff00;

$size-factor: 5px;
// $size-factor 为 3px,对应的 designWidth 为 1080,长度使用:360的设计稿尺寸数字 * $size-factor
// 如果 designWidth 设置为 360,可修改 $size-factor 为 1px
$size-factor: 3px;
16 changes: 10 additions & 6 deletions packages/hap-dsl-xvm/templates/app/demo/src/manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,8 @@
}],
"template/official": "demo-template",
"config": {
"logLevel": "debug"
"logLevel": "debug",
"designWidth": 1080
},
"router": {
"entry": "pages/Demo",
Expand All @@ -36,14 +37,17 @@
}
},
"widgets": {
"CardDemo": {
"name": "CardDemo",
"widgets/CardDemo": {
"name": "卡片名称4x2",
"description": "快应用卡片展示",
"component": "index",
"path": "/CardDemo",
"path": "/widgets/CardDemo",
"minPlatformVersion": 1032,
"targetManufactorys": [
"vivo"
"params": {
"size": "4x2"
},
"targetManufacturers": [
"vivo", "OPPO", "xiaomi"
],
"features": []
}
Expand Down
12 changes: 6 additions & 6 deletions packages/hap-dsl-xvm/templates/app/demo/src/pages/Demo/index.ux
Original file line number Diff line number Diff line change
Expand Up @@ -54,19 +54,19 @@ export default {
.wrapper {
@include flex-box-mixins(column, center, center);
.title {
font-size: 8 * $size-factor;
font-size: 18 * $size-factor;
text-align: center;
color: $black;
}

.btn {
width: 90 * $size-factor;
height: 16 * $size-factor;
border-radius: 8 * $size-factor;
width: 150 * $size-factor;
height: 42 * $size-factor;
border-radius: 21 * $size-factor;
background-color: $brand;
color: $white;
font-size: 30px;
margin-top: 16 * $size-factor;
font-size: 16 * $size-factor;
margin-top: 20 * $size-factor;
}
}
</style>
Original file line number Diff line number Diff line change
Expand Up @@ -39,24 +39,25 @@ export default {

.wrapper {
@include flex-box-mixins(column, center, center);
margin: 0 10 * $size-factor;
margin: 0 16 * $size-factor;
.title {
font-size: 8 * $size-factor;
font-size: 18 * $size-factor;
text-align: center;
color: $black;
}
.desc {
margin-top: 10 * $size-factor;
margin-top: 18 * $size-factor;
color: $grey;
font-size: 16 * $size-factor;
}
.btn {
width: 90 * $size-factor;
height: 16 * $size-factor;
border-radius: 8 * $size-factor;
width: 150 * $size-factor;
height: 42 * $size-factor;
border-radius: 21 * $size-factor;
background-color: $brand;
color: $white;
font-size: 30px;
margin-top: 16 * $size-factor;
font-size: 16 * $size-factor;
margin-top: 20 * $size-factor;
}
}
</style>
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
$brand: #09ba07;

$white: #ffffff;
$black: #000000;
$grey: #9393aa;
$red: #fa0101;
$yellow: #ffff00;

// $size-factor 为 3px,对应的 designWidth 为 1080,长度使用:360的设计稿尺寸数字 * $size-factor
// 如果 designWidth 设置为 360,可修改 $size-factor 为 1px
$size-factor: 3px;

@mixin flex-box-mixins($direction: row, $justify: center, $align-items: center) {
flex-direction: $direction;
justify-content: $justify;
align-items: $align-items;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
<!--
Copyright (c) 2021-present, the hapjs-platform Project Contributors
SPDX-License-Identifier: Apache-2.0
-->

<!--
注意:快应用和卡片混合工程在编译时会将所有资源打包到一个rpk中,在发布时会将卡片资源拆分出来独立分发,
需要将卡片资源放置到卡片路径下,否则卡片无法加载对应资源。
-->

<template>
<!-- template里只能有一个根节点 -->
<div class="card-wrapper">
<div class="title-wrapper">
<!-- 注意:本地图片资源需要存放到卡片路由路径下,否则发布时无法加载该图片,网络资源不受该限制 -->
<image class="title-logo" src="./assets/logo_card.png"></image>
<text class="title-txt">卡片标题</text>
</div>
<div class="content-wrapper">
<text class="content-txt">{{ des }}</text>
</div>
</div>
</template>

<!-- 注意:卡片运行时不会加载app.ux,请不要在app.ux中添加卡片相关逻辑 -->
<script>
export default {
private: {
text: '欢迎使用快应用卡片',
des:
'卡片是一种轻量级的快应用,快应用卡片使快应用能够在其他app和系统里提供可扩展的app功能'
},
onInit() {
console.log('card onInit >>>>')
},
onShow() {
console.log('card onShow >>>>')
}
}
</script>

<style lang="scss">
@import './assets/styles.scss';

.card-wrapper {
@include flex-box-mixins(column, flex-start, center);
flex: 1;
padding: 16dp;

.content-wrapper {
@include flex-box-mixins(column, center, center);
width: 100%;
flex: 1;

.content-txt {
width: 100%;
text-align: center;
font-size: 14 * $size-factor;
line-height: 20 * $size-factor;
color: $black;
}
}

.title-wrapper {
@include flex-box-mixins(row, flex-start, center);
width: 100%;
height: 16 * $size-factor;

.title-logo {
width: 16 * $size-factor;
height: 16 * $size-factor;
}

.title-txt {
line-height: 16 * $size-factor;
font-size: 16 * $size-factor;
margin-left: 4 * $size-factor;
}
}
}


</style>
1 change: 1 addition & 0 deletions packages/hap-toolkit/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ Thumbs.db
*.iml
.idea/
.vscode/
.history/
node_modules/
!fixtures/deps-app/node_modules/
/lib
Expand Down
14 changes: 6 additions & 8 deletions packages/integration-tests/__snapshots__/hap.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,7 @@ Array [
"src/assets/styles/mixins.scss",
"src/assets/styles/style.scss",
"src/assets/styles/variables.scss",
"src/CardDemo",
"src/CardDemo/index.ux",
"src/Common",
"src/Common/logo.png",
"src/config-phone.json",
"src/Demo",
"src/Demo/index.ux",
"src/DemoDetail",
"src/DemoDetail/index.ux",
"src/global.js",
"src/helper",
"src/helper/ajax.js",
Expand All @@ -46,5 +38,11 @@ Array [
"src/pages/DemoDetail",
"src/pages/DemoDetail/index.ux",
"src/sitemap.json",
"src/widgets",
"src/widgets/CardDemo",
"src/widgets/CardDemo/assets",
"src/widgets/CardDemo/assets/logo_card.png",
"src/widgets/CardDemo/assets/styles.scss",
"src/widgets/CardDemo/index.ux",
]
`;

0 comments on commit 790efe1

Please sign in to comment.