diff --git a/function/arkui/inspector_test/build-profile.json5 b/function/arkui/inspector_test/build-profile.json5 index 135321fc999bb37d769208cfb46ea09c79f201f0..cdea552bc9332b53996af1fe319a7fec2141eef1 100644 --- a/function/arkui/inspector_test/build-profile.json5 +++ b/function/arkui/inspector_test/build-profile.json5 @@ -1,6 +1,19 @@ { "app": { - "signingConfigs": [], + "signingConfigs": [ + { + "name": "default", + "material": { + "certpath": "C:/Users/kaihong/.ohos/config/openharmony/default_inspector_test_3bvnl16eDcfMBV95O1Sr4AZppoJHFHTPMQanbVEmm08=.cer", + "storePassword": "0000001BDD03653D341BEA64FAB73C07CBF04369E64679DE1825C284FF8DFF4FE0A3066DC4A8DA627B5342", + "keyAlias": "debugKey", + "keyPassword": "0000001B3B0BF7B3E527B35BC6F4B232D56FBF86EA5776AA4F016F33DD85045F6996B17DAF5D7090ED83D9", + "profile": "C:/Users/kaihong/.ohos/config/openharmony/default_inspector_test_3bvnl16eDcfMBV95O1Sr4AZppoJHFHTPMQanbVEmm08=.p7b", + "signAlg": "SHA256withECDSA", + "storeFile": "C:/Users/kaihong/.ohos/config/openharmony/default_inspector_test_3bvnl16eDcfMBV95O1Sr4AZppoJHFHTPMQanbVEmm08=.p12" + } + } + ], "products": [ { "name": "default", diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/IndexQ.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/IndexQ.ets index f5b6b784aeb0b2661ea07be27db8c8a6609129e7..43560fc95e7d51a966e95bdca227343a1f96d29b 100644 --- a/function/arkui/inspector_test/entry/src/main/ets/pages/IndexQ.ets +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/IndexQ.ets @@ -11,4 +11,71 @@ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. - */ \ No newline at end of file + */ + +import router from '@ohos.router' + +@Entry +@Component +struct IndexQ { + @State arrLeft: Array = [ + 'NavDestination/NavDestination01', + 'Navigation/navigation01', + 'RichEditor/RichEditor01', + 'SideBarContainer/SideBarContainer01', + 'Stepper/stepper01', + 'Stepper/stepper02', + 'Stepper/stepper03', + 'Stepper/stepper04', + 'Video/video01' + ]; + + @State arrRight: Array = [ + ]; + + build() { + Column(){ + Row() { + Scroll() { + Column() { + ForEach(this.arrLeft, (item: string) => { + Button(item) + .margin({top:5}) + .onClick(() => { + router.pushUrl({ + url: `pages/${item}`, + params: '' + }) + }) + }) + } + }.width("50%") + + Scroll() { + Column() { + ForEach(this.arrRight, (item: string) => { + Button(item) + .margin({top:5}) + .onClick(() => { + router.pushUrl({ + url: `pages/${item}`, + params: '' + }) + }) + }) + } + }.width("50%") + } + + Button('Back') + .onClick(()=> { + router.pushUrl({ + url: 'pages/Index', + params: '' + }) + }) + } + .width('100%') + .height('100%') + } +} \ No newline at end of file diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/NavDestination/NavDestination01.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/NavDestination/NavDestination01.ets new file mode 100644 index 0000000000000000000000000000000000000000..1a671f88640453e4073d8476213389b3046fe30d --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/NavDestination/NavDestination01.ets @@ -0,0 +1,142 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { SymbolGlyphModifier } from '@kit.ArkUI'; +import router from '@ohos.router' +@Entry +@Component +struct navigation01 { + @State hideTitleBar: boolean = true + @State hideToolBar: boolean = false + @State menuItems: Array = [ + { + value: 'menuItem1', + icon: 'resources/base/media/ic_public_ok.svg' + }, + { + value: 'menuItem2', + icon: 'resources/base/media/ic_public_ok.svg', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_folder_badge_plus')).fontColor([Color.Red, Color.Green]) + .renderingStrategy(SymbolRenderingStrategy.MULTIPLE_COLOR), + }, + { + value: 'menuItem3', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_lungs')), + }, + ] + @State toolItems: Array = [ + { + value: 'toolItem1', + icon: 'resources/base/media/ic_public_ok.svg', // 图标资源路径 + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_lungs')), + status: ToolbarItemStatus.ACTIVE, + activeSymbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_folder_badge_plus')).fontColor([Color.Red, + Color.Green]).renderingStrategy(SymbolRenderingStrategy.MULTIPLE_COLOR), + action: () => { + } + }, + { + value: 'toolItem2', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_star')), + status: ToolbarItemStatus.ACTIVE, + activeIcon: 'resources/base/media/ic_public_more.svg', // 图标资源路径 + action: () => { + } + }, + { + value: 'toolItem3', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_star')), + status: ToolbarItemStatus.ACTIVE, + activeSymbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_lungs')), + action: () => { + } + } + ] + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_NavDestination_id', ''], + ['', 'qzq_NavDestination_key'], + ['qzq_NavDestination_id', 'qzq_NavDestination_key'], + ]; + private arr01: number[] = [1, 2, 3] + + build() { + Scroll() { + Column() { + Text("NavDestination") + .fontSize(18) + Navigation() { + TextInput({ placeholder: "请搜索" }) + .width("90%") + .height(40) + .backgroundColor('#FFFFFF') + List({ space: 12 }) { + ForEach(this.idOrKeyArray, (item: Array) => { + ListItem() { + NavRouter() { + Text("NavRouter" + item) + .width("100%") + .height(70) + .backgroundColor('#FFFFFF') + .borderRadius(24) + .fontSize(16) + .fontWeight(300) + .textAlign(TextAlign.Center) + NavDestination() { + Text("内容页内容" + item) + Button("change hideTitleBar") + .onClick(() => { + this.hideTitleBar = !this.hideTitleBar + }) + } + .id(item[0]) + .key(item[1]) + .hideTitleBar(this.hideTitleBar) + .mode(NavDestinationMode.STANDARD) + .backButtonIcon($r('app.media.foreground')) + .title({ main: "内容页主标题" + item, sub: "内容页主标题" + item }) + .onShown(() => { + console.info('onShown') + }) + .onHidden(() => { + console.info('onHidden') + }) + } + } + }) + } + .width("90%") + .margin({ top: 12 }) + } + .title("主标题") + .mode(NavigationMode.Stack) + .titleMode(NavigationTitleMode.Full) + .hideToolBar(this.hideToolBar) + .hideTitleBar(this.hideTitleBar) + .menus(this.menuItems) + .toolbarConfiguration(this.toolItems) + + Button("change hideToolBar") + .onClick(() => { + this.hideToolBar = !this.hideToolBar + }) + Button("change hideTitleBar") + .onClick(() => { + this.hideTitleBar = !this.hideTitleBar + }) + } + } + } +} + diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/navigation01.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/navigation01.ets new file mode 100644 index 0000000000000000000000000000000000000000..872de877d13c686db3b57fdc473ccdf0f08978de --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/navigation01.ets @@ -0,0 +1,122 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { page1 } from './page1' +import { page2 } from './page2' +import { SymbolGlyphModifier } from '@kit.ArkUI'; + +@Entry +@Component +struct Index { + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_Navigation_id', ''], + ['', 'qzq_Navigation_key'], + ['qzq_Navigation_id', 'qzq_Navigation_key'], + ]; + @State menuItems: Array = [ + { + value: 'menuItem1', + icon: 'resources/base/media/ic_public_o k.svg' + }, + { + value: 'menuItem2', + icon: 'resources/base/media/ic_public_ok.svg', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_folder_badge_plus')).fontColor([Color.Red, Color.Green]) + .renderingStrategy(SymbolRenderingStrategy.MULTIPLE_COLOR), + }, + { + value: 'menuItem3', + symbolIcon: new SymbolGlyphModifier($r('sys.symbol.ohos_lungs')), + }, + ] + private toolbaritems: ToolbarItem[] = [ + { + value: '工具1', + icon: $r('app.media.startIcon'), + action: () => { + } + }, + { + value: '工具2', + icon: $r('app.media.startIcon'), + action: () => { + } + }, + { + value: '工具3', + icon: $r('app.media.startIcon'), + action: () => { + } + }, + { + value: '工具4', + icon: $r('app.media.startIcon'), + action: () => { + } + } + ] + // 页面路由栈 + @Provide('pathstack') pathstack: NavPathStack = new NavPathStack() + // 内容页 + @Builder + pagemap(pagename: string) { + if (pagename == 'page1') { + page1() + } else if (pagename == 'page2') { + page2() + } + } + + build() { + Column() { + Text("Navigation") + .fontSize(18) + List({ space: 30 }) { + ForEach(this.idOrKeyArray, (item: Array) => { + ListItem() { + Navigation(this.pathstack) { + Column({ space: 20 }) { + Text('page1') + .fontSize(28) + .padding(10) + .border({ width: 2, color: Color.Black }) + .onClick(() => { + this.pathstack.pushPath({ name: 'page1' }) + }) + .width('100%') + Text('page2') + .fontSize(28) + .padding(10) + .border({ width: 2, color: Color.Black }) + .onClick(() => { + this.pathstack.pushPath({ name: 'page2' }) + }) + .width('100%') + }.width('100%') + .height('100%') + .backgroundColor(Color.Gray) + } + .id(item[0]) + .key(item[1]) + .title('主标题') + .menus(this.menuItems) + .toolbarConfiguration(this.toolbaritems) + .navDestination(this.pagemap) + } + }) + } + } + } +} diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/page1.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/page1.ets new file mode 100644 index 0000000000000000000000000000000000000000..385e80b0a3eeb26b070a11dc07c1c892f53afb28 --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/page1.ets @@ -0,0 +1,46 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Component +export struct page1 { + // 子页面拿到页面栈 + @Consume('pathstack') pathstack:NavPathStack + private menuitems: NavigationMenuItem[] = [ + { + value: '菜单1', + icon: 'resources/base/media/startIcon.png', + action: () => { + } + }, + { + value: '菜单2', + icon: 'resources/base/media/startIcon.png', + action: () => { + } + } + ] + + build() { + NavDestination() { + Column() { + Text('page1').fontSize(28).fontWeight(FontWeight.Bolder) + }.width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + + }.title('页面标题') + .menus(this.menuitems) + + } +} diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/page2.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/page2.ets new file mode 100644 index 0000000000000000000000000000000000000000..5408bbc5c4a81fc61fb51b7f3a6e8500b26950d5 --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Navigation/page2.ets @@ -0,0 +1,46 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Component +export struct page2 { + // 子页面拿到页面栈 + @Consume('pathstack') pathstack:NavPathStack + private menuitems: NavigationMenuItem[] = [ + { + value: '菜单1', + icon: 'resources/base/media/startIcon.png', + action: () => { + } + }, + { + value: '菜单2', + icon: 'resources/base/media/startIcon.png', + action: () => { + } + } + ] + + build() { + NavDestination() { + Column() { + Text('page2').fontSize(28).fontWeight(FontWeight.Bolder) + }.width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + + }.title('页面标题') + .menus(this.menuitems) + + } +} diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/RichEditor/RichEditor01.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/RichEditor/RichEditor01.ets new file mode 100644 index 0000000000000000000000000000000000000000..d9c6194a40ff83b81cc7f50158db2d342897470f --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/RichEditor/RichEditor01.ets @@ -0,0 +1,247 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import router from '@ohos.router' +@Entry +@Component +struct RichEditor01 { + @Builder + placeholderBuilder4() { + Column() { + Column({ space: 5 }) { + Text('direction:Row').fontSize(9).fontColor(0xCCCCCC).width('90%') + Flex({ direction: FlexDirection.Row }) { + Text('1').width('20%').height(50).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(50).backgroundColor(0xD2B48C) + Text('1').width('20%').height(50).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(50).backgroundColor(0xD2B48C) + } + .height(70) + .width('90%') + .padding(10) + .backgroundColor(0xAFEEEE) + + Text('direction:RowReverse').fontSize(9).fontColor(0xCCCCCC).width('90%') + Flex({ direction: FlexDirection.RowReverse }) { + Text('1').width('20%').height(50).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(50).backgroundColor(0xD2B48C) + Text('1').width('20%').height(50).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(50).backgroundColor(0xD2B48C) + } + .height(70) + .width('90%') + .padding(10) + .backgroundColor(0xAFEEEE) + + Text('direction:Column').fontSize(9).fontColor(0xCCCCCC).width('90%') + Flex({ direction: FlexDirection.Column }) { + Text('1').width('20%').height(40).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(40).backgroundColor(0xD2B48C) + Text('1').width('20%').height(40).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(40).backgroundColor(0xD2B48C) + } + .height(160) + .width('90%') + .padding(10) + .backgroundColor(0xAFEEEE) + + Text('direction:ColumnReverse').fontSize(9).fontColor(0xCCCCCC).width('90%') + Flex({ direction: FlexDirection.ColumnReverse }) { + Text('1').width('20%').height(40).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(40).backgroundColor(0xD2B48C) + Text('1').width('20%').height(40).backgroundColor(0xF5DEB3) + Text('1').width('20%').height(40).backgroundColor(0xD2B48C) + } + .height(160) + .width('90%') + .padding(10) + .backgroundColor(0xAFEEEE) + }.width('100%').margin({ top: 5 }) + }.width('100%') + } + @Builder + placeholderBuilder() { + Row({ space: 2 }) { + Image($r("app.media.icon")).width(24).height(24).margin({ left: -5 }) + Text('Custom Popup').fontSize(10) + }.width(100).height(50).padding(5) + } + controller: RichEditorController = new RichEditorController() + private spanParagraphs: RichEditorParagraphResult[] = []; + private start: number = -1; + private end: number = -1; + private my_offset: number | undefined = undefined + private my_builder: CustomBuilder = undefined + @State message: string = "[-1, -1]" + // 自定义键盘组件 + @Builder + CustomKeyboardBuilder() { + Column() { + Grid() { + ForEach([1, 2, 3, 4, 5, 6, 7, 8, 9, '*', 0, '#'], (item: number | string) => { + GridItem() { + Button(item + "") + .width(110).onClick(() => { + this.controller.addTextSpan(item + '', { + offset: this.controller.getCaretOffset(), + style: + { + fontColor: Color.Orange, + fontSize: 30 + } + }) + this.controller.setCaretOffset(this.controller.getCaretOffset() + item.toString().length) + }) + } + }) + }.maxCount(3).columnsGap(10).rowsGap(10).padding(5) + }.backgroundColor(Color.Gray) + } + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_RichEditor_id', ''], + ['', 'qzq_RichEditor_key'], + ['qzq_RichEditor_id', 'qzq_RichEditor_key'], + ]; + build() { + Column() { + Text("RichEditor") + .fontSize(18) + List({ space: 70 }) { + ForEach(this.idOrKeyArray, (item: Array) => { + ListItem() { + Column() { + RichEditor({ controller: this.controller }) + .id(item[0]) + .key(item[1]) + .customKeyboard(this.CustomKeyboardBuilder()) + .margin(10) + .border({ width: 1 }) + .height(200) + .borderWidth(2) + .borderColor(Color.Black) + .width("100%") + .onReady(() => { + this.controller.addTextSpan("012345", + { + style: + { + fontColor: Color.Orange, + fontSize: 30 + } + }) + this.controller.addSymbolSpan($r("sys.symbol.ohos_trash"), + { + style: + { + fontSize: 30 + } + }) + }) + .onReady(() => { + console.log("isready") + }) + .onSelect((value: RichEditorSelection) => { + this.start = value.selection[0]; + this.end = value.selection[1]; + this.message = "[" + this.start + ", " + this.end + "]" + }) + .aboutToIMEInput((value: RichEditorInsertValue) => { + console.log("---------------------- aboutToIMEInput ----------------------") + console.log("insertOffset:" + value.insertOffset) + console.log("insertValue:" + value.insertValue) + return true; + }) + .onIMEInputComplete((value: RichEditorTextSpanResult) => { + console.log("---------------------- onIMEInputComplete ---------------------") + console.log("spanIndex:" + value.spanPosition.spanIndex) + console.log("spanRange:[" + value.spanPosition.spanRange[0] + "," + value.spanPosition.spanRange[1] + + "]") + console.log("offsetInSpan:[" + value.offsetInSpan[0] + "," + value.offsetInSpan[1] + "]") + console.log("value:" + value.value) + }) + .aboutToDelete((value: RichEditorDeleteValue) => { + console.log("---------------------- aboutToDelete --------------------------") + console.log("offset:" + value.offset) + console.log("direction:" + value.direction) + console.log("length:" + value.length) + value.richEditorDeleteSpans.forEach(item => { + console.log("---------------------- item --------------------------") + console.log("spanIndex:" + item.spanPosition.spanIndex) + console.log("spanRange:[" + item.spanPosition.spanRange[0] + "," + item.spanPosition.spanRange[1] + + "]") + console.log("offsetInSpan:[" + item.offsetInSpan[0] + "," + item.offsetInSpan[1] + "]") + if (typeof (item as RichEditorImageSpanResult)['imageStyle'] != 'undefined') { + console.log("image:" + (item as RichEditorImageSpanResult).valueResourceStr) + } else { + console.log("text:" + (item as RichEditorTextSpanResult).value) + } + }) + return true; + }) + .onDeleteComplete(() => { + console.log("---------------------- onDeleteComplete ------------------------") + }) + Column({ space: 5 }) { + Row() { + Button("删除选择内容").onClick(() => { + this.controller.deleteSpans({ + start: this.start, + end: this.end + }) + this.start = -1; + this.end = -1; + this.message = "[" + this.start + ", " + this.end + "]" + }) + Button('builder1').onClick(() => { + this.my_builder = () => { + this.placeholderBuilder() + } + }) + Button("add span") + .onClick(() => { + let num = this.controller.addBuilderSpan(this.my_builder, { offset: this.my_offset }) + console.info('addBuilderSpan return ' + num) + }) + } + + Row() { + Button("add image") + .onClick(() => { + let num = this.controller.addImageSpan($r("app.media.icon"), { + imageStyle: { + size: ["50px", "50px"], + verticalAlign: ImageSpanAlignment.BOTTOM, + layoutStyle: { + borderRadius: undefined, + margin: undefined + } + } + }) + }) + Button('builder4').onClick(() => { + this.my_builder = () => { + this.placeholderBuilder4() + } + }) + } + } + } + } + }) + } + } + } +} diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/SideBarContainer/SideBarContainer01.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/SideBarContainer/SideBarContainer01.ets new file mode 100644 index 0000000000000000000000000000000000000000..734feabdb86e8dbcc27a68651b7040dbc3a542da --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/SideBarContainer/SideBarContainer01.ets @@ -0,0 +1,104 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Entry +@Component +struct SideBarContainerExample { + normalIcon: Resource = $r("app.media.icon") + selectedIcon: Resource = $r("app.media.icon") + @State arr: number[] = [1, 2, 3] + @State current: number = 1 + @State showControlButton:boolean=true + @State showSideBar:boolean=true + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_SiderBarContainer_id', ''], + ['', 'qzq_SiderBarContainer_key'], + ['qzq_SiderBarContainer_id', 'qzq_SiderBarContainer_key'], + ]; + + build() { + Column() { + Text("SiderBarContainer") + .fontSize(18) + List({space:30}) { + ForEach(this.idOrKeyArray, (item: Array) => { + ListItem(){ + Column() { + SideBarContainer(SideBarContainerType.Embed) { + Column() { + ForEach(this.arr, (item: number) => { + Column({ space: 5 }) { + Image(this.current === item ? this.selectedIcon : this.normalIcon).width(64).height(64) + Text("Index0" + item) + .fontSize(25) + .fontColor(this.current === item ? '#0A59F7' : '#999') + .fontFamily('source-sans-pro,cursive,sans-serif') + } + .onClick(() => { + this.current = item + }) + }, (item: string) => item) + }.width('100%') + .justifyContent(FlexAlign.SpaceEvenly) + .backgroundColor('#19000000') + + Column() { + Text('SideBarContainer content text1').fontSize(25) + Text('SideBarContainer content text2').fontSize(25) + Image($r('app.media.icon')) + } + .margin({ top: 50, left: 20, right: 30 }) + } + .id(item[0]) + .key(item[1]) + .controlButton({ + icons: { + hidden: $r('app.media.icon'), + shown: $r('app.media.icon'), + switching: $r('app.media.icon') + } + }) + .sideBarWidth(150) + .minSideBarWidth(50) + .maxSideBarWidth(300) + .minContentWidth(0) + .onChange((value: boolean) => { + console.info('status:' + value) + }) + .divider({ + strokeWidth: '1vp', + color: Color.Gray, + startMargin: '4vp', + endMargin: '4vp' + }) + .showSideBar(this.showSideBar) + .showControlButton(this.showControlButton) + + Button("showSideBar") + .onClick(() => { + this.showSideBar = !this.showSideBar + }) + Button("showControlButton") + .onClick(() => { + this.showControlButton = !this.showControlButton + }) + } + } + }) + } + } +} +} + diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper01.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper01.ets new file mode 100644 index 0000000000000000000000000000000000000000..c08985e28b961d007f19881a4a49065be74b1efa --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper01.ets @@ -0,0 +1,108 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Styles function itemStyle01 () { + .width(336) + .height(621) + .margin({ top: 48, left: 12 }) + .borderRadius(24) + .backgroundColor('#FFFFFF') +} + +@Extend(Text) function itemTextStyle01 () { + .fontColor('#182431') + .fontSize(36) + .fontWeight(500) + .opacity(0.4) + .margin({ top: 82, bottom: 40 }) +} + +@Entry +@Component +struct StepperExample { + @State currentIndex: number = 0 + @State firstState: ItemState = ItemState.Normal + @State secondState: ItemState = ItemState.Normal + @State thirdState: ItemState = ItemState.Normal + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_Stepper_id', ''], + ['', 'qzq_Stepper_key'], + ['qzq_Stepper_id', 'qzq_Stepper_key'], + ]; + build() { + Column(){ + Text("Stepper") + .fontSize(18) + Column(){ + Stepper({ + index: this.currentIndex + }) { + StepperItem() { + Column() { + Text('Page One') + .itemTextStyle01() + Button('change status:' + this.firstState) + .backgroundColor('#007dFF') + .onClick(() => { + this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip + }) + }.itemStyle01() + } + .nextLabel('Next') + .status(this.firstState) + + StepperItem() { + Column() { + Text('Page Two') + .itemTextStyle01() + Button('change status:' + this.secondState) + .backgroundColor('#007dFF') + .onClick(() => { + this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled + }) + }.itemStyle01() + } + .nextLabel('Next') + .prevLabel('Previous') + .status(this.secondState) + + StepperItem() { + Column() { + Text('Page Three') + .itemTextStyle01() + Button('change status:' + this.thirdState) + .backgroundColor('#007dFF') + .onClick(() => { + this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting + }) + }.itemStyle01() + } + .status(this.thirdState) + + StepperItem() { + Column() { + Text('Page Four') + .itemTextStyle01() + }.itemStyle01() + } + } + .id(this.idOrKeyArray[0][0]) + .key(this.idOrKeyArray[0][1]) + .backgroundColor('#F1F3F5') + + } + } + } +} \ No newline at end of file diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper02.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper02.ets new file mode 100644 index 0000000000000000000000000000000000000000..1f81100bfecccd03b4083011d6fb81a0e076a54f --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper02.ets @@ -0,0 +1,108 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Styles function itemStyle02 () { + .width(336) + .height(621) + .margin({ top: 48, left: 12 }) + .borderRadius(24) + .backgroundColor('#FFFFFF') +} + +@Extend(Text) function itemTextStyle02 () { + .fontColor('#182431') + .fontSize(36) + .fontWeight(500) + .opacity(0.4) + .margin({ top: 82, bottom: 40 }) +} + +@Entry +@Component +struct StepperExample02 { + @State currentIndex: number = 0 + @State firstState: ItemState = ItemState.Normal + @State secondState: ItemState = ItemState.Normal + @State thirdState: ItemState = ItemState.Normal + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_Stepper_id', ''], + ['', 'qzq_Stepper_key'], + ['qzq_Stepper_id', 'qzq_Stepper_key'], + ]; + build() { + Column(){ + Text("Stepper") + .fontSize(18) + Column(){ + Stepper({ + index: this.currentIndex + }) { + StepperItem() { + Column() { + Text('Page One') + .itemTextStyle02() + Button('change status:' + this.firstState) + .backgroundColor('#007dFF') + .onClick(() => { + this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip + }) + }.itemStyle02() + } + .nextLabel('Next') + .status(this.firstState) + + StepperItem() { + Column() { + Text('Page Two') + .itemTextStyle02() + Button('change status:' + this.secondState) + .backgroundColor('#007dFF') + .onClick(() => { + this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled + }) + }.itemStyle02() + } + .nextLabel('Next') + .prevLabel('Previous') + .status(this.secondState) + + StepperItem() { + Column() { + Text('Page Three') + .itemTextStyle02() + Button('change status:' + this.thirdState) + .backgroundColor('#007dFF') + .onClick(() => { + this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting + }) + }.itemStyle02() + } + .status(this.thirdState) + + StepperItem() { + Column() { + Text('Page Four') + .itemTextStyle02() + }.itemStyle02() + } + } + .id(this.idOrKeyArray[1][0]) + .key(this.idOrKeyArray[1][1]) + .backgroundColor('#F1F3F5') + + } + } + } +} \ No newline at end of file diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper03.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper03.ets new file mode 100644 index 0000000000000000000000000000000000000000..3a837789bdbd856e55600355c107481b69b701e4 --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper03.ets @@ -0,0 +1,108 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Styles function itemStyle03 () { + .width(336) + .height(621) + .margin({ top: 48, left: 12 }) + .borderRadius(24) + .backgroundColor('#FFFFFF') +} + +@Extend(Text) function itemTextStyle03 () { + .fontColor('#182431') + .fontSize(36) + .fontWeight(500) + .opacity(0.4) + .margin({ top: 82, bottom: 40 }) +} + +@Entry +@Component +struct StepperExample03 { + @State currentIndex: number = 0 + @State firstState: ItemState = ItemState.Normal + @State secondState: ItemState = ItemState.Normal + @State thirdState: ItemState = ItemState.Normal + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_Stepper_id', ''], + ['', 'qzq_Stepper_key'], + ['qzq_Stepper_id', 'qzq_Stepper_key'], + ]; + build() { + Column(){ + Text("Stepper") + .fontSize(18) + Column(){ + Stepper({ + index: this.currentIndex + }) { + StepperItem() { + Column() { + Text('Page One') + .itemTextStyle03() + Button('change status:' + this.firstState) + .backgroundColor('#007dFF') + .onClick(() => { + this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip + }) + }.itemStyle03() + } + .nextLabel('Next') + .status(this.firstState) + + StepperItem() { + Column() { + Text('Page Two') + .itemTextStyle03() + Button('change status:' + this.secondState) + .backgroundColor('#007dFF') + .onClick(() => { + this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled + }) + }.itemStyle03() + } + .nextLabel('Next') + .prevLabel('Previous') + .status(this.secondState) + + StepperItem() { + Column() { + Text('Page Three') + .itemTextStyle03() + Button('change status:' + this.thirdState) + .backgroundColor('#007dFF') + .onClick(() => { + this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting + }) + }.itemStyle03() + } + .status(this.thirdState) + + StepperItem() { + Column() { + Text('Page Four') + .itemTextStyle03() + }.itemStyle03() + } + } + .id(this.idOrKeyArray[2][0]) + .key(this.idOrKeyArray[2][1]) + .backgroundColor('#F1F3F5') + + } + } + } +} \ No newline at end of file diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper04.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper04.ets new file mode 100644 index 0000000000000000000000000000000000000000..8dc10f23b7f3b0aba76ff6980820aff6d87f20a2 --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Stepper/stepper04.ets @@ -0,0 +1,107 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +@Styles function itemStyle () { + .width(336) + .height(621) + .margin({ top: 48, left: 12 }) + .borderRadius(24) + .backgroundColor('#FFFFFF') +} + +@Extend(Text) function itemTextStyle () { + .fontColor('#182431') + .fontSize(36) + .fontWeight(500) + .opacity(0.4) + .margin({ top: 82, bottom: 40 }) +} + +@Entry +@Component +struct StepperExample04 { + @State currentIndex: number = 0 + @State firstState: ItemState = ItemState.Normal + @State secondState: ItemState = ItemState.Normal + @State thirdState: ItemState = ItemState.Normal + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_Stepper_id', ''], + ['', 'qzq_Stepper_key'], + ['qzq_Stepper_id', 'qzq_Stepper_key'], + ]; + build() { + Column(){ + Text("Stepper") + .fontSize(18) + Column(){ + Stepper({ + index: this.currentIndex + }) { + StepperItem() { + Column() { + Text('Page One') + .itemTextStyle() + Button('change status:' + this.firstState) + .backgroundColor('#007dFF') + .onClick(() => { + this.firstState = this.firstState === ItemState.Skip ? ItemState.Normal : ItemState.Skip + }) + }.itemStyle() + } + .nextLabel('Next') + .status(this.firstState) + + StepperItem() { + Column() { + Text('Page Two') + .itemTextStyle() + Button('change status:' + this.secondState) + .backgroundColor('#007dFF') + .onClick(() => { + this.secondState = this.secondState === ItemState.Disabled ? ItemState.Normal : ItemState.Disabled + }) + }.itemStyle() + } + .nextLabel('Next') + .prevLabel('Previous') + .status(this.secondState) + + StepperItem() { + Column() { + Text('Page Three') + .itemTextStyle() + Button('change status:' + this.thirdState) + .backgroundColor('#007dFF') + .onClick(() => { + this.thirdState = this.thirdState === ItemState.Waiting ? ItemState.Normal : ItemState.Waiting + }) + }.itemStyle() + } + .status(this.thirdState) + + StepperItem() { + Column() { + Text('Page Four') + .itemTextStyle() + }.itemStyle() + } + } + .id(this.idOrKeyArray[3][0]) + .key(this.idOrKeyArray[3][1]) + .backgroundColor('#F1F3F5') + } + } + } +} \ No newline at end of file diff --git a/function/arkui/inspector_test/entry/src/main/ets/pages/Video/video01.ets b/function/arkui/inspector_test/entry/src/main/ets/pages/Video/video01.ets new file mode 100644 index 0000000000000000000000000000000000000000..8afbdccc1e8c947f1c8b85ed81546433d24455ec --- /dev/null +++ b/function/arkui/inspector_test/entry/src/main/ets/pages/Video/video01.ets @@ -0,0 +1,143 @@ +/* + * Copyright (c) 2025 Shenzhen Kaihong Digital Industry Development Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import router from '@ohos.router' +@Entry +@Component +struct stepper01 { + private videoController: VideoController = new VideoController() + @State curRate: PlaybackSpeed = PlaybackSpeed.Speed_Forward_1_00_X + @State videoSrc: Resource = $r("app.media.test2") + @State previewUri: Resource = $r('app.media.foreground') + @State isAutoPlay: boolean = false + @State showControls: boolean = false + @State idOrKeyArray: Array> = [ + ['', ''], + ['qzq_video_id', ''], + ['', 'qzq_video_key'], + ['qzq_video_id', 'qzq_video_key'], + ]; + + build() { + Column() { + Text("Video") + .fontSize(18) + List({space:30}) { + ForEach(this.idOrKeyArray, (item: Array) => { + ListItem(){ + Column() { + Video({ + src: this.videoSrc, + previewUri: this.previewUri, + controller: this.videoController, + currentProgressRate: this.curRate, + }) + .width(300) + .height(210) + .autoPlay(this.isAutoPlay) + .muted(false) + .loop(false) + .controls(this.showControls) + .id(item[0]) + .key(item[1]) + .onStart(() => { + console.info('onStart') + }) + .onPause(() => { + console.info('onPause') + }) + .onFinish(() => { + console.info('onFinish') + }) + .onError(() => { + console.info('onError') + }) + .onStop(() => { + console.info('onStop') + }) + .onPrepared((e?: DurationObject) => { + if (e != undefined) { + console.info('onPrepared is ' + e.duration) + } + }) + .onSeeking((e?: TimeObject) => { + if (e != undefined) { + console.info('onSeeking is ' + e.time) + } + }) + .onSeeked((e?: TimeObject) => { + if (e != undefined) { + console.info('onSeeked is ' + e.time) + } + }) + .onUpdate((e?: TimeObject) => { + if (e != undefined) { + console.info('onUpdate is ' + e.time) + } + }) + Row() { + Button('src').onClick(() => { + this.videoSrc = $r('app.media.test1') + }).margin(5) + Button('previewUri').onClick(() => { + this.previewUri = $r('app.media.icon') + }).margin(5) + Button('controls').onClick(() => { + this.showControls = !this.showControls + }).margin(5) + } + + Row() { + Button('start').onClick(() => { + this.videoController.start() + }).margin(2) + Button('pause').onClick(() => { + this.videoController.pause() + }).margin(2) + Button('stop').onClick(() => { + this.videoController.stop() + }).margin(2) + Button('reset').onClick(() => { + this.videoController.reset() + }).margin(2) + Button('setTime').onClick(() => { + this.videoController.setCurrentTime(10, SeekMode.Accurate) + }).margin(2) + } + Row() { + Button('rate 0.75').onClick(() => { + this.curRate = PlaybackSpeed.Speed_Forward_0_75_X + }).margin(5) + Button('rate 1').onClick(() => { + this.curRate = PlaybackSpeed.Speed_Forward_1_00_X + }).margin(5) + Button('rate 2').onClick(() => { + this.curRate = PlaybackSpeed.Speed_Forward_2_00_X + }).margin(5) + } + } + } + }) + } + } + } +} +interface DurationObject { + duration: number; +} + +interface TimeObject { + time: number; +} \ No newline at end of file diff --git a/function/arkui/inspector_test/entry/src/main/resources/base/media/test1.mp4 b/function/arkui/inspector_test/entry/src/main/resources/base/media/test1.mp4 new file mode 100644 index 0000000000000000000000000000000000000000..1a9c91dc5903956c3e6a925c8758b77e623cf49f Binary files /dev/null and b/function/arkui/inspector_test/entry/src/main/resources/base/media/test1.mp4 differ diff --git a/function/arkui/inspector_test/entry/src/main/resources/base/media/test2.mp4 b/function/arkui/inspector_test/entry/src/main/resources/base/media/test2.mp4 new file mode 100644 index 0000000000000000000000000000000000000000..895cb24b6ae12cc1a9cc3a46b9d777a1ae912f63 Binary files /dev/null and b/function/arkui/inspector_test/entry/src/main/resources/base/media/test2.mp4 differ diff --git a/function/arkui/inspector_test/entry/src/main/resources/base/profile/main_pages.json b/function/arkui/inspector_test/entry/src/main/resources/base/profile/main_pages.json index c1d39bf6fa27f4043b3ec6c079dccc1aea0db73a..b2068a06295407c7a871c9e8edd1d8733ded51fc 100644 --- a/function/arkui/inspector_test/entry/src/main/resources/base/profile/main_pages.json +++ b/function/arkui/inspector_test/entry/src/main/resources/base/profile/main_pages.json @@ -7,6 +7,16 @@ "pages/Rating/rating01", "pages/Rating/ratingModifier", "pages/Select/select01", + + "pages/NavDestination/NavDestination01", + "pages/Navigation/navigation01", + "pages/SideBarContainer/SideBarContainer01", + "pages/Stepper/stepper01", + "pages/Stepper/stepper02", + "pages/Stepper/stepper03", + "pages/Stepper/stepper04", + "pages/Video/video01", + "pages/RichEditor/RichEditor01", "pages/Slider/slider01", "pages/Swiper/swiper01" ]