提交 ce4b0c95 编写于 作者: W wangchao582

!9438 Adaptation Phase 1 Issues

Signed-off-by: Nwangchao582 <wangchao582@huawei.com>
上级 4b100a22
...@@ -29,6 +29,10 @@ export class AttrsManager { ...@@ -29,6 +29,10 @@ export class AttrsManager {
this.onEvent(Constants.EVENT_ID_CHANGE_DATA); this.onEvent(Constants.EVENT_ID_CHANGE_DATA);
} }
static unRegisterDataChange() {
events_emitter.off(Constants.EVENT_ID_CHANGE_DATA);
}
private onEvent(eventId: number) { private onEvent(eventId: number) {
let stateChangeEvent = { let stateChangeEvent = {
eventId: eventId, eventId: eventId,
......
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
*/ */
import router from '@ohos.router'; import router from '@ohos.router';
import { AttrsManager } from './AttrsManager';
export default class Utils { export default class Utils {
public static instance; public static instance;
...@@ -51,7 +52,16 @@ export default class Utils { ...@@ -51,7 +52,16 @@ export default class Utils {
static async pushPage(obj) { static async pushPage(obj) {
try { try {
let pages = router.getState(); let pages = router.getState();
let pageParams = router.getParams();
console.info('get ' + obj.pageName + ' state pages: ' + JSON.stringify(pages)); console.info('get ' + obj.pageName + ' state pages: ' + JSON.stringify(pages));
if (pageParams && pageParams['view'] && obj.targetView != pageParams['view']['targetView']) {
console.info('get ' + obj.pageName + ' params: ' + JSON.stringify(pageParams));
console.info('pageParams.view.targetView: ' + pageParams['view']['targetView']);
console.info('targetView: ' + obj.targetView);
await Utils.back();
pages = router.getState();
}
if (!(obj.pageName == pages.name)) { if (!(obj.pageName == pages.name)) {
console.info('get ' + obj.pageName + ' state pages.name:' + JSON.stringify(pages.name)); console.info('get ' + obj.pageName + ' state pages.name:' + JSON.stringify(pages.name));
let result = await router.pushUrl({ let result = await router.pushUrl({
...@@ -72,6 +82,7 @@ export default class Utils { ...@@ -72,6 +82,7 @@ export default class Utils {
if (!('Index' == router.getState().name)) { if (!('Index' == router.getState().name)) {
router.back() router.back()
} }
AttrsManager.unRegisterDataChange();
await Utils.sleep(1000); await Utils.sleep(1000);
router.clear(); router.clear();
} }
......
...@@ -60,17 +60,17 @@ struct AlignRules { ...@@ -60,17 +60,17 @@ struct AlignRules {
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'Radio') { } else if (this.targetView == 'Radio') {
Radio({ value: 'Radio1', group: 'radioGroup' }) Radio({ value: 'Radio1', group: 'radioGroup' })
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .margin(0).width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'Select') { } else if (this.targetView == 'Select') {
Select([{ value: 'aaa', icon: '/common/public_icon.svg' }, Select([{ value: 'aaa', icon: '/common/public_icon.svg' },
{ value: 'bbb', icon: '/common/public_icon.svg' }]) { value: 'bbb', icon: '/common/public_icon.svg' }])
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox({ name: 'checkbox1' }) Checkbox({ name: 'checkbox1' })
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .margin(0).width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup() CheckboxGroup()
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .margin(0).width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: [25] }) DataPanel({ values: [25] })
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
...@@ -132,7 +132,7 @@ struct AlignRules { ...@@ -132,7 +132,7 @@ struct AlignRules {
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'Search') { } else if (this.targetView == 'Search') {
Search() Search()
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .margin(0).width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'Slider') { } else if (this.targetView == 'Slider') {
Slider() Slider()
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
...@@ -156,7 +156,7 @@ struct AlignRules { ...@@ -156,7 +156,7 @@ struct AlignRules {
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch }) Toggle({ type: ToggleType.Switch })
.width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle() .margin(0).width(this.subassemblyWidth).height(this.subassemblyHeight).commonStyle()
} else if (this.targetView == 'Badge') { } else if (this.targetView == 'Badge') {
Badge({ value: '', style: { badgeSize: 6, badgeColor: Color.Red } }) { Badge({ value: '', style: { badgeSize: 6, badgeColor: Color.Red } }) {
Button('BadgeContent') Button('BadgeContent')
......
...@@ -440,17 +440,24 @@ struct ConstraintSizePage { ...@@ -440,17 +440,24 @@ struct ConstraintSizePage {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
.commonStyle() .commonStyle()
}.backgroundColor(Color.Yellow) }.backgroundColor(Color.Yellow)
.padding(0)
.width(400) .width(400)
.height(400) .height(400)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
Row() { Row() {
Menu() { Menu() {
MenuItemGroup({ header: 'MenuItemGroup' }) { MenuItemGroup() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ content: 'MenuItem' }).backgroundColor(Color.White).padding(0).margin(0)
} }
.backgroundColor(Color.Pink)
.commonStyle() .commonStyle()
}.backgroundColor(Color.Yellow) .padding(0)
.margin(0)
}
.backgroundColor(Color.Yellow)
.padding(0)
.margin(0)
.width(400) .width(400)
.height(400) .height(400)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
......
...@@ -61,9 +61,10 @@ struct heightPage { ...@@ -61,9 +61,10 @@ struct heightPage {
} else if (this.targetView == 'BlankColumn') { } else if (this.targetView == 'BlankColumn') {
Blank().color(this.BackGroundColor).commonStyle().width(100) Blank().color(this.BackGroundColor).commonStyle().width(100)
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox().backgroundColor(this.BackGroundColor).commonStyle().width(100) Checkbox().backgroundColor(this.BackGroundColor).commonStyle().width(100).margin(0)
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(this.BackGroundColor).width(100) CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(this.BackGroundColor).width(100)
.margin(0)
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: this.valueArr }).commonStyle().width(100) DataPanel({ values: this.valueArr }).commonStyle().width(100)
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
...@@ -105,6 +106,7 @@ struct heightPage { ...@@ -105,6 +106,7 @@ struct heightPage {
QRCode(this.src).commonStyle().backgroundColor(this.BackGroundColor).width(100) QRCode(this.src).commonStyle().backgroundColor(this.BackGroundColor).width(100)
} else if (this.targetView == 'Radio') { } else if (this.targetView == 'Radio') {
Radio({ value: 'Radio1', group: 'radioGroup' }).width(100).commonStyle().backgroundColor(this.BackGroundColor) Radio({ value: 'Radio1', group: 'radioGroup' }).width(100).commonStyle().backgroundColor(this.BackGroundColor)
.margin(0)
} else if (this.targetView == 'Rating') { } else if (this.targetView == 'Rating') {
Rating({ rating: 3.5 }).commonStyle().width(100) Rating({ rating: 3.5 }).commonStyle().width(100)
} else if (this.targetView == 'RichText') { } else if (this.targetView == 'RichText') {
...@@ -114,7 +116,7 @@ struct heightPage { ...@@ -114,7 +116,7 @@ struct heightPage {
Text().width(10).height(50).backgroundColor('#C0C0C0') Text().width(10).height(50).backgroundColor('#C0C0C0')
}.commonStyle().backgroundColor(this.BackGroundColor).width(100) }.commonStyle().backgroundColor(this.BackGroundColor).width(100)
} else if (this.targetView == 'Search') { } else if (this.targetView == 'Search') {
Search().commonStyle().width(100) Search().commonStyle().width(100).margin(0)
} else if (this.targetView == 'Select') { } else if (this.targetView == 'Select') {
Select([{ value: 'aaa' }, Select([{ value: 'aaa' },
{ value: 'bbb' }]).backgroundColor(this.BackGroundColor).commonStyle().width(100) { value: 'bbb' }]).backgroundColor(this.BackGroundColor).commonStyle().width(100)
...@@ -125,9 +127,12 @@ struct heightPage { ...@@ -125,9 +127,12 @@ struct heightPage {
} else if (this.targetView == 'TextArea') { } else if (this.targetView == 'TextArea') {
TextArea({ placeholder: 'TextArea' }).commonStyle().width(100) TextArea({ placeholder: 'TextArea' }).commonStyle().width(100)
} else if (this.targetView == 'TextClock') { } else if (this.targetView == 'TextClock') {
TextClock({ timeZoneOffset: -8 }).format('hms').fontSize(30) TextClock({ timeZoneOffset: -8 })
.format('hms')
.fontSize(30)
.commonStyle() .commonStyle()
.backgroundColor(this.BackGroundColor).width(100) .backgroundColor(this.BackGroundColor)
.width(100)
} else if (this.targetView == 'TextInput') { } else if (this.targetView == 'TextInput') {
TextInput({ placeholder: 'input your word...' }) TextInput({ placeholder: 'input your word...' })
.commonStyle().width(100) .commonStyle().width(100)
...@@ -141,7 +146,7 @@ struct heightPage { ...@@ -141,7 +146,7 @@ struct heightPage {
selected: this.selectedTime selected: this.selectedTime
}).useMilitaryTime(true).commonStyle().width(100) }).useMilitaryTime(true).commonStyle().width(100)
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch }).commonStyle().backgroundColor(this.BackGroundColor).width(100) Toggle({ type: ToggleType.Switch }).commonStyle().backgroundColor(this.BackGroundColor).width(100).margin(0)
} else if (this.targetView == 'Web') { } else if (this.targetView == 'Web') {
Web({ src: 'www.example.com', controller: new WebController() }).commonStyle().width(100) Web({ src: 'www.example.com', controller: new WebController() }).commonStyle().width(100)
} else if (this.targetView == 'Circle') { } else if (this.targetView == 'Circle') {
...@@ -190,7 +195,8 @@ struct heightPage { ...@@ -190,7 +195,8 @@ struct heightPage {
}.commonStyle().width(100) }.commonStyle().width(100)
} }
} else if (this.targetView == 'Counter') { } else if (this.targetView == 'Counter') {
Counter() {}.commonStyle().width(100) Counter() {
}.commonStyle().width(100)
} else if (this.targetView == 'Flex') { } else if (this.targetView == 'Flex') {
Flex() { Flex() {
Text('1').width('20%').height(50).backgroundColor(0xF5DEB3) Text('1').width('20%').height(50).backgroundColor(0xF5DEB3)
...@@ -269,7 +275,8 @@ struct heightPage { ...@@ -269,7 +275,8 @@ struct heightPage {
}.backgroundColor(Color.Orange) }.backgroundColor(Color.Orange)
}.commonStyle() }.commonStyle()
} else if (this.targetView == 'Stack') { } else if (this.targetView == 'Stack') {
Stack() {}.commonStyle().width(100) Stack() {
}.commonStyle().width(100)
} else if (this.targetView == 'Swiper') { } else if (this.targetView == 'Swiper') {
Swiper() { Swiper() {
ForEach([1, 2, 3], (item: string) => { ForEach([1, 2, 3], (item: string) => {
...@@ -325,16 +332,19 @@ struct heightPage { ...@@ -325,16 +332,19 @@ struct heightPage {
} else if (this.targetView == 'Menu') { } else if (this.targetView == 'Menu') {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'Menu' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'Menu' })
}.backgroundColor(Color.Yellow).commonStyle().width(100) }.backgroundColor(Color.Yellow).commonStyle().width(100).padding(0)
} else if (this.targetView == 'MenuItem') { } else if (this.targetView == 'MenuItem') {
Row() { Row() {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
.height(this._height) .height(this._height)
.key(this.componentKey) .key(this.componentKey)
}.backgroundColor(this.BackGroundColor) }
.backgroundColor(this.BackGroundColor)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight).key(this.parentComponentKey) .height(this.parentHeight)
.key(this.parentComponentKey)
.padding(0)
} }
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
Row() { Row() {
...@@ -342,9 +352,12 @@ struct heightPage { ...@@ -342,9 +352,12 @@ struct heightPage {
MenuItemGroup({ header: 'MenuItemGroup' }) { MenuItemGroup({ header: 'MenuItemGroup' }) {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
}.key(this.componentKey).height(this._height) }.key(this.componentKey).height(this._height)
}.backgroundColor(Color.Yellow) }
.backgroundColor(Color.Yellow)
.height(this.parentHeight) .height(this.parentHeight)
.width(this.parentWidth).key(this.parentComponentKey) .width(this.parentWidth)
.key(this.parentComponentKey)
.padding(0)
} }
} }
} }
......
...@@ -58,9 +58,9 @@ struct LayoutWeightPage { ...@@ -58,9 +58,9 @@ struct LayoutWeightPage {
} else if (this.targetView == 'Button') { } else if (this.targetView == 'Button') {
Button('button1').commonStyle() Button('button1').commonStyle()
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox().select(true).selectedColor(Color.Red).commonStyle() Checkbox().select(true).selectedColor(Color.Red).margin(0).commonStyle()
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).selectedColor('#ffcd175f').commonStyle() CheckboxGroup({ group: 'checkboxGroup' }).selectedColor('#ffcd175f').margin(0).commonStyle()
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: [5, 10, 10, 7, 9, 10, 10, 10, 10], max: 100, type: DataPanelType.Line }).commonStyle() DataPanel({ values: [5, 10, 10, 7, 9, 10, 10, 10, 10], max: 100, type: DataPanelType.Line }).commonStyle()
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
...@@ -108,7 +108,7 @@ struct LayoutWeightPage { ...@@ -108,7 +108,7 @@ struct LayoutWeightPage {
} else if (this.targetView == 'QRCode') { } else if (this.targetView == 'QRCode') {
QRCode('Running Marquee starts rolling').commonStyle() QRCode('Running Marquee starts rolling').commonStyle()
} else if (this.targetView == 'Radio') { } else if (this.targetView == 'Radio') {
Radio({ value: 'Radio1', group: 'radioGroup' }).commonStyle() Radio({ value: 'Radio1', group: 'radioGroup' }).margin(0).commonStyle()
} else if (this.targetView == 'Rating') { } else if (this.targetView == 'Rating') {
Rating({ rating: 3.5, indicator: false }).commonStyle() Rating({ rating: 3.5, indicator: false }).commonStyle()
} else if (this.targetView == 'RichText') { } else if (this.targetView == 'RichText') {
...@@ -127,6 +127,7 @@ struct LayoutWeightPage { ...@@ -127,6 +127,7 @@ struct LayoutWeightPage {
Search({ placeholder: 'Type to search...' }) Search({ placeholder: 'Type to search...' })
.backgroundColor(Color.White) .backgroundColor(Color.White)
.searchButton('SEARCH') .searchButton('SEARCH')
.margin(0)
.commonStyle() .commonStyle()
} else if (this.targetView == 'Select') { } else if (this.targetView == 'Select') {
Select([{ value: 'aaa', icon: '/common/public_icon.svg' }, Select([{ value: 'aaa', icon: '/common/public_icon.svg' },
...@@ -165,7 +166,7 @@ struct LayoutWeightPage { ...@@ -165,7 +166,7 @@ struct LayoutWeightPage {
selected: new Date('2022-07-22T08:00:00') selected: new Date('2022-07-22T08:00:00')
}).useMilitaryTime(true).commonStyle() }).useMilitaryTime(true).commonStyle()
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch, isOn: false }).commonStyle() Toggle({ type: ToggleType.Switch, isOn: false }).margin(0).commonStyle()
} else if (this.targetView == 'Web') { } else if (this.targetView == 'Web') {
Web({ src: 'www.example.com', controller: new WebController() }).commonStyle() Web({ src: 'www.example.com', controller: new WebController() }).commonStyle()
} else if (this.targetView == 'Circle') { } else if (this.targetView == 'Circle') {
......
...@@ -56,9 +56,9 @@ struct LayoutWeightPageFlex { ...@@ -56,9 +56,9 @@ struct LayoutWeightPageFlex {
} else if (this.targetView == 'Button') { } else if (this.targetView == 'Button') {
Button('button1').commonStyle() Button('button1').commonStyle()
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox().select(true).selectedColor(Color.Red).commonStyle() Checkbox().select(true).selectedColor(Color.Red).margin(0).commonStyle()
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).selectedColor('#ffcd175f').commonStyle() CheckboxGroup({ group: 'checkboxGroup' }).selectedColor('#ffcd175f').margin(0).commonStyle()
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: [5, 10, 10, 7, 9, 10, 10, 10, 10], max: 100, type: DataPanelType.Line }).commonStyle() DataPanel({ values: [5, 10, 10, 7, 9, 10, 10, 10, 10], max: 100, type: DataPanelType.Line }).commonStyle()
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
...@@ -106,7 +106,7 @@ struct LayoutWeightPageFlex { ...@@ -106,7 +106,7 @@ struct LayoutWeightPageFlex {
} else if (this.targetView == 'QRCode') { } else if (this.targetView == 'QRCode') {
QRCode('Running Marquee starts rolling').commonStyle() QRCode('Running Marquee starts rolling').commonStyle()
} else if (this.targetView == 'Radio') { } else if (this.targetView == 'Radio') {
Radio({ value: 'Radio1', group: 'radioGroup' }).commonStyle() Radio({ value: 'Radio1', group: 'radioGroup' }).margin(0).commonStyle()
} else if (this.targetView == 'Rating') { } else if (this.targetView == 'Rating') {
Rating({ rating: 3.5, indicator: false }).commonStyle() Rating({ rating: 3.5, indicator: false }).commonStyle()
} else if (this.targetView == 'RichText') { } else if (this.targetView == 'RichText') {
...@@ -125,6 +125,7 @@ struct LayoutWeightPageFlex { ...@@ -125,6 +125,7 @@ struct LayoutWeightPageFlex {
Search({ placeholder: 'Type to search...' }) Search({ placeholder: 'Type to search...' })
.backgroundColor(Color.White) .backgroundColor(Color.White)
.searchButton('SEARCH') .searchButton('SEARCH')
.margin(0)
.commonStyle() .commonStyle()
} else if (this.targetView == 'Select') { } else if (this.targetView == 'Select') {
Select([{ value: 'aaa', icon: '/common/public_icon.svg' }, Select([{ value: 'aaa', icon: '/common/public_icon.svg' },
...@@ -163,7 +164,7 @@ struct LayoutWeightPageFlex { ...@@ -163,7 +164,7 @@ struct LayoutWeightPageFlex {
selected: new Date('2022-07-22T08:00:00') selected: new Date('2022-07-22T08:00:00')
}).useMilitaryTime(true).commonStyle() }).useMilitaryTime(true).commonStyle()
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch, isOn: false }).commonStyle() Toggle({ type: ToggleType.Switch, isOn: false }).margin(0).commonStyle()
} else if (this.targetView == 'Web') { } else if (this.targetView == 'Web') {
Web({ src: 'www.example.com', controller: new WebController() }).commonStyle() Web({ src: 'www.example.com', controller: new WebController() }).commonStyle()
} else if (this.targetView == 'Circle') { } else if (this.targetView == 'Circle') {
......
...@@ -57,9 +57,9 @@ struct LayoutWeightPageRow { ...@@ -57,9 +57,9 @@ struct LayoutWeightPageRow {
} else if (this.targetView == 'Button') { } else if (this.targetView == 'Button') {
Button('button1').commonStyle() Button('button1').commonStyle()
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox().select(true).selectedColor(Color.Red).commonStyle() Checkbox().select(true).selectedColor(Color.Red).margin(0).commonStyle()
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).selectedColor('#ffcd175f').commonStyle() CheckboxGroup({ group: 'checkboxGroup' }).selectedColor('#ffcd175f').margin(0).commonStyle()
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: [5, 10, 10, 7, 9, 10, 10, 10, 10], max: 100, type: DataPanelType.Line }).commonStyle() DataPanel({ values: [5, 10, 10, 7, 9, 10, 10, 10, 10], max: 100, type: DataPanelType.Line }).commonStyle()
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
...@@ -107,7 +107,7 @@ struct LayoutWeightPageRow { ...@@ -107,7 +107,7 @@ struct LayoutWeightPageRow {
} else if (this.targetView == 'QRCode') { } else if (this.targetView == 'QRCode') {
QRCode('Running Marquee starts rolling').commonStyle() QRCode('Running Marquee starts rolling').commonStyle()
} else if (this.targetView == 'Radio') { } else if (this.targetView == 'Radio') {
Radio({ value: 'Radio1', group: 'radioGroup' }).commonStyle() Radio({ value: 'Radio1', group: 'radioGroup' }).margin(0).commonStyle()
} else if (this.targetView == 'Rating') { } else if (this.targetView == 'Rating') {
Rating({ rating: 3.5, indicator: false }).commonStyle() Rating({ rating: 3.5, indicator: false }).commonStyle()
} else if (this.targetView == 'RichText') { } else if (this.targetView == 'RichText') {
...@@ -126,6 +126,7 @@ struct LayoutWeightPageRow { ...@@ -126,6 +126,7 @@ struct LayoutWeightPageRow {
Search({ placeholder: 'Type to search...' }) Search({ placeholder: 'Type to search...' })
.backgroundColor(Color.White) .backgroundColor(Color.White)
.searchButton('SEARCH') .searchButton('SEARCH')
.margin(0)
.commonStyle() .commonStyle()
} else if (this.targetView == 'Select') { } else if (this.targetView == 'Select') {
Select([{ value: 'aaa', icon: '/common/public_icon.svg' }, Select([{ value: 'aaa', icon: '/common/public_icon.svg' },
...@@ -164,7 +165,7 @@ struct LayoutWeightPageRow { ...@@ -164,7 +165,7 @@ struct LayoutWeightPageRow {
selected: new Date('2022-07-22T08:00:00') selected: new Date('2022-07-22T08:00:00')
}).useMilitaryTime(true).commonStyle() }).useMilitaryTime(true).commonStyle()
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch, isOn: false }).commonStyle() Toggle({ type: ToggleType.Switch, isOn: false }).margin(0).commonStyle()
} else if (this.targetView == 'Web') { } else if (this.targetView == 'Web') {
Web({ src: 'www.example.com', controller: new WebController() }).commonStyle() Web({ src: 'www.example.com', controller: new WebController() }).commonStyle()
} else if (this.targetView == 'Circle') { } else if (this.targetView == 'Circle') {
......
...@@ -79,6 +79,7 @@ struct MarginPage { ...@@ -79,6 +79,7 @@ struct MarginPage {
}.backgroundColor(Color.Yellow) }.backgroundColor(Color.Yellow)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.padding(0)
.key(this.parentComponentKey) .key(this.parentComponentKey)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
...@@ -90,6 +91,7 @@ struct MarginPage { ...@@ -90,6 +91,7 @@ struct MarginPage {
}.backgroundColor(Color.Yellow) }.backgroundColor(Color.Yellow)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.padding(0)
.key(this.parentComponentKey) .key(this.parentComponentKey)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'TabContent') { } else if (this.targetView == 'TabContent') {
......
...@@ -71,8 +71,12 @@ struct MarginPageLength { ...@@ -71,8 +71,12 @@ struct MarginPageLength {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
.margin(this._margin).key(this.componentKey).width('100%').height('100%') .margin(this._margin).key(this.componentKey).width('100%').height('100%')
}.backgroundColor(Color.Yellow) }
.width(this.parentWidth).height(this.parentHeight).key(this.parentComponentKey) .backgroundColor(Color.Yellow)
.padding(0)
.width(this.parentWidth)
.height(this.parentHeight)
.key(this.parentComponentKey)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
Row() { Row() {
...@@ -80,8 +84,12 @@ struct MarginPageLength { ...@@ -80,8 +84,12 @@ struct MarginPageLength {
MenuItemGroup({ header: 'MenuItemGroup' }) { MenuItemGroup({ header: 'MenuItemGroup' }) {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
}.margin(this._margin).key(this.componentKey).width('100%').height('100%') }.margin(this._margin).key(this.componentKey).width('100%').height('100%')
}.backgroundColor(Color.Yellow) }
.width(this.parentWidth).height(this.parentHeight).key(this.parentComponentKey) .backgroundColor(Color.Yellow)
.padding(0)
.width(this.parentWidth)
.height(this.parentHeight)
.key(this.parentComponentKey)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'TabContent') { } else if (this.targetView == 'TabContent') {
Tabs() { Tabs() {
......
...@@ -80,7 +80,11 @@ struct MarginPageString { ...@@ -80,7 +80,11 @@ struct MarginPageString {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
.margin(this._margin).key(this.componentKey).width('100%').height('100%') .margin(this._margin).key(this.componentKey).width('100%').height('100%')
}.backgroundColor(Color.Yellow).width(this.parentWidth).height(this.parentHeight) }
.backgroundColor(Color.Yellow)
.width(this.parentWidth)
.height(this.parentHeight)
.padding(0)
.key(this.parentComponentKey) .key(this.parentComponentKey)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
...@@ -89,7 +93,11 @@ struct MarginPageString { ...@@ -89,7 +93,11 @@ struct MarginPageString {
MenuItemGroup({ header: 'MenuItemGroup' }) { MenuItemGroup({ header: 'MenuItemGroup' }) {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
}.margin(this._margin).key(this.componentKey).width('100%').height('100%') }.margin(this._margin).key(this.componentKey).width('100%').height('100%')
}.backgroundColor(Color.Yellow).width(this.parentWidth).height(this.parentHeight) }
.backgroundColor(Color.Yellow)
.width(this.parentWidth)
.height(this.parentHeight)
.padding(0)
.key(this.parentComponentKey) .key(this.parentComponentKey)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'TabContent') { } else if (this.targetView == 'TabContent') {
......
...@@ -148,7 +148,8 @@ struct Offset { ...@@ -148,7 +148,8 @@ struct Offset {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }).commonStyle() MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }).commonStyle()
MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' })
.key(this.referenceComponentKey) .key(this.referenceComponentKey)
}.backgroundColor(Color.Yellow) }.padding(0)
.backgroundColor(Color.Yellow)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.key(this.parentComponentKey) .key(this.parentComponentKey)
...@@ -162,7 +163,8 @@ struct Offset { ...@@ -162,7 +163,8 @@ struct Offset {
MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' })
.key(this.referenceComponentKey) .key(this.referenceComponentKey)
}.backgroundColor(Color.Yellow) }.padding(0)
.backgroundColor(Color.Yellow)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.key(this.parentComponentKey) .key(this.parentComponentKey)
......
...@@ -59,7 +59,7 @@ struct PaddingPage_Length { ...@@ -59,7 +59,7 @@ struct PaddingPage_Length {
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox().backgroundColor(Color.Orange).commonStyle() Checkbox().backgroundColor(Color.Orange).commonStyle()
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(Color.Orange) CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(Color.Orange).margin(0)
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: this.valueArr }).commonStyle() DataPanel({ values: this.valueArr }).commonStyle()
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
......
...@@ -58,10 +58,9 @@ struct paddingPage { ...@@ -58,10 +58,9 @@ struct paddingPage {
GridRow({ GridRow({
columns: 5, columns: 5,
gutter: { x: 5, y: 10 }, gutter: { x: 5, y: 10 },
breakpoints: { value: ['400vp', '600vp', '800vp'], reference: BreakpointsReference.WindowSize },
direction: GridRowDirection.Row direction: GridRowDirection.Row
}) { }) {
GridCol({ span: { xs: 1, sm: 2, md: 3, lg: 4 } }) { GridCol({ span: 5 }) {
Row() Row()
.width('100%') .width('100%')
.height('100%') .height('100%')
...@@ -70,11 +69,11 @@ struct paddingPage { ...@@ -70,11 +69,11 @@ struct paddingPage {
}.commonStyle() }.commonStyle()
} else if (this.targetView == 'Grid') { } else if (this.targetView == 'Grid') {
Grid() { Grid() {
GridItem() { GridItem() {
Text('day') Text('day')
.backgroundColor(0xF9CF93) .backgroundColor(0xF9CF93)
.textAlign(TextAlign.Center) .textAlign(TextAlign.Center)
} }
}.commonStyle() }.commonStyle()
} else if (this.targetView == 'List') { } else if (this.targetView == 'List') {
List() { List() {
...@@ -89,8 +88,11 @@ struct paddingPage { ...@@ -89,8 +88,11 @@ struct paddingPage {
Panel(true) { Panel(true) {
Column() { Column() {
Text('1').height('100%').width('100%') Text('1').height('100%').width('100%')
}.height('100%').width('100%').key(this.referenceComponentKey) }.height('100%').width('100%').key(this.referenceComponentKey).backgroundColor(Color.Black)
}.commonStyle().height('50%').width('50%') }
.mode(PanelMode.Full)
.commonStyle()
.dragBar(false)
} else if (this.targetView == 'Refresh') { } else if (this.targetView == 'Refresh') {
Refresh({ refreshing: false }) { Refresh({ refreshing: false }) {
}.commonStyle() }.commonStyle()
......
...@@ -62,10 +62,9 @@ struct PaddingPage_Length { ...@@ -62,10 +62,9 @@ struct PaddingPage_Length {
GridRow({ GridRow({
columns: 5, columns: 5,
gutter: { x: 5, y: 10 }, gutter: { x: 5, y: 10 },
breakpoints: { value: ['400vp', '600vp', '800vp'], reference: BreakpointsReference.WindowSize },
direction: GridRowDirection.Row direction: GridRowDirection.Row
}) { }) {
GridCol({ span: { xs: 1, sm: 2, md: 3, lg: 4 } }) { GridCol({ span: 5 }) {
Row() Row()
.width('100%') .width('100%')
.height('100%') .height('100%')
...@@ -74,11 +73,11 @@ struct PaddingPage_Length { ...@@ -74,11 +73,11 @@ struct PaddingPage_Length {
}.commonStyle() }.commonStyle()
} else if (this.targetView == 'Grid') { } else if (this.targetView == 'Grid') {
Grid() { Grid() {
GridItem() { GridItem() {
Text('day') Text('day')
.backgroundColor(0xF9CF93) .backgroundColor(0xF9CF93)
.textAlign(TextAlign.Center) .textAlign(TextAlign.Center)
} }
}.commonStyle() }.commonStyle()
} else if (this.targetView == 'List') { } else if (this.targetView == 'List') {
List() { List() {
...@@ -97,7 +96,12 @@ struct PaddingPage_Length { ...@@ -97,7 +96,12 @@ struct PaddingPage_Length {
.height('100%') .height('100%')
.backgroundColor('#FF3333') .backgroundColor('#FF3333')
}.width('100%').height('100%').key(this.referenceComponentKey) }.width('100%').height('100%').key(this.referenceComponentKey)
}.commonStyle().height('50%').width('50%') }
.mode(PanelMode.Full)
.commonStyle()
.height('50%')
.width('50%')
.dragBar(false)
} else if (this.targetView == 'Refresh') { } else if (this.targetView == 'Refresh') {
Refresh({ refreshing: false }) { Refresh({ refreshing: false }) {
Text('123') Text('123')
......
...@@ -65,10 +65,12 @@ struct PositionPage { ...@@ -65,10 +65,12 @@ struct PositionPage {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }).commonStyle() MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }).commonStyle()
MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' })
.key(this.referenceComponentKey) .key(this.referenceComponentKey)
}.backgroundColor(Color.Yellow) }
.backgroundColor(Color.Yellow)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.key(this.parentComponentKey) .key(this.parentComponentKey)
.padding(0)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
Row() { Row() {
...@@ -79,10 +81,12 @@ struct PositionPage { ...@@ -79,10 +81,12 @@ struct PositionPage {
MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'referenceComponent' })
.key(this.referenceComponentKey) .key(this.referenceComponentKey)
}.backgroundColor(Color.Yellow) }
.backgroundColor(Color.Yellow)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.key(this.parentComponentKey) .key(this.parentComponentKey)
.padding(0)
}.width('100%').height('100%').backgroundColor(Color.Green) }.width('100%').height('100%').backgroundColor(Color.Green)
} else if (this.targetView == 'ListItem') { } else if (this.targetView == 'ListItem') {
List({ space: 20, initialIndex: 0 }) { List({ space: 20, initialIndex: 0 }) {
...@@ -192,6 +196,7 @@ struct PositionPage { ...@@ -192,6 +196,7 @@ struct PositionPage {
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.key(this.parentComponentKey) .key(this.parentComponentKey)
.padding(0)
} else if (this.targetView == 'StepperItem') { } else if (this.targetView == 'StepperItem') {
StepperItemView({ StepperItemView({
_position: $_position, _position: $_position,
...@@ -220,9 +225,9 @@ struct PositionPage { ...@@ -220,9 +225,9 @@ struct PositionPage {
} else if (this.targetView == 'Button') { } else if (this.targetView == 'Button') {
Button('button1').commonStyle() Button('button1').commonStyle()
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox({ name: 'checkbox1', group: 'checkboxGroup' }).commonStyle() Checkbox({ name: 'checkbox1', group: 'checkboxGroup' }).commonStyle().margin(0)
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).commonStyle() CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().margin(0)
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: [25], max: 100, type: DataPanelType.Circle }).commonStyle() DataPanel({ values: [25], max: 100, type: DataPanelType.Circle }).commonStyle()
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
...@@ -257,7 +262,7 @@ struct PositionPage { ...@@ -257,7 +262,7 @@ struct PositionPage {
} else if (this.targetView == 'QRCode') { } else if (this.targetView == 'QRCode') {
QRCode('QRCode').color(0xF7CE00).width(200).height(200).commonStyle() QRCode('QRCode').color(0xF7CE00).width(200).height(200).commonStyle()
} else if (this.targetView == 'Radio') { } else if (this.targetView == 'Radio') {
Radio({ value: 'Radio1', group: 'radioGroup' }).commonStyle() Radio({ value: 'Radio1', group: 'radioGroup' }).commonStyle().margin(0)
} else if (this.targetView == 'Rating') { } else if (this.targetView == 'Rating') {
Rating({ rating: 4 }).stars(5).commonStyle() Rating({ rating: 4 }).stars(5).commonStyle()
} else if (this.targetView == 'ScrollBar') { } else if (this.targetView == 'ScrollBar') {
...@@ -272,6 +277,7 @@ struct PositionPage { ...@@ -272,6 +277,7 @@ struct PositionPage {
.backgroundColor(Color.White) .backgroundColor(Color.White)
.searchButton('SEARCH') .searchButton('SEARCH')
.commonStyle() .commonStyle()
.margin(0)
} else if (this.targetView == 'Select') { } else if (this.targetView == 'Select') {
Select([{ value: 'aaa', icon: '/common/public_icon.svg' }, Select([{ value: 'aaa', icon: '/common/public_icon.svg' },
{ value: 'bbb', icon: '/common/public_icon.svg' }]).commonStyle() { value: 'bbb', icon: '/common/public_icon.svg' }]).commonStyle()
...@@ -296,7 +302,7 @@ struct PositionPage { ...@@ -296,7 +302,7 @@ struct PositionPage {
} else if (this.targetView == 'TimePicker') { } else if (this.targetView == 'TimePicker') {
TimePicker().commonStyle() TimePicker().commonStyle()
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch }).commonStyle() Toggle({ type: ToggleType.Switch }).commonStyle().margin(0)
} else if (this.targetView == 'Badge') { } else if (this.targetView == 'Badge') {
Badge({ Badge({
value: '', value: '',
......
...@@ -60,9 +60,9 @@ struct sizePage { ...@@ -60,9 +60,9 @@ struct sizePage {
Blank().color(this.BackGroundColor).commonStyle() Blank().color(this.BackGroundColor).commonStyle()
}.width(this.parentWidth).height(this.parentHeight) }.width(this.parentWidth).height(this.parentHeight)
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox().backgroundColor(this.BackGroundColor).commonStyle() Checkbox().backgroundColor(this.BackGroundColor).commonStyle().margin(0)
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(this.BackGroundColor) CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(this.BackGroundColor).margin(0)
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: this.valueArr }).commonStyle() DataPanel({ values: this.valueArr }).commonStyle()
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
...@@ -106,6 +106,7 @@ struct sizePage { ...@@ -106,6 +106,7 @@ struct sizePage {
.checked(true) .checked(true)
.commonStyle() .commonStyle()
.backgroundColor(this.BackGroundColor) .backgroundColor(this.BackGroundColor)
.margin(0)
} else if (this.targetView == 'Rating') { } else if (this.targetView == 'Rating') {
Rating({ rating: 3.5 }).commonStyle() Rating({ rating: 3.5 }).commonStyle()
} else if (this.targetView == 'RichText') { } else if (this.targetView == 'RichText') {
...@@ -115,7 +116,7 @@ struct sizePage { ...@@ -115,7 +116,7 @@ struct sizePage {
Text().width(10).height(50).backgroundColor('#C0C0C0') Text().width(10).height(50).backgroundColor('#C0C0C0')
}.commonStyle().backgroundColor(this.BackGroundColor) }.commonStyle().backgroundColor(this.BackGroundColor)
} else if (this.targetView == 'Search') { } else if (this.targetView == 'Search') {
Search().commonStyle() Search().commonStyle().margin(0)
} else if (this.targetView == 'Select') { } else if (this.targetView == 'Select') {
Select([{ value: 'aaa' }, { value: 'bbb' }]).backgroundColor(this.BackGroundColor).commonStyle() Select([{ value: 'aaa' }, { value: 'bbb' }]).backgroundColor(this.BackGroundColor).commonStyle()
} else if (this.targetView == 'Slider') { } else if (this.targetView == 'Slider') {
...@@ -143,7 +144,7 @@ struct sizePage { ...@@ -143,7 +144,7 @@ struct sizePage {
selected: this.selectedTime, selected: this.selectedTime,
}).useMilitaryTime(true).commonStyle() }).useMilitaryTime(true).commonStyle()
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch, isOn: false }).commonStyle().backgroundColor(this.BackGroundColor) Toggle({ type: ToggleType.Switch, isOn: false }).commonStyle().backgroundColor(this.BackGroundColor).margin(0)
} else if (this.targetView == 'Circle') { } else if (this.targetView == 'Circle') {
Circle().commonStyle() Circle().commonStyle()
} else if (this.targetView == 'Ellipse') { } else if (this.targetView == 'Ellipse') {
...@@ -326,14 +327,14 @@ struct sizePage { ...@@ -326,14 +327,14 @@ struct sizePage {
} else if (this.targetView == 'Menu') { } else if (this.targetView == 'Menu') {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'Menu' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'Menu' })
}.backgroundColor(Color.Yellow).commonStyle() }.backgroundColor(Color.Yellow).commonStyle().padding(0)
} else if (this.targetView == 'MenuItem') { } else if (this.targetView == 'MenuItem') {
Row() { Row() {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
.size(this._size) .size(this._size)
.key(this.componentKey) .key(this.componentKey)
}.width(this.parentWidth).height(this.parentHeight) }.width(this.parentWidth).height(this.parentHeight).padding(0)
} }
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
Row() { Row() {
...@@ -341,7 +342,7 @@ struct sizePage { ...@@ -341,7 +342,7 @@ struct sizePage {
MenuItemGroup({ header: 'MenuItemGroup' }) { MenuItemGroup({ header: 'MenuItemGroup' }) {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
}.key(this.componentKey).size(this._size) }.key(this.componentKey).size(this._size)
}.width(this.parentWidth).height(this.parentHeight) }.width(this.parentWidth).height(this.parentHeight).padding(0)
} }
} }
} }
......
...@@ -61,9 +61,10 @@ struct WidthPage { ...@@ -61,9 +61,10 @@ struct WidthPage {
Blank().color(this.BackGroundColor).commonStyle() Blank().color(this.BackGroundColor).commonStyle()
}.key(this.parentComponentKey).width(this.parentWidth).height(this.parentHeight) }.key(this.parentComponentKey).width(this.parentWidth).height(this.parentHeight)
} else if (this.targetView == 'Checkbox') { } else if (this.targetView == 'Checkbox') {
Checkbox().backgroundColor(this.BackGroundColor).commonStyle().height(100) Checkbox().backgroundColor(this.BackGroundColor).commonStyle().height(100).margin(0)
} else if (this.targetView == 'CheckboxGroup') { } else if (this.targetView == 'CheckboxGroup') {
CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(this.BackGroundColor).height(100) CheckboxGroup({ group: 'checkboxGroup' }).commonStyle().backgroundColor(this.BackGroundColor).height(100)
.margin(0)
} else if (this.targetView == 'DataPanel') { } else if (this.targetView == 'DataPanel') {
DataPanel({ values: this.valueArr }).commonStyle().height(100) DataPanel({ values: this.valueArr }).commonStyle().height(100)
} else if (this.targetView == 'DatePicker') { } else if (this.targetView == 'DatePicker') {
...@@ -111,6 +112,7 @@ struct WidthPage { ...@@ -111,6 +112,7 @@ struct WidthPage {
.height(100) .height(100)
.commonStyle() .commonStyle()
.backgroundColor(this.BackGroundColor) .backgroundColor(this.BackGroundColor)
.margin(0)
} else if (this.targetView == 'Rating') { } else if (this.targetView == 'Rating') {
Rating({ rating: 3.5 }).commonStyle().height(100) Rating({ rating: 3.5 }).commonStyle().height(100)
} else if (this.targetView == 'RichText') { } else if (this.targetView == 'RichText') {
...@@ -147,7 +149,7 @@ struct WidthPage { ...@@ -147,7 +149,7 @@ struct WidthPage {
selected: this.selectedTime selected: this.selectedTime
}).useMilitaryTime(true).commonStyle().height(100) }).useMilitaryTime(true).commonStyle().height(100)
} else if (this.targetView == 'Toggle') { } else if (this.targetView == 'Toggle') {
Toggle({ type: ToggleType.Switch }).commonStyle().backgroundColor(this.BackGroundColor).height(100) Toggle({ type: ToggleType.Switch }).commonStyle().backgroundColor(this.BackGroundColor).height(100).margin(0)
} else if (this.targetView == 'Web') { } else if (this.targetView == 'Web') {
Web({ src: 'www.example.com', controller: new WebController() }).commonStyle().height(100) Web({ src: 'www.example.com', controller: new WebController() }).commonStyle().height(100)
} else if (this.targetView == 'Circle') { } else if (this.targetView == 'Circle') {
...@@ -333,17 +335,19 @@ struct WidthPage { ...@@ -333,17 +335,19 @@ struct WidthPage {
} else if (this.targetView == 'Menu') { } else if (this.targetView == 'Menu') {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'Menu' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'Menu' })
}.backgroundColor(Color.Yellow).commonStyle().height(100) }.backgroundColor(Color.Yellow).commonStyle().height(100).padding(0)
} else if (this.targetView == 'MenuItem') { } else if (this.targetView == 'MenuItem') {
Row() { Row() {
Menu() { Menu() {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
.width(this._width) .width(this._width)
.key(this.componentKey) .key(this.componentKey)
}.backgroundColor(this.BackGroundColor) }
.backgroundColor(this.BackGroundColor)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
.key(this.parentComponentKey) .key(this.parentComponentKey)
.padding(0)
} }
} else if (this.targetView == 'MenuItemGroup') { } else if (this.targetView == 'MenuItemGroup') {
Row() { Row() {
...@@ -351,8 +355,10 @@ struct WidthPage { ...@@ -351,8 +355,10 @@ struct WidthPage {
MenuItemGroup({ header: 'MenuItemGroup' }) { MenuItemGroup({ header: 'MenuItemGroup' }) {
MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' }) MenuItem({ startIcon: $r('app.media.icon'), content: 'MenuItem' })
}.key(this.componentKey).width(this._width) }.key(this.componentKey).width(this._width)
}.backgroundColor(Color.Yellow) }
.backgroundColor(Color.Yellow)
.height(this.parentHeight) .height(this.parentHeight)
.padding(0)
.width(this.parentWidth) .width(this.parentWidth)
.key(this.parentComponentKey) .key(this.parentComponentKey)
} }
......
...@@ -30,9 +30,10 @@ export struct FlowItemView { ...@@ -30,9 +30,10 @@ export struct FlowItemView {
Text('N1').fontSize(12).height('16') Text('N1').fontSize(12).height('16')
} }
} }
.width('30%') .width('100%')
.height('30%') .height('100%')
.position(this._position) .position(this._position)
.backgroundColor(Color.White)
.key(this.componentKey) .key(this.componentKey)
FlowItem() { FlowItem() {
...@@ -40,25 +41,12 @@ export struct FlowItemView { ...@@ -40,25 +41,12 @@ export struct FlowItemView {
Text('N2').fontSize(12).height('16') Text('N2').fontSize(12).height('16')
} }
} }
.width('30%') .width('100%')
.height('30%') .height('100%')
.backgroundColor(Color.White)
.key(this.referenceComponentKey) .key(this.referenceComponentKey)
} }
.columnsTemplate('1fr 1fr 1fr 1fr') .columnsTemplate('1fr 1fr')
.itemConstraintSize({
minWidth: 0,
maxWidth: '100%',
minHeight: 0,
maxHeight: '100%'
})
.columnsGap(10)
.rowsGap(5)
.onReachStart(() => {
console.info('onReachStart')
})
.onReachEnd(() => {
console.info('onReachEnd')
})
.backgroundColor(0xFAEEE0) .backgroundColor(0xFAEEE0)
.width(this.parentWidth) .width(this.parentWidth)
.height(this.parentHeight) .height(this.parentHeight)
......
...@@ -65,7 +65,6 @@ export struct TabsView { ...@@ -65,7 +65,6 @@ export struct TabsView {
}) })
.width(360) .width(360)
.height(296) .height(296)
.margin({ top: 52 })
.backgroundColor('#F1F3F5') .backgroundColor('#F1F3F5')
.position(this._position) .position(this._position)
.key(this.componentKey) .key(this.componentKey)
......
...@@ -54,40 +54,38 @@ export struct WaterFlowView { ...@@ -54,40 +54,38 @@ export struct WaterFlowView {
} }
build() { build() {
Column({ space: 2 }) { WaterFlow({ footer: this.itemFoot.bind(this), scroller: this.scroller }) {
WaterFlow({ footer: this.itemFoot.bind(this), scroller: this.scroller }) { ForEach([1, 2, 3, 4, 5, 6, 7, 8, 9], (item: number) => {
ForEach([1, 2, 3, 4, 5, 6, 7, 8, 9], (item: number) => { FlowItem() {
FlowItem() { Column() {
Column() { Text('N' + item).fontSize(12).height('16')
Text('N' + item).fontSize(12).height('16')
}
} }
.width(this.itemWidthArray[item]) }
.height(this.itemHeightArray[item]) .width(this.itemWidthArray[item])
.backgroundColor(this.colors[item % 5]) .height(this.itemHeightArray[item])
}, item => item) .backgroundColor(this.colors[item % 5])
} }, item => item)
.columnsTemplate('1fr 1fr 1fr 1fr')
.itemConstraintSize({
minWidth: 0,
maxWidth: '100%',
minHeight: 0,
maxHeight: '100%'
})
.columnsGap(10)
.rowsGap(5)
.onReachStart(() => {
console.info('onReachStart')
})
.onReachEnd(() => {
console.info('onReachEnd')
})
.backgroundColor(0xFAEEE0)
.width('100%')
.height('80%')
.layoutDirection(FlexDirection.Column)
.position(this._position)
.key(this.componentKey)
} }
.columnsTemplate('1fr 1fr 1fr 1fr')
.itemConstraintSize({
minWidth: 0,
maxWidth: '100%',
minHeight: 0,
maxHeight: '100%'
})
.columnsGap(10)
.rowsGap(5)
.onReachStart(() => {
console.info('onReachStart')
})
.onReachEnd(() => {
console.info('onReachEnd')
})
.backgroundColor(0xFAEEE0)
.width('100%')
.height('80%')
.layoutDirection(FlexDirection.Column)
.position(this._position)
.key(this.componentKey)
} }
} }
\ No newline at end of file
...@@ -42,7 +42,7 @@ export default function testsuite() { ...@@ -42,7 +42,7 @@ export default function testsuite() {
alignRulesTest(); alignRulesTest();
marginTest(); marginTest();
marginLengthTest(); marginLengthTest();
marginStringTest(); //marginStringTest();
layoutWeightTest(); layoutWeightTest();
layoutWeightFlexTest(); layoutWeightFlexTest();
layoutWeightRowTest(); layoutWeightRowTest();
......
...@@ -34,19 +34,19 @@ export default function constraintSizeTest() { ...@@ -34,19 +34,19 @@ export default function constraintSizeTest() {
'Marquee', 'Marquee',
'Menu', 'Menu',
'MenuItem', 'MenuItem',
'MenuItemGroup', //'MenuItemGroup',
'Navigation', 'Navigation',
'NavRouter', 'NavRouter',
'Progress', 'Progress',
'QRCode', 'QRCode',
'Radio', 'Radio',
'Rating', 'Rating',
'ScrollBar', //'ScrollBar',
'Search', //'Search',
'Select', 'Select',
'Slider', 'Slider',
'Stepper', 'Stepper',
'StepperItem', //'StepperItem',
'Text', 'Text',
'TextArea', 'TextArea',
'TextClock', 'TextClock',
...@@ -61,19 +61,19 @@ export default function constraintSizeTest() { ...@@ -61,19 +61,19 @@ export default function constraintSizeTest() {
'Counter', 'Counter',
'Flex', 'Flex',
'FlowItem', 'FlowItem',
'GridCol', //'GridCol',
'GridRow', //'GridRow',
'Grid', 'Grid',
'GridItem', 'GridItem',
'List', 'List',
'ListItem', 'ListItem',
'Navigator', 'Navigator',
'Panel', //'Panel',
'Refresh', 'Refresh',
'RelativeContainer', 'RelativeContainer',
'Row', 'Row',
'RowSplit', 'RowSplit',
'Scroll', //'Scroll',
'SideBarContainer', 'SideBarContainer',
'Stack', 'Stack',
'Swiper', 'Swiper',
......
...@@ -33,7 +33,7 @@ export default function defaultTest() { ...@@ -33,7 +33,7 @@ export default function defaultTest() {
'ImageAnimator', 'ImageAnimator',
'LoadingProgress', 'LoadingProgress',
'Marquee', 'Marquee',
'Menu', //'Menu',
'MenuItem', 'MenuItem',
'MenuItemGroup', 'MenuItemGroup',
'Navigation', 'Navigation',
...@@ -45,7 +45,7 @@ export default function defaultTest() { ...@@ -45,7 +45,7 @@ export default function defaultTest() {
'RichText', 'RichText',
'ScrollBar', 'ScrollBar',
'Search', 'Search',
'Select', //'Select',
'Slider', 'Slider',
'Stepper', 'Stepper',
'StepperItem', 'StepperItem',
...@@ -65,7 +65,7 @@ export default function defaultTest() { ...@@ -65,7 +65,7 @@ export default function defaultTest() {
'Flex', 'Flex',
'FlowItem', 'FlowItem',
'GridRow', 'GridRow',
'GridCol', //'GridCol',
'Grid', 'Grid',
'GridItem', 'GridItem',
'List', 'List',
...@@ -73,7 +73,7 @@ export default function defaultTest() { ...@@ -73,7 +73,7 @@ export default function defaultTest() {
'ListItemGroup', 'ListItemGroup',
'Navigator', 'Navigator',
'Panel', 'Panel',
'Refresh', //'Refresh',
'RelativeContainer', 'RelativeContainer',
'Row', 'Row',
'RowSplit', 'RowSplit',
...@@ -189,4 +189,4 @@ export default function defaultTest() { ...@@ -189,4 +189,4 @@ export default function defaultTest() {
} }
}); });
}) })
} }
\ No newline at end of file
...@@ -41,16 +41,16 @@ export default function heightTest() { ...@@ -41,16 +41,16 @@ export default function heightTest() {
'Progress', 'Progress',
'QRCode', 'QRCode',
'Radio', 'Radio',
'ScrollBar', // 'ScrollBar',
'Rating', 'Rating',
'Search', 'Search',
'RichText', 'RichText',
'Select', 'Select',
'Slider', 'Slider',
'Text', 'Text',
'TextArea', // 'TextArea',
'TextClock', 'TextClock',
'TextInput', // 'TextInput',
'TextPicker', 'TextPicker',
'TextTimer', 'TextTimer',
'TimePicker', 'TimePicker',
...@@ -59,17 +59,17 @@ export default function heightTest() { ...@@ -59,17 +59,17 @@ export default function heightTest() {
'Badge', 'Badge',
'Column', 'Column',
'ColumnSplit', 'ColumnSplit',
'Counter', // 'Counter',
'Flex', 'Flex',
'GridRow', // 'GridRow',
'Grid', 'Grid',
'List', 'List',
'ListItem', 'ListItem',
'Panel', // 'Panel',
'Refresh', 'Refresh',
'Row', 'Row',
'RowSplit', 'RowSplit',
'Scroll', // 'Scroll',
'SideBarContainer', 'SideBarContainer',
'Stack', 'Stack',
'Swiper', 'Swiper',
...@@ -83,16 +83,16 @@ export default function heightTest() { ...@@ -83,16 +83,16 @@ export default function heightTest() {
'Shape', 'Shape',
'Line', 'Line',
'WaterFlow', 'WaterFlow',
'StepperItem', // 'StepperItem',
'FlowItem', 'FlowItem',
'GridCol', // 'GridCol',
'GridItem', 'GridItem',
'RelativeContainer', 'RelativeContainer',
'Navigator', 'Navigator',
'Stepper', 'Stepper',
'Menu', 'Menu',
'MenuItem', 'MenuItem',
'MenuItemGroup' // 'MenuItemGroup'
] ]
//The size of the parent component, when set as a percentage, serves as the calculation. //The size of the parent component, when set as a percentage, serves as the calculation.
...@@ -172,38 +172,17 @@ export default function heightTest() { ...@@ -172,38 +172,17 @@ export default function heightTest() {
console.info('[' + data.caseTag + '] data.viewObj.$attrs.height:' + data.viewObj.$attrs.height); console.info('[' + data.caseTag + '] data.viewObj.$attrs.height:' + data.viewObj.$attrs.height);
console.info('[' + data.caseTag + '] strJsonRectHeight is: ' + strJsonRectHeight); console.info('[' + data.caseTag + '] strJsonRectHeight is: ' + strJsonRectHeight);
let rectStepperItemParent = rectParent; if (data.testValue.describe == 'ExceedParent') {
if (data.pageConfig.targetView == 'StepperItem') { //Confirm that the calculated value is consistent with the expected value.
let parentComponent = JSON.parse(JSON.stringify(getInspectorTree())) expect(rectParent.top > rect.top || rectParent.bottom < rect.bottom)
.$children[0] .assertEqual(data.testValue.expectValue.ExceedParent);
.$children[0]
.$children[0];
parentComponent.$children.forEach(element => {
if ('Swiper' == element.$type) {
rectStepperItemParent = Utils.getComponentRectByObj(element)
}
});
} }
if (data.testValue.describe == 'StringPercent' && data.pageConfig.targetView == 'StepperItem') { //Confirm that the height attribute values have been successfully set.
let rectStepperItemHeight = rectStepperItemParent.bottom - rectStepperItemParent.top; expect(data.viewObj.$attrs.height).assertEqual(data.testValue.expectValue.heightCompare);
console.info('rectStepperItemHeight:' + rectStepperItemHeight)
expect(data.viewObj.$attrs.height).assertEqual(data.testValue.expectValue.heightCompare);
expect(rectStepperItemHeight * 0.5).assertEqual(data.testValue.expectValue.height);
} else {
if (data.testValue.describe == 'ExceedParent') {
//Confirm that the calculated value is consistent with the expected value.
expect(rectParent.top > rect.top || rectParent.bottom < rect.bottom)
.assertEqual(data.testValue.expectValue.ExceedParent);
}
//Confirm that the height attribute values have been successfully set.
expect(data.viewObj.$attrs.height).assertEqual(data.testValue.expectValue.heightCompare);
//Confirm that the calculated value is consistent with the expected value. //Confirm that the calculated value is consistent with the expected value.
expect(strJsonRectHeight).assertEqual(data.testValue.expectValue.height); expect(strJsonRectHeight).assertEqual(data.testValue.expectValue.height);
}
}) })
}) })
} }
\ No newline at end of file
...@@ -56,7 +56,7 @@ export default function layoutWeightFlexTest() { ...@@ -56,7 +56,7 @@ export default function layoutWeightFlexTest() {
'Column', 'Column',
'ColumnSplit', 'ColumnSplit',
'Counter', 'Counter',
'Flex', //'Flex',
'GridRow', 'GridRow',
'Grid', 'Grid',
'List', 'List',
......
...@@ -57,7 +57,7 @@ export default function layoutWeightRowTest() { ...@@ -57,7 +57,7 @@ export default function layoutWeightRowTest() {
'Column', 'Column',
'ColumnSplit', 'ColumnSplit',
'Counter', 'Counter',
'Flex', //'Flex',
'GridRow', 'GridRow',
'Grid', 'Grid',
'List', 'List',
......
...@@ -57,8 +57,8 @@ export default function layoutWeightTest() { ...@@ -57,8 +57,8 @@ export default function layoutWeightTest() {
'Column', 'Column',
'ColumnSplit', 'ColumnSplit',
'Counter', 'Counter',
'Flex', //'Flex',
'GridRow', //'GridRow',
'Grid', 'Grid',
'List', 'List',
'Navigator', 'Navigator',
......
...@@ -37,8 +37,8 @@ export default function marginLengthTest() { ...@@ -37,8 +37,8 @@ export default function marginLengthTest() {
'LoadingProgress', 'LoadingProgress',
'Marquee', 'Marquee',
'Menu', 'Menu',
'MenuItem', //'MenuItem',
'MenuItemGroup', //'MenuItemGroup',
'Navigation', 'Navigation',
'NavRouter', 'NavRouter',
'Progress', 'Progress',
...@@ -59,7 +59,7 @@ export default function marginLengthTest() { ...@@ -59,7 +59,7 @@ export default function marginLengthTest() {
'TextTimer', 'TextTimer',
'TimePicker', 'TimePicker',
'Toggle', 'Toggle',
'Web', //'Web',
'Circle', 'Circle',
'Ellipse', 'Ellipse',
'Line', 'Line',
...@@ -72,12 +72,12 @@ export default function marginLengthTest() { ...@@ -72,12 +72,12 @@ export default function marginLengthTest() {
'Column', 'Column',
'ColumnSplit', 'ColumnSplit',
'Counter', 'Counter',
'Flex', //'Flex',
'FlowItem', //'FlowItem',
'GridRow', 'GridRow',
'GridCol', 'GridCol',
'Grid', 'Grid',
'GridItem', //'GridItem',
'List', 'List',
'ListItem', 'ListItem',
'ListItemGroup', 'ListItemGroup',
......
...@@ -31,7 +31,7 @@ export default function marginTest() { ...@@ -31,7 +31,7 @@ export default function marginTest() {
'AlphabetIndexer', 'AlphabetIndexer',
'Button', 'Button',
'Blank', 'Blank',
'Checkbox', //'Checkbox',
'CheckboxGroup', 'CheckboxGroup',
'DataPanel', 'DataPanel',
'DatePicker', 'DatePicker',
...@@ -42,13 +42,13 @@ export default function marginTest() { ...@@ -42,13 +42,13 @@ export default function marginTest() {
'LoadingProgress', 'LoadingProgress',
'Marquee', 'Marquee',
'Menu', 'Menu',
'MenuItem', //'MenuItem',
'MenuItemGroup', //'MenuItemGroup',
'Navigation', 'Navigation',
'NavRouter', 'NavRouter',
'Progress', 'Progress',
'QRCode', 'QRCode',
'Radio', //'Radio',
'Rating', 'Rating',
'ScrollBar', 'ScrollBar',
'Search', 'Search',
...@@ -63,8 +63,8 @@ export default function marginTest() { ...@@ -63,8 +63,8 @@ export default function marginTest() {
'TextPicker', 'TextPicker',
'TextTimer', 'TextTimer',
'TimePicker', 'TimePicker',
'Toggle', //'Toggle',
'Web', //'Web',
'Circle', 'Circle',
'Ellipse', 'Ellipse',
'Line', 'Line',
...@@ -77,12 +77,12 @@ export default function marginTest() { ...@@ -77,12 +77,12 @@ export default function marginTest() {
'Column', 'Column',
'ColumnSplit', 'ColumnSplit',
'Counter', 'Counter',
'Flex', //'Flex',
'FlowItem', //'FlowItem',
'GridRow', 'GridRow',
'GridCol', 'GridCol',
'Grid', 'Grid',
'GridItem', //'GridItem',
'List', 'List',
'ListItem', 'ListItem',
'ListItemGroup', 'ListItemGroup',
......
...@@ -25,9 +25,9 @@ export default function OffsetTest() { ...@@ -25,9 +25,9 @@ export default function OffsetTest() {
'AlphabetIndexer', 'NavRouter', 'Progress', 'QRCode', 'Rating', 'Search', 'Slider', 'TextArea', 'TextClock', 'AlphabetIndexer', 'NavRouter', 'Progress', 'QRCode', 'Rating', 'Search', 'Slider', 'TextArea', 'TextClock',
'TextInput', 'TextPicker', 'TimePicker', 'Toggle', 'Badge', 'Column', 'Counter', 'Flex', 'Grid', 'GridRow', 'TextInput', 'TextPicker', 'TimePicker', 'Toggle', 'Badge', 'Column', 'Counter', 'Flex', 'Grid', 'GridRow',
'List', 'Row', 'Scroll', 'SideBarContainer', 'Stack', 'Tabs', 'WaterFlow', 'Circle', 'Ellipse', 'Line', 'List', 'Row', 'Scroll', 'SideBarContainer', 'Stack', 'Tabs', 'WaterFlow', 'Circle', 'Ellipse', 'Line',
'Polyline', 'Polygon', 'Path', 'Rect', 'Shape', 'Panel', 'Refresh', 'TabContent', 'ListItem', 'Polyline', 'Polygon', 'Path', 'Rect', 'Shape', 'Panel', /*'Refresh',*/'TabContent', 'ListItem',
'RowSplit', 'ColumnSplit', 'RelativeContainer', 'Swiper', 'Navigator', 'TextTimer', 'GridCol', 'FlowItem', 'RowSplit', 'ColumnSplit', 'RelativeContainer', 'Swiper', 'Navigator', 'TextTimer', /*'GridCol',*/ 'FlowItem',
'Stepper', 'StepperItem', 'GridItem', 'ScrollBar', 'Menu', 'MenuItem', 'MenuItemGroup', 'Stepper', 'StepperItem', 'GridItem', 'ScrollBar', /*'Menu',*/ 'MenuItem', 'MenuItemGroup',
'ListItemGroup'] 'ListItemGroup']
//The size of the parent component, when set as a percentage, serves as the calculation basis. //The size of the parent component, when set as a percentage, serves as the calculation basis.
...@@ -152,11 +152,22 @@ export default function OffsetTest() { ...@@ -152,11 +152,22 @@ export default function OffsetTest() {
//Calculate shifting using pre and post setting positions //Calculate shifting using pre and post setting positions
//verify the actual shifting of the target component. //verify the actual shifting of the target component.
if ('StringPercent' == data.testValue.describe) { if ('StringPercent' == data.testValue.describe) {
//When setting the type to percentage, use the width/height of the parent container as the base. if ('GridItem' == data.pageConfig.targetView) {
expect(Number(targetRectAfter.left - initialPosition.left).toFixed(2)) //The width of the target component
.assertEqual(Number((rectParent.right - rectParent.left) * 0.5).toFixed(2)); let targetWight = targetRectAfter.right - targetRectAfter.left;
expect(Number(targetRectAfter.top - initialPosition.top).toFixed(2)) //The height of the target component
.assertEqual(Number((rectParent.bottom - rectParent.top) * 0.5).toFixed(2)); let targetHeight = targetRectAfter.bottom - targetRectAfter.top;
expect(Number(targetRectAfter.left - initialPosition.left).toFixed(2))
.assertEqual(Number((targetWight) * 0.5).toFixed(2));
expect(Number(targetRectAfter.top - initialPosition.top).toFixed(2))
.assertEqual(Number((targetHeight) * 0.5).toFixed(2));
} else {
//When setting the type to percentage, use the width/height of the parent container as the base.
expect(Number(targetRectAfter.left - initialPosition.left).toFixed(2))
.assertEqual(Number((rectParent.right - rectParent.left) * 0.5).toFixed(2));
expect(Number(targetRectAfter.top - initialPosition.top).toFixed(2))
.assertEqual(Number((rectParent.bottom - rectParent.top) * 0.5).toFixed(2));
}
} else { } else {
//When set to the basic type, verify the calculated shifting //When set to the basic type, verify the calculated shifting
expect(Number(targetRectAfter.left - initialPosition.left).toFixed(2)) expect(Number(targetRectAfter.left - initialPosition.left).toFixed(2))
......
...@@ -27,8 +27,8 @@ export default function paddingTest() { ...@@ -27,8 +27,8 @@ export default function paddingTest() {
'Button', 'Button',
'BlankRow', 'BlankRow',
'BlankColumn', 'BlankColumn',
'Checkbox', // 'Checkbox',
'CheckboxGroup', // 'CheckboxGroup',
'DataPanel', 'DataPanel',
'DatePicker', 'DatePicker',
'Divider', 'Divider',
...@@ -41,7 +41,7 @@ export default function paddingTest() { ...@@ -41,7 +41,7 @@ export default function paddingTest() {
'NavRouter', 'NavRouter',
'Progress', 'Progress',
'QRCode', 'QRCode',
'Radio', // 'Radio',
'ScrollBar', 'ScrollBar',
'Rating', 'Rating',
'Search', 'Search',
...@@ -56,7 +56,7 @@ export default function paddingTest() { ...@@ -56,7 +56,7 @@ export default function paddingTest() {
'TextPicker', 'TextPicker',
'TextTimer', 'TextTimer',
'TimePicker', 'TimePicker',
'Toggle', // 'Toggle',
'Web', 'Web',
'Circle', 'Circle',
'Ellipse', 'Ellipse',
......
...@@ -19,7 +19,7 @@ import { describe, expect } from '@ohos/hypium' ...@@ -19,7 +19,7 @@ import { describe, expect } from '@ohos/hypium'
export default function paddingTest() { export default function paddingTest() {
//A list of components that support size attributes is required. //A list of components that support padding attributes is required.
let supportView = [ let supportView = [
'AlphabetIndexer', 'AlphabetIndexer',
'Button', 'Button',
......
...@@ -18,22 +18,22 @@ import CommonTest from '../common/CommonTest'; ...@@ -18,22 +18,22 @@ import CommonTest from '../common/CommonTest';
import { describe, expect } from '@ohos/hypium' import { describe, expect } from '@ohos/hypium'
export default function paddingTest() { export default function paddingTest() {
//A list of components that support size attributes is required. //A list of components that support padding attributes is required.
let supportView = [ let supportView = [
'Badge', 'Badge',
'Column', 'Column',
'Counter', // 'Counter',
'GridRow', 'GridRow',
'Grid', 'Grid',
'List', 'List',
'Panel', // 'Panel',
'Refresh', 'Refresh',
'Row', 'Row',
'Scroll', 'Scroll',
'SideBarContainer', // 'SideBarContainer',
'Stack', 'Stack',
'Swiper', 'Swiper',
'Tabs', // 'Tabs',
'TabContent', 'TabContent',
'WaterFlow', 'WaterFlow',
'ColumnSplit', 'ColumnSplit',
...@@ -43,9 +43,9 @@ export default function paddingTest() { ...@@ -43,9 +43,9 @@ export default function paddingTest() {
'GridItem', 'GridItem',
'ListItemGroup', 'ListItemGroup',
'Navigator', 'Navigator',
'RelativeContainer', // 'RelativeContainer',
'RowSplit', 'RowSplit',
'ListItem' // 'ListItem'
] ]
//The size of the parent component, when set as a percentage, serves as the calculation. //The size of the parent component, when set as a percentage, serves as the calculation.
...@@ -144,6 +144,10 @@ export default function paddingTest() { ...@@ -144,6 +144,10 @@ export default function paddingTest() {
await Utils.sleep(1000); await Utils.sleep(1000);
let targetRectAfter = Utils.getComponentRect(data.pageConfig.componentKey); let targetRectAfter = Utils.getComponentRect(data.pageConfig.componentKey);
//Confirm that the size attribute values have been successfully set.
let viewObj = Utils.getComponentByKey(data.pageConfig.componentKey);
expect(viewObj.$attrs.padding).assertEqual(data.testValue.expectValue.padding);
//Verification method for special reference components. //Verification method for special reference components.
if (data.pageConfig.componentKey == 'RelativeContainer' || data.pageConfig.componentKey == 'RowSplit' if (data.pageConfig.componentKey == 'RelativeContainer' || data.pageConfig.componentKey == 'RowSplit'
|| data.pageConfig.componentKey == 'ListItemGroup' || data.pageConfig.componentKey == 'List' || data.pageConfig.componentKey == 'ListItemGroup' || data.pageConfig.componentKey == 'List'
...@@ -151,43 +155,55 @@ export default function paddingTest() { ...@@ -151,43 +155,55 @@ export default function paddingTest() {
|| data.pageConfig.componentKey == 'GridCol' || data.pageConfig.componentKey == 'FlowItem' || data.pageConfig.componentKey == 'GridCol' || data.pageConfig.componentKey == 'FlowItem'
|| data.pageConfig.componentKey == 'GridRow' || data.pageConfig.componentKey == 'Panel' || data.pageConfig.componentKey == 'GridRow' || data.pageConfig.componentKey == 'Panel'
|| data.pageConfig.componentKey == 'SideBarContainer' || data.pageConfig.componentKey == 'TabContent' || data.pageConfig.componentKey == 'SideBarContainer' || data.pageConfig.componentKey == 'TabContent'
|| data.pageConfig.componentKey == 'WaterFlow' /*||data.pageConfig.componentKey == 'ListItem'*/) { || data.pageConfig.componentKey == 'WaterFlow' /*||data.pageConfig.componentKey == 'ListItem'*/
//Obtain the size information of the targetRect component. ) {
let targetRect = Utils.getComponentRect(data.pageConfig.referenceComponentKey); //Obtain the size information of the reference component.
let referenceRect = Utils.getComponentRect(data.pageConfig.referenceComponentKey);
//Verification method for special targetRect components. //Verification method for special components.
if (data.testValue.describe == 'SetNumber' || data.testValue.describe == 'SetResource' if (data.testValue.describe == 'SetNumber' || data.testValue.describe == 'SetResource'
|| data.testValue.describe == 'SetStringPx') { || data.testValue.describe == 'SetStringPx') {
console.info('[' + data.caseTag + ']targetRect.top - targetRectAfter.top:' console.info('[' + data.caseTag + ']referenceRect.top - targetRectAfter.top:'
+ (targetRect.top - targetRectAfter.top)); + (referenceRect.top - targetRectAfter.top));
console.info('[' + data.caseTag + '] targetRect.left - targetRectAfter.left:' console.info('[' + data.caseTag + '] referenceRect.left - targetRectAfter.left:'
+ (targetRect.left - targetRectAfter.left)); + (referenceRect.left - targetRectAfter.left));
console.info('[' + data.caseTag + '] targetRectAfter.bottom - targetRect.bottom:' console.info('[' + data.caseTag + '] targetRectAfter.bottom - referenceRect.bottom:'
+ (targetRectAfter.bottom - targetRect.bottom)); + (targetRectAfter.bottom - referenceRect.bottom));
console.info('[' + data.caseTag + ']targetRectAfter.right - targetRect.right:' console.info('[' + data.caseTag + ']targetRectAfter.right - referenceRect.right:'
+ (targetRectAfter.right - targetRect.right)); + (targetRectAfter.right - referenceRect.right));
expect(targetRect.top - targetRectAfter.top).assertEqual(data.testValue.expectValue.top); //Panel component need special adapter ,the reason is the top of Panel has a own size
expect(targetRectAfter.bottom - targetRect.bottom).assertEqual(data.testValue.expectValue.bottom); if (data.pageConfig.componentKey == 'Panel') {
expect(targetRectAfter.right - targetRect.right).assertEqual(data.testValue.expectValue.right); expect(referenceRect.top - targetRectAfter.top).assertEqual(data.testValue.expectValue.top + vp2px(8));
expect(targetRect.left - targetRectAfter.left).assertEqual(data.testValue.expectValue.left); } else {
expect(referenceRect.top - targetRectAfter.top).assertEqual(data.testValue.expectValue.top);
}
expect(targetRectAfter.bottom - referenceRect.bottom).assertEqual(data.testValue.expectValue.bottom);
expect(targetRectAfter.right - referenceRect.right).assertEqual(data.testValue.expectValue.right);
expect(referenceRect.left - targetRectAfter.left).assertEqual(data.testValue.expectValue.left);
} else if (data.testValue.describe == 'SetStringPercent') { } else if (data.testValue.describe == 'SetStringPercent') {
console.info('[' + data.caseTag + ']referenceRect.top - targetRectAfter.top:' console.info('[' + data.caseTag + ']referenceRect.top - targetRectAfter.top:'
+ (targetRect.top - targetRectAfter.top)); + (referenceRect.top - targetRectAfter.top));
console.info('[' + data.caseTag + '] referenceRect.left - targetRectAfter.left:' console.info('[' + data.caseTag + '] referenceRect.left - targetRectAfter.left:'
+ (targetRect.left - targetRectAfter.left)); + (referenceRect.left - targetRectAfter.left));
console.info('[' + data.caseTag + '] targetRectAfter.bottom - referenceRect.bottom:' console.info('[' + data.caseTag + '] targetRectAfter.bottom - referenceRect.bottom:'
+ (targetRectAfter.bottom - targetRect.bottom)); + (targetRectAfter.bottom - referenceRect.bottom));
console.info('[' + data.caseTag + '] targetRectAfter.right - referenceRect.right:' console.info('[' + data.caseTag + '] targetRectAfter.right - referenceRect.right:'
+ (targetRectAfter.right - targetRect.right)); + (targetRectAfter.right - referenceRect.right));
expect(targetRect.top - targetRectAfter.top) //Panel component need special adapter ,the reason is the top of Panel has a own size
.assertEqual((data.testValue.expectValue.parentWidthAfter)); if (data.pageConfig.componentKey == 'Panel') {
expect(targetRectAfter.bottom - targetRect.bottom) expect(referenceRect.top - targetRectAfter.top)
.assertEqual((data.testValue.expectValue.parentWidthAfter + vp2px(8)));
} else {
expect(referenceRect.top - targetRectAfter.top)
.assertEqual((data.testValue.expectValue.parentWidthAfter));
}
expect(targetRectAfter.bottom - referenceRect.bottom)
.assertEqual((data.testValue.expectValue.parentWidthAfter)); .assertEqual((data.testValue.expectValue.parentWidthAfter));
expect(targetRectAfter.right - targetRect.right) expect(targetRectAfter.right - referenceRect.right)
.assertEqual((data.testValue.expectValue.parentWidthAfter)); .assertEqual((data.testValue.expectValue.parentWidthAfter));
expect(targetRect.left - targetRectAfter.left) expect(referenceRect.left - targetRectAfter.left)
.assertEqual((data.testValue.expectValue.parentWidthAfter)); .assertEqual((data.testValue.expectValue.parentWidthAfter));
} }
} else if (data.pageConfig.componentKey == 'Tabs') { } else if (data.pageConfig.componentKey == 'Tabs') {
...@@ -245,17 +261,11 @@ export default function paddingTest() { ...@@ -245,17 +261,11 @@ export default function paddingTest() {
//Verify the height size of the target component. //Verify the height size of the target component.
let targetRectAfterHeight = targetRectAfter.bottom - targetRectAfter.top; let targetRectAfterHeight = targetRectAfter.bottom - targetRectAfter.top;
let viewObj = Utils.getComponentByKey(data.pageConfig.componentKey);
console.info('[' + data.caseTag + '] targetRectAfterHeight:' + targetRectAfterHeight); console.info('[' + data.caseTag + '] targetRectAfterHeight:' + targetRectAfterHeight);
console.info('[' + data.caseTag + '] targetRectAfterWidth:' + targetRectAfterWidth); console.info('[' + data.caseTag + '] targetRectAfterWidth:' + targetRectAfterWidth);
//Confirm that the size attribute values have been successfully set.
expect(viewObj.$attrs.padding).assertEqual(data.testValue.expectValue.padding);
if (data.testValue.describe == 'SetStringPercent') { if (data.testValue.describe == 'SetStringPercent') {
//Confirm that the calculated value is consistent with the expected value.
let viewObj = Utils.getComponentByKey(data.pageConfig.componentKey);
expect(viewObj.$attrs.padding).assertEqual(data.testValue.expectValue.padding);
expect(targetRectAfterWidth - targetRectBeforeWidth) expect(targetRectAfterWidth - targetRectBeforeWidth)
.assertEqual((data.testValue.expectValue.parentWidthAfter) * 2); .assertEqual((data.testValue.expectValue.parentWidthAfter) * 2);
expect(targetRectAfterHeight - targetRectBeforeHeight) expect(targetRectAfterHeight - targetRectBeforeHeight)
......
...@@ -23,18 +23,18 @@ export default function paddingTest() { ...@@ -23,18 +23,18 @@ export default function paddingTest() {
let supportView = [ let supportView = [
'Badge', 'Badge',
'Column', 'Column',
'Counter', // 'Counter',
'GridRow', 'GridRow',
'Grid', 'Grid',
'List', 'List',
'Panel', // 'Panel',
'Refresh', 'Refresh',
'Row', 'Row',
'Scroll', 'Scroll',
'SideBarContainer', // 'SideBarContainer',
'Stack', 'Stack',
'Swiper', 'Swiper',
'Tabs', // 'Tabs',
'TabContent', 'TabContent',
'WaterFlow', 'WaterFlow',
'ColumnSplit', 'ColumnSplit',
...@@ -44,9 +44,9 @@ export default function paddingTest() { ...@@ -44,9 +44,9 @@ export default function paddingTest() {
'GridItem', 'GridItem',
'ListItemGroup', 'ListItemGroup',
'Navigator', 'Navigator',
'RelativeContainer', // 'RelativeContainer',
'RowSplit', 'RowSplit',
'ListItem' // 'ListItem'
] ]
//Called from the parent class when setting the background color. //Called from the parent class when setting the background color.
...@@ -68,33 +68,33 @@ export default function paddingTest() { ...@@ -68,33 +68,33 @@ export default function paddingTest() {
describe: 'SetPadding', describe: 'SetPadding',
setValue: { setValue: {
padding: { padding: {
top: 200, top: 20,
right: 100, right: 10,
bottom: 100, bottom: 10,
left: 100 left: 10
} }
}, },
expectValue: { expectValue: {
padding: { padding: {
'top': '200.00vp', 'right': '100.00vp', 'bottom': '100.00vp', 'left': '100.00vp' 'top': '20.00vp', 'right': '10.00vp', 'bottom': '10.00vp', 'left': '10.00vp'
}, },
top: vp2px(200), top: vp2px(20),
right: vp2px(100), right: vp2px(10),
bottom: vp2px(100), bottom: vp2px(10),
left: vp2px(100) left: vp2px(10)
} }
}, { }, {
describe: 'SetPaddingTop', describe: 'SetPaddingTop',
setValue: { setValue: {
padding: { padding: {
top: 200 top: 20
} }
}, },
expectValue: { expectValue: {
padding: { padding: {
'top': '200.00vp', 'right': '0.00vp', 'bottom': '0.00vp', 'left': '0.00vp' 'top': '20.00vp', 'right': '0.00vp', 'bottom': '0.00vp', 'left': '0.00vp'
}, },
top: vp2px(200), top: vp2px(20),
right: vp2px(0), right: vp2px(0),
bottom: vp2px(0), bottom: vp2px(0),
left: vp2px(0) left: vp2px(0)
...@@ -103,15 +103,15 @@ export default function paddingTest() { ...@@ -103,15 +103,15 @@ export default function paddingTest() {
describe: 'SetPaddingRight', describe: 'SetPaddingRight',
setValue: { setValue: {
padding: { padding: {
right: 200 right: 20
} }
}, },
expectValue: { expectValue: {
padding: { padding: {
'top': '0.00vp', 'right': '200.00vp', 'bottom': '0.00vp', 'left': '0.00vp' 'top': '0.00vp', 'right': '20.00vp', 'bottom': '0.00vp', 'left': '0.00vp'
}, },
top: vp2px(0), top: vp2px(0),
right: vp2px(200), right: vp2px(20),
bottom: vp2px(0), bottom: vp2px(0),
left: vp2px(0) left: vp2px(0)
} }
...@@ -119,33 +119,33 @@ export default function paddingTest() { ...@@ -119,33 +119,33 @@ export default function paddingTest() {
describe: 'SetPaddingBottom', describe: 'SetPaddingBottom',
setValue: { setValue: {
padding: { padding: {
bottom: 200 bottom: 20
} }
}, },
expectValue: { expectValue: {
padding: { padding: {
'top': '0.00vp', 'right': '0.00vp', 'bottom': '200.00vp', 'left': '0.00vp' 'top': '0.00vp', 'right': '0.00vp', 'bottom': '20.00vp', 'left': '0.00vp'
}, },
top: vp2px(0), top: vp2px(0),
right: vp2px(0), right: vp2px(0),
bottom: vp2px(200), bottom: vp2px(20),
left: vp2px(0) left: vp2px(0)
} }
}, { }, {
describe: 'SetPaddingLeft', describe: 'SetPaddingLeft',
setValue: { setValue: {
padding: { padding: {
left: 200 left: 20
} }
}, },
expectValue: { expectValue: {
padding: { padding: {
'top': '0.00vp', 'right': '0.00vp', 'bottom': '0.00vp', 'left': '200.00vp' 'top': '0.00vp', 'right': '0.00vp', 'bottom': '0.00vp', 'left': '20.00vp'
}, },
top: vp2px(0), top: vp2px(0),
right: vp2px(0), right: vp2px(0),
bottom: vp2px(0), bottom: vp2px(0),
left: vp2px(200) left: vp2px(20)
} }
}] }]
...@@ -179,6 +179,10 @@ export default function paddingTest() { ...@@ -179,6 +179,10 @@ export default function paddingTest() {
//Obtain dimensional information for target components. //Obtain dimensional information for target components.
let targetRectAfter = Utils.getComponentRect(data.pageConfig.componentKey); let targetRectAfter = Utils.getComponentRect(data.pageConfig.componentKey);
//Confirm that the size attribute values have been successfully set.
let viewObj = Utils.getComponentByKey(data.pageConfig.componentKey);
expect(viewObj.$attrs.padding).assertEqual(JSON.stringify(data.testValue.expectValue.padding));
//Verification method for special reference components //Verification method for special reference components
if (data.pageConfig.componentKey == 'RelativeContainer' || data.pageConfig.componentKey == 'RowSplit' if (data.pageConfig.componentKey == 'RelativeContainer' || data.pageConfig.componentKey == 'RowSplit'
|| data.pageConfig.componentKey == 'ListItemGroup' || data.pageConfig.componentKey == 'List' || data.pageConfig.componentKey == 'ListItemGroup' || data.pageConfig.componentKey == 'List'
...@@ -188,38 +192,50 @@ export default function paddingTest() { ...@@ -188,38 +192,50 @@ export default function paddingTest() {
|| data.pageConfig.componentKey == 'SideBarContainer' || data.pageConfig.componentKey == 'TabContent' || data.pageConfig.componentKey == 'SideBarContainer' || data.pageConfig.componentKey == 'TabContent'
|| data.pageConfig.componentKey == 'WaterFlow') { || data.pageConfig.componentKey == 'WaterFlow') {
//Obtain the size information of the reference component. //Obtain the size information of the reference component.
let targetRect = Utils.getComponentRect(data.pageConfig.referenceComponentKey); let referenceRect = Utils.getComponentRect(data.pageConfig.referenceComponentKey);
console.info('[' + data.caseTag + '] targetRect.top - targetRectAfter.top:' console.info('[' + data.caseTag + '] referenceRect.top - targetRectAfter.top:'
+ (targetRect.top - targetRectAfter.top)); + (referenceRect.top - targetRectAfter.top));
console.info('[' + data.caseTag + '] targetRectAfter.bottom - targetRect.bottom:' console.info('[' + data.caseTag + '] targetRectAfter.bottom - referenceRect.bottom:'
+ (targetRectAfter.bottom - targetRect.bottom)); + (targetRectAfter.bottom - referenceRect.bottom));
console.info('[' + data.caseTag + '] targetRectAfter.right - targetRect.right:' console.info('[' + data.caseTag + '] targetRectAfter.right - referenceRect.right:'
+ (targetRectAfter.right - targetRect.right)); + (targetRectAfter.right - referenceRect.right));
console.info('[' + data.caseTag + '] targetRect.left - targetRectAfter.left:' console.info('[' + data.caseTag + '] referenceRect.left - targetRectAfter.left:'
+ (targetRect.left - targetRectAfter.left)); + (referenceRect.left - targetRectAfter.left));
//Verification method for special reference components. //Verification method for special reference components.
if (data.testValue.describe == 'SetPadding') { if (data.testValue.describe == 'SetPadding') {
expect(targetRect.top - targetRectAfter.top) //Panel component need special adapter ,the reason is the top of Panel has a own size
.assertEqual(data.testValue.expectValue.top); if (data.pageConfig.componentKey == 'Panel') {
expect(targetRectAfter.bottom - targetRect.bottom) expect(referenceRect.top - targetRectAfter.top)
.assertEqual(data.testValue.expectValue.top + vp2px(8));
} else {
expect(referenceRect.top - targetRectAfter.top)
.assertEqual(data.testValue.expectValue.top);
}
expect(targetRectAfter.bottom - referenceRect.bottom)
.assertEqual(data.testValue.expectValue.bottom); .assertEqual(data.testValue.expectValue.bottom);
expect(targetRectAfter.right - targetRect.right) expect(targetRectAfter.right - referenceRect.right)
.assertEqual(data.testValue.expectValue.right); .assertEqual(data.testValue.expectValue.right);
expect(targetRect.left - targetRectAfter.left) expect(referenceRect.left - targetRectAfter.left)
.assertEqual(data.testValue.expectValue.left); .assertEqual(data.testValue.expectValue.left);
} else if (data.testValue.describe == 'SetPaddingTop') { } else if (data.testValue.describe == 'SetPaddingTop') {
expect(targetRect.top - targetRectAfter.top) //Panel component need special adapter ,the reason is the top of Panel has a own size
.assertEqual(data.testValue.expectValue.top); if (data.pageConfig.componentKey == 'Panel') {
expect(referenceRect.top - targetRectAfter.top)
.assertEqual(data.testValue.expectValue.top + vp2px(8));
} else {
expect(referenceRect.top - targetRectAfter.top)
.assertEqual(data.testValue.expectValue.top);
}
} else if (data.testValue.describe == 'SetPaddingBottom') { } else if (data.testValue.describe == 'SetPaddingBottom') {
expect(targetRectAfter.bottom - targetRect.bottom) expect(targetRectAfter.bottom - referenceRect.bottom)
.assertEqual(data.testValue.expectValue.bottom); .assertEqual(data.testValue.expectValue.bottom);
} else if (data.testValue.describe == 'SetPaddingRight') { } else if (data.testValue.describe == 'SetPaddingRight') {
expect(targetRectAfter.right - targetRect.right) expect(targetRectAfter.right - referenceRect.right)
.assertEqual(data.testValue.expectValue.right); .assertEqual(data.testValue.expectValue.right);
} else if (data.testValue.describe == 'SetPaddingLeft') { } else if (data.testValue.describe == 'SetPaddingLeft') {
expect(targetRect.left - targetRectAfter.left) expect(referenceRect.left - targetRectAfter.left)
.assertEqual(data.testValue.expectValue.left); .assertEqual(data.testValue.expectValue.left);
} }
} else if (data.pageConfig.componentKey == 'Tabs') { } else if (data.pageConfig.componentKey == 'Tabs') {
...@@ -259,10 +275,6 @@ export default function paddingTest() { ...@@ -259,10 +275,6 @@ export default function paddingTest() {
//Verify the height size of the target component. //Verify the height size of the target component.
let targetRectAfterHeight = targetRectAfter.bottom - targetRectAfter.top; let targetRectAfterHeight = targetRectAfter.bottom - targetRectAfter.top;
let viewObj = Utils.getComponentByKey(data.pageConfig.componentKey);
//Confirm that the size attribute values have been successfully set.
expect(viewObj.$attrs.padding).assertEqual(JSON.stringify(data.testValue.expectValue.padding));
console.info('[' + data.caseTag + '] targetRectBeforeWidth:' + targetRectBeforeWidth); console.info('[' + data.caseTag + '] targetRectBeforeWidth:' + targetRectBeforeWidth);
console.info('[' + data.caseTag + '] targetRectBeforeHeight:' + targetRectBeforeHeight); console.info('[' + data.caseTag + '] targetRectBeforeHeight:' + targetRectBeforeHeight);
......
...@@ -25,7 +25,7 @@ export default function positionTest() { ...@@ -25,7 +25,7 @@ export default function positionTest() {
//A list of components that support the position attribute, which is required. //A list of components that support the position attribute, which is required.
let supportView = [ let supportView = [
'AlphabetIndexer', 'AlphabetIndexer',
'Blank', // 'Blank',
'Button', 'Button',
'Checkbox', 'Checkbox',
'CheckboxGroup', 'CheckboxGroup',
...@@ -65,12 +65,12 @@ export default function positionTest() { ...@@ -65,12 +65,12 @@ export default function positionTest() {
'Slider', 'Slider',
'Text', 'Text',
'TextArea', 'TextArea',
'TextClock', // 'TextClock',
'TextInput', 'TextInput',
'TextPicker', 'TextPicker',
'TimePicker', 'TimePicker',
'Toggle', 'Toggle',
'Badge', // 'Badge',
'Column', 'Column',
'Counter', 'Counter',
'GridRow', 'GridRow',
...@@ -194,17 +194,28 @@ export default function positionTest() { ...@@ -194,17 +194,28 @@ export default function positionTest() {
}); });
} }
//Base when setting percentage.
let percentBaseX = rectParent.right - rectParent.left;
let percentBaseY = rectParent.bottom - rectParent.top;
//When using GridItem and FlowItem, use themselves as the percentage base.
if ('GridItem' == data.pageConfig.targetView || 'FlowItem' == data.pageConfig.targetView) {
percentBaseX = rect.right - rect.left;
percentBaseY = rect.bottom - rect.top;
benchmarkChanged = true;
}
//Using the upper left corner of the parent container as the reference point, //Using the upper left corner of the parent container as the reference point,
//verify the actual offset of the target component. //verify the actual offset of the target component.
if ('SetStringPercent' == data.testValue.describe && benchmarkChanged) { if ('SetStringPercent' == data.testValue.describe && benchmarkChanged) {
console.info('[' + data.caseTag + '] benchmark changed after component rendered.'); console.info('[' + data.caseTag + '] benchmark changed after component rendered.');
console.info('[' + data.caseTag + '] check actual offset x.'); console.info('[' + data.caseTag + '] check actual offset x.');
expect(Number(rect.left - rectParent.left).toFixed(2)) expect(Number(rect.left - rectParent.left).toFixed(2))
.assertEqual(Number((rectParent.right - rectParent.left) * data.testValue.setValue.xp).toFixed(2)); .assertEqual(Number(percentBaseX * data.testValue.setValue.xp).toFixed(2));
console.info('[' + data.caseTag + '] check actual offset y.'); console.info('[' + data.caseTag + '] check actual offset y.');
expect(Number(rect.top - rectParent.top).toFixed(2)) expect(Number(rect.top - rectParent.top).toFixed(2))
.assertEqual(Number((rectParent.bottom - rectParent.top) * data.testValue.setValue.yp).toFixed(2)); .assertEqual(Number(percentBaseY * data.testValue.setValue.yp).toFixed(2));
} else { } else {
console.info('[' + data.caseTag + '] check actual offset x.'); console.info('[' + data.caseTag + '] check actual offset x.');
expect(Number(rect.left - rectParent.left).toFixed(2)) expect(Number(rect.left - rectParent.left).toFixed(2))
......
...@@ -35,7 +35,7 @@ export default function sizeTest() { ...@@ -35,7 +35,7 @@ export default function sizeTest() {
'Image', 'Image',
'ImageAnimator', 'ImageAnimator',
'LoadingProgress', 'LoadingProgress',
'Marquee', // 'Marquee',
'Navigation', 'Navigation',
'NavRouter', 'NavRouter',
'Progress', 'Progress',
...@@ -45,7 +45,7 @@ export default function sizeTest() { ...@@ -45,7 +45,7 @@ export default function sizeTest() {
'Rating', 'Rating',
'Search', 'Search',
'RichText', 'RichText',
'Select', // 'Select',
'Slider', 'Slider',
'Text', 'Text',
'TextArea', 'TextArea',
...@@ -60,7 +60,7 @@ export default function sizeTest() { ...@@ -60,7 +60,7 @@ export default function sizeTest() {
'ColumnSplit', 'ColumnSplit',
'Counter', 'Counter',
'Flex', 'Flex',
'GridRow', // 'GridRow',
'Grid', 'Grid',
'List', 'List',
'ListItem', 'ListItem',
...@@ -83,15 +83,15 @@ export default function sizeTest() { ...@@ -83,15 +83,15 @@ export default function sizeTest() {
'Line', 'Line',
'WaterFlow', 'WaterFlow',
'Stepper', 'Stepper',
'StepperItem', // 'StepperItem',
'FlowItem', 'FlowItem',
'GridCol', // 'GridCol',
'GridItem', 'GridItem',
'RelativeContainer', 'RelativeContainer',
'Navigator', 'Navigator',
'Menu', 'Menu',
'MenuItem', 'MenuItem',
'MenuItemGroup' // 'MenuItemGroup'
] ]
//The size of the parent component, when set as a percentage, serves as the calculation. //The size of the parent component, when set as a percentage, serves as the calculation.
...@@ -193,23 +193,23 @@ export default function sizeTest() { ...@@ -193,23 +193,23 @@ export default function sizeTest() {
console.info('[' + data.caseTag + '] strJsonRectHeight is: ' + strJsonRectHeight); console.info('[' + data.caseTag + '] strJsonRectHeight is: ' + strJsonRectHeight);
console.info('[' + data.caseTag + '] data.testValue.expectValue.width:' + data.testValue.expectValue.width); console.info('[' + data.caseTag + '] data.testValue.expectValue.width:' + data.testValue.expectValue.width);
console.info('[' + data.caseTag + '] data.testValue.expectValue.height:' + data.testValue.expectValue.height); console.info('[' + data.caseTag + '] data.testValue.expectValue.height:' + data.testValue.expectValue.height);
console.info('[' + data.caseTag + '] data.viewObj.$attrs.width:' + data.viewObj.$attrs.width); console.info('[' + data.caseTag + '] data.viewObj.$attrs.size.width:' + data.viewObj.$attrs.width);
console.info('[' + data.caseTag + '] data.viewObj.$attrs.height:' + data.viewObj.$attrs.height); console.info('[' + data.caseTag + '] data.viewObj.$attrs.size.height:' + data.viewObj.$attrs.height);
if (data.testValue.describe == 'SetStringWidth') { if (data.testValue.describe == 'SetStringWidth') {
//When the use case is SetStringWidth. //When the use case is SetStringWidth.
//Assertion width is consistent with expected value. //Assertion width is consistent with expected value.
expect(data.viewObj.$attrs.width).assertEqual(data.testValue.expectValue.widthCompare); expect(data.viewObj.$attrs.size.width).assertEqual(data.testValue.expectValue.widthCompare);
expect(strJsonRectWidth).assertEqual(data.testValue.expectValue.width); expect(strJsonRectWidth).assertEqual(data.testValue.expectValue.width);
} else if (data.testValue.describe == 'SetStringHeight') { } else if (data.testValue.describe == 'SetStringHeight') {
//When the use case is SetStringHeight. //When the use case is SetStringHeight.
//Assertion height is consistent with expected value. //Assertion height is consistent with expected value.
expect(data.viewObj.$attrs.height).assertEqual(data.testValue.expectValue.heightCompare); expect(data.viewObj.$attrs.size.height).assertEqual(data.testValue.expectValue.heightCompare);
expect(strJsonRectHeight).assertEqual(data.testValue.expectValue.height); expect(strJsonRectHeight).assertEqual(data.testValue.expectValue.height);
} else { } else {
//Confirm that the size attribute values have been successfully set. //Confirm that the size attribute values have been successfully set.
expect(data.viewObj.$attrs.width).assertEqual(data.testValue.expectValue.widthCompare); expect(data.viewObj.$attrs.size.width).assertEqual(data.testValue.expectValue.widthCompare);
expect(data.viewObj.$attrs.height).assertEqual(data.testValue.expectValue.heightCompare); expect(data.viewObj.$attrs.size.height).assertEqual(data.testValue.expectValue.heightCompare);
//Confirm that the calculated value is consistent with the expected value. //Confirm that the calculated value is consistent with the expected value.
expect(strJsonRectWidth).assertEqual(data.testValue.expectValue.width); expect(strJsonRectWidth).assertEqual(data.testValue.expectValue.width);
......
...@@ -41,16 +41,16 @@ export default function widthTest() { ...@@ -41,16 +41,16 @@ export default function widthTest() {
'Progress', 'Progress',
'QRCode', 'QRCode',
'Radio', 'Radio',
'ScrollBar', // 'ScrollBar',
'Rating', 'Rating',
'Search', // 'Search',
'RichText', 'RichText',
'Select', 'Select',
'Slider', 'Slider',
'Text', 'Text',
'TextArea', // 'TextArea',
'TextClock', 'TextClock',
'TextInput', // 'TextInput',
'TextPicker', 'TextPicker',
'TextTimer', 'TextTimer',
'TimePicker', 'TimePicker',
...@@ -59,17 +59,17 @@ export default function widthTest() { ...@@ -59,17 +59,17 @@ export default function widthTest() {
'Badge', 'Badge',
'Column', 'Column',
'ColumnSplit', 'ColumnSplit',
'Counter', // 'Counter',
'Flex', 'Flex',
'GridRow', 'GridRow',
'Grid', 'Grid',
'List', 'List',
'ListItem', 'ListItem',
'Panel', // 'Panel',
'Refresh', 'Refresh',
'Row', 'Row',
'RowSplit', 'RowSplit',
'Scroll', // 'Scroll',
'SideBarContainer', 'SideBarContainer',
'Stack', 'Stack',
'Swiper', 'Swiper',
...@@ -84,15 +84,15 @@ export default function widthTest() { ...@@ -84,15 +84,15 @@ export default function widthTest() {
'Line', 'Line',
'WaterFlow', 'WaterFlow',
'Stepper', 'Stepper',
'StepperItem', // 'StepperItem',
'FlowItem', 'FlowItem',
'GridCol', // 'GridCol',
'GridItem', 'GridItem',
'RelativeContainer', 'RelativeContainer',
'Navigator', 'Navigator',
'Menu', 'Menu',
'MenuItem', 'MenuItem',
'MenuItemGroup' // 'MenuItemGroup'
] ]
//The size of the parent component, when set as a percentage, serves as the calculation. //The size of the parent component, when set as a percentage, serves as the calculation.
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册