diff --git a/entry/src/main/ets/entryability/EntryAbility.ets b/entry/src/main/ets/entryability/EntryAbility.ets
index 8b5988f87636eb98f32ac5ddefb0a4b4be66d47b..5303540869675aeffb9d17d69f3ac4cfb9e622cf 100644
--- a/entry/src/main/ets/entryability/EntryAbility.ets
+++ b/entry/src/main/ets/entryability/EntryAbility.ets
@@ -23,18 +23,22 @@ export default class EntryAbility extends UIAbility {
private curBp: string = '';
private updateBreakpoint(windowWidth: number): void {
- let windowWidthVp = windowWidth / display.getDefaultDisplaySync().densityPixels;
- let newBp: string = '';
- if (windowWidthVp < 600) {
- newBp = 'sm';
- } else if (windowWidthVp < 840) {
- newBp = 'md';
- } else {
- newBp = 'lg';
- }
- if (this.curBp !== newBp) {
- this.curBp = newBp;
- AppStorage.setOrCreate('currentBreakpoint', this.curBp);
+ try {
+ let windowWidthVp = windowWidth / display.getDefaultDisplaySync().densityPixels;
+ let newBp: string = '';
+ if (windowWidthVp < 600) {
+ newBp = 'sm';
+ } else if (windowWidthVp < 840) {
+ newBp = 'md';
+ } else {
+ newBp = 'lg';
+ }
+ if (this.curBp !== newBp) {
+ this.curBp = newBp;
+ AppStorage.setOrCreate('currentBreakpoint', this.curBp);
+ }
+ } catch (error) {
+ hilog.error(0x0000, 'EntryAbility', 'updateBreakpoint catch err:', JSON.stringify(error) ?? '');
}
}
diff --git a/entry/src/main/ets/view/ProductList.ets b/entry/src/main/ets/view/ProductList.ets
index fcccaa058f824f2c2a3bef8cb846651d54446db5..8298aec402808695405cb8f6a162abb01635d392 100644
--- a/entry/src/main/ets/view/ProductList.ets
+++ b/entry/src/main/ets/view/ProductList.ets
@@ -28,58 +28,64 @@ export struct ProductList {
this.productData.pushData(PRODUCT_DATA);
}
+ @Builder
+ waterFlowComponent(item: ProductDataModel) {
+ Column({ space: StackConstant.COLUMN_SPACE }) {
+ Image(item.uri)
+ .width($r('app.integer.icon_view_image_width'))
+ .aspectRatio(1)
+ .objectFit(ImageFit.Contain)
+ .margin({ top: $r('app.integer.water_flow_image_margin_top') })
+ .alignSelf(ItemAlign.Center)
+ .padding({ right: $r('app.integer.icon_view_padding_right') })
+
+ Text(item.title)
+ .width(StackConstant.FULL_PERCENT)
+ .fontSize($r('app.integer.water_flow_title_font_size'))
+ .fontWeight(FontWeight.Bold)
+ .fontColor($r('sys.color.font_primary'))
+
+ Text(item.price)
+ .width(StackConstant.FULL_PERCENT)
+ .fontSize($r('app.integer.water_flow_price_font_size'))
+ .offset({ x: StackConstant.OFFSET })
+ .fontWeight(FontWeight.Bold)
+ .fontColor($r('app.color.ohos_id_color_warning'))
+
+ Text(item.insurance)
+ .fontSize($r('app.integer.water_flow_insurance_font_size'))
+ .fontColor($r('app.color.ohos_id_color_list_alert'))
+ .borderColor($r('app.color.ohos_id_color_list_alert'))
+ .borderWidth($r('app.integer.water_flow_insurance_border_width'))
+ .borderRadius($r('app.integer.water_flow_insurance_border_radius'))
+ .padding({
+ left: $r('app.integer.water_flow_insurance_padding_horizontal'),
+ right: $r('app.integer.water_flow_insurance_padding_horizontal'),
+ top: $r('app.integer.water_flow_insurance_padding_vertical'),
+ bottom: $r('app.integer.water_flow_insurance_padding_vertical')
+ })
+ .margin({ top: $r('app.integer.water_flow_insurance_margin_top') })
+ }
+ .alignItems(HorizontalAlign.Start)
+ .padding({ left: $r('app.integer.water_flow_column_padding_left') })
+ .width(StackConstant.FULL_PERCENT)
+ .height($r('app.integer.water_flow_column_height'))
+ .backgroundColor($r('sys.color.comp_background_primary'))
+ .borderRadius($r('app.integer.water_flow_column_border_radius'))
+ .onClick(() => {
+ promptAction.showToast({ message: $r('app.string.component_stack_other_function') });
+ });
+ }
+
build() {
WaterFlow() {
LazyForEach(this.productData, (item: ProductDataModel) => {
FlowItem() {
- Column({ space: StackConstant.COLUMN_SPACE }) {
- Image(item.uri)
- .width($r('app.integer.icon_view_image_width'))
- .aspectRatio(1)
- .objectFit(ImageFit.Contain)
- .margin({ top: $r('app.integer.water_flow_image_margin_top') })
- .alignSelf(ItemAlign.Center)
- .padding({ right: $r('app.integer.icon_view_padding_right') })
-
- Text(item.title)
- .width(StackConstant.FULL_PERCENT)
- .fontSize($r('app.integer.water_flow_title_font_size'))
- .fontWeight(FontWeight.Bold)
- .fontColor($r('sys.color.font_primary'))
-
- Text(item.price)
- .width(StackConstant.FULL_PERCENT)
- .fontSize($r('app.integer.water_flow_price_font_size'))
- .offset({ x: StackConstant.OFFSET })
- .fontWeight(FontWeight.Bold)
- .fontColor($r('app.color.ohos_id_color_warning'))
-
- Text(item.insurance)
- .fontSize($r('app.integer.water_flow_insurance_font_size'))
- .fontColor($r('app.color.ohos_id_color_list_alert'))
- .borderColor($r('app.color.ohos_id_color_list_alert'))
- .borderWidth($r('app.integer.water_flow_insurance_border_width'))
- .borderRadius($r('app.integer.water_flow_insurance_border_radius'))
- .padding({
- left: $r('app.integer.water_flow_insurance_padding_horizontal'),
- right: $r('app.integer.water_flow_insurance_padding_horizontal'),
- top: $r('app.integer.water_flow_insurance_padding_vertical'),
- bottom: $r('app.integer.water_flow_insurance_padding_vertical')
- })
- .margin({ top: $r('app.integer.water_flow_insurance_margin_top') })
- }
- .alignItems(HorizontalAlign.Start)
- .padding({ left: $r('app.integer.water_flow_column_padding_left') })
- .width(StackConstant.FULL_PERCENT)
- .height($r('app.integer.water_flow_column_height'))
- .backgroundColor($r('sys.color.comp_background_primary'))
- .borderRadius($r('app.integer.water_flow_column_border_radius'))
- .onClick(() => {
- promptAction.showToast({ message: $r('app.string.component_stack_other_function') });
- });
+ this.waterFlowComponent(item)
}
}, (item: ProductDataModel) => item.id.toString())
}
+ .cachedCount(2)
.nestedScroll({
scrollForward: NestedScrollMode.PARENT_FIRST,
scrollBackward: NestedScrollMode.SELF_FIRST
diff --git a/entry/src/main/module.json5 b/entry/src/main/module.json5
index de78b5cae3b2ba99788048311e5d0cd34d075039..b2b33b8607d3688403661c437df3b87ee32d03ab 100644
--- a/entry/src/main/module.json5
+++ b/entry/src/main/module.json5
@@ -21,7 +21,7 @@
"label": "$string:EntryAbility_label",
"startWindowIcon": "$media:startIcon",
"startWindowBackground": "$color:start_window_background",
- "exported": true,
+ "exported": false,
"skills": [
{
"entities": [
diff --git a/entry/src/main/resources/base/element/color.json b/entry/src/main/resources/base/element/color.json
index ba7f463480c7c5aa9dcc2af83088d68fdc5bed86..0fd74c846f9e5b1e69db123e65b4c23da6e2fea8 100644
--- a/entry/src/main/resources/base/element/color.json
+++ b/entry/src/main/resources/base/element/color.json
@@ -4,10 +4,6 @@
"name": "start_window_background",
"value": "#FFFFFF"
},
- {
- "name": "ohos_id_color_sub_background",
- "value": "#F1F3F5"
- },
{
"name": "ohos_id_color_list_alert",
"value": "#ED6F21"
diff --git a/entry/src/main/resources/base/element/integer.json b/entry/src/main/resources/base/element/integer.json
index fe7301b3038f8845398b397f22c3c438c89e6695..5188f52b59c5639fdf44034b26dc5b8a05cf8731 100644
--- a/entry/src/main/resources/base/element/integer.json
+++ b/entry/src/main/resources/base/element/integer.json
@@ -4,26 +4,10 @@
"name": "user_portrait_width",
"value": 30
},
- {
- "name": "user_portrait_border_radius",
- "value": 15
- },
- {
- "name": "scan_width",
- "value": 30
- },
{
"name": "search_font_size",
"value": 16
},
- {
- "name": "flex_padding_left",
- "value": 15
- },
- {
- "name": "flex_padding_right",
- "value": 15
- },
{
"name": "flex_padding_top",
"value": 5
@@ -48,10 +32,6 @@
"name": "search_border_radius",
"value": 12
},
- {
- "name": "search_view_border_radius",
- "value": 16
- },
{
"name": "icon_list_height3",
"value": 110
@@ -60,26 +40,10 @@
"name": "icon_list_height1",
"value": 200
},
- {
- "name": "function_description_margin_top",
- "value": 12
- },
- {
- "name": "stack_padding_top",
- "value": 12
- },
- {
- "name": "function_description_padding",
- "value": 12
- },
{
"name": "margin_search_view",
"value": 50
},
- {
- "name": "scroll_padding",
- "value": 12
- },
{
"name": "icon_view_width",
"value": 40
@@ -88,10 +52,6 @@
"name": "icon_view_width2",
"value": 50
},
- {
- "name": "icon_view_title_font_size",
- "value": 16
- },
{
"name": "icon_view_image_width",
"value": 120
@@ -100,10 +60,6 @@
"name": "icon_view_padding_right",
"value": 20
},
- {
- "name": "icon_view_title_font_size2",
- "value": 18
- },
{
"name": "icon_view_height",
"value": 90
diff --git a/entry/src/main/resources/base/element/string.json b/entry/src/main/resources/base/element/string.json
index 5f68527ca06cf846ff707d5fdc5a812bfa8e0c1c..c36707076e3f98e8cee3335b49c219b41e8197ca 100644
--- a/entry/src/main/resources/base/element/string.json
+++ b/entry/src/main/resources/base/element/string.json
@@ -80,14 +80,6 @@
"name": "search_title",
"value": "好物精选"
},
- {
- "name": "warning_text_title",
- "value": "功能描述"
- },
- {
- "name": "warning_text",
- "value": "本示例介绍运用Stack组件以构建多层次堆叠的视觉效果。通过绑定Scroll组件的onScroll滚动事件回调函数，精准捕获滚动动作的发生。当滚动时，实时地调节组件的透明度、高度等属性，从而成功实现了嵌套滚动效果、透明度动态变化以及平滑的组件切换。"
- },
{
"name": "component_stack_other_function",
"value": "仅演示，可自行实现业务功能"
diff --git a/entry/src/main/resources/base/media/icon.png b/entry/src/main/resources/base/media/icon.png
deleted file mode 100644
index ce307a8827bd75456441ceb57d530e4c8d45d36c..0000000000000000000000000000000000000000
Binary files a/entry/src/main/resources/base/media/icon.png and /dev/null differ
diff --git a/entry/src/main/resources/base/media/search.png b/entry/src/main/resources/base/media/search.png
deleted file mode 100644
index 8bc3b1eec293469c3dcadc6dd5a39649b6de1bea..0000000000000000000000000000000000000000
Binary files a/entry/src/main/resources/base/media/search.png and /dev/null differ
diff --git a/entry/src/main/resources/base/media/stack_scan.svg b/entry/src/main/resources/base/media/stack_scan.svg
deleted file mode 100644
index 0724ed7f1bc511dfdd16a33fe24b503ed0a27d4c..0000000000000000000000000000000000000000
--- a/entry/src/main/resources/base/media/stack_scan.svg
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
\ No newline at end of file
diff --git a/entry/src/main/resources/base/media/user_portrait.svg b/entry/src/main/resources/base/media/user_portrait.svg
deleted file mode 100644
index 0007b2b264c9b78f949a7d98faf3a11e5455ab2f..0000000000000000000000000000000000000000
--- a/entry/src/main/resources/base/media/user_portrait.svg
+++ /dev/null
@@ -1,10 +0,0 @@
-
-
\ No newline at end of file
diff --git a/entry/src/main/resources/en_US/element/string.json b/entry/src/main/resources/en_US/element/string.json
index ebbd7aa5970912cf638c2a01c288fea66dfe9085..a117d4a59ea1ebc19513a9b476ad5c121ecbe820 100644
--- a/entry/src/main/resources/en_US/element/string.json
+++ b/entry/src/main/resources/en_US/element/string.json
@@ -80,14 +80,6 @@
"name": "search_title",
"value": "Good selection"
},
- {
- "name": "warning_text_title",
- "value": "Function description"
- },
- {
- "name": "warning_text",
- "value": "This example shows the visual effect of using the Stack component to build a multi-layered stack. By binding the onScroll Scroll event callback function of Scroll component, the scroll action is accurately captured. When scrolling, the components' transparency, height and other properties are adjusted in real time, thus successfully achieving nested scrolling effects, dynamic changes in transparency and smooth component switching."
- },
{
"name": "component_stack_other_function",
"value": "Demonstration only, can realize the business function by itself"
diff --git a/entry/src/main/resources/zh_CN/element/string.json b/entry/src/main/resources/zh_CN/element/string.json
index 5f68527ca06cf846ff707d5fdc5a812bfa8e0c1c..c36707076e3f98e8cee3335b49c219b41e8197ca 100644
--- a/entry/src/main/resources/zh_CN/element/string.json
+++ b/entry/src/main/resources/zh_CN/element/string.json
@@ -80,14 +80,6 @@
"name": "search_title",
"value": "好物精选"
},
- {
- "name": "warning_text_title",
- "value": "功能描述"
- },
- {
- "name": "warning_text",
- "value": "本示例介绍运用Stack组件以构建多层次堆叠的视觉效果。通过绑定Scroll组件的onScroll滚动事件回调函数，精准捕获滚动动作的发生。当滚动时，实时地调节组件的透明度、高度等属性，从而成功实现了嵌套滚动效果、透明度动态变化以及平滑的组件切换。"
- },
{
"name": "component_stack_other_function",
"value": "仅演示，可自行实现业务功能"