diff --git a/entry/src/main/ets/pages/btnRowTab.ets b/entry/src/main/ets/pages/btnRowTab.ets deleted file mode 100644 index 6609eb32..00000000 --- a/entry/src/main/ets/pages/btnRowTab.ets +++ /dev/null @@ -1,79 +0,0 @@ -import { hilog } from '@kit.PerformanceAnalysisKit'; - -export class ToolButton{ - //功能 - str:string=''; - //图标 - icon:string=''; - //按钮提示 - tips:string=''; - //事件 - event:string=''; -} - -@ComponentV2 -export struct BtnRowTab { - @Param rowsBtn: Array>>=new Array>>; - @Param rightBtn:Array>=new Array>; - @Builder - ToolsMenu(menus:Array) { - Menu() { - ForEach(menus,(item:ToolButton, index: number)=>{ - MenuItem({ startIcon: $r('app.media.startIcon'), content: item.str }) - .width('150') - .margin({ top: 2,left:2,bottom:2,right:2}) - }) - } - } - @Builder - TButton(strIcon:string,strName:string){ - Column(){ - // 请将$r('app.media.loading')替换为实际资源文件 - Image($r('app.media.startIcon')) - .width(50) - .height(40) - .objectFit(ImageFit.Contain) - Text(strName) - .fontSize(12) - .width(50) - .height(10) - .textAlign(TextAlign.Center) - } - .height('50') - .width('50') - .padding('1') - } - build() { - Column({space: 5}){ - ForEach(this.rowsBtn,(rowBtn:Array>, index: number)=>{ - Row({ space: 2 }) { - ForEach(rowBtn,(btn:ToolButton|Array, index: number)=>{ - if (Array.isArray(btn)) { - if(( btn as Array).length>0){ - Button(( btn as Array)[0].str) - .bindMenu(this.ToolsMenu(( btn as Array))) - .height('50') - .width('50') - .padding('1') - //.type(ButtonType.Normal) - } - }else{ - this.TButton((btn as ToolButton).icon,(btn as ToolButton).str); - } - }) - } - }) - }.margin({ top: 2,left:2,bottom:2,right:2}) - .padding('1') - .onMouse((event: MouseEvent) => { - if (event) { - // 鼠标右键菜单事件 - switch (event.button) { - case MouseButton.Right: - - break; - } - } - }) - } -} \ No newline at end of file diff --git a/entry/src/main/ets/pages/rowBtnTab.ets b/entry/src/main/ets/pages/rowBtnTab.ets new file mode 100644 index 00000000..21675921 --- /dev/null +++ b/entry/src/main/ets/pages/rowBtnTab.ets @@ -0,0 +1,143 @@ +import { hilog } from '@kit.PerformanceAnalysisKit'; + +export class ToolButton{ + //功能 + str:string=''; + //图标 + icon:string=''; + //按钮提示 + tips:string=''; + //事件 + event:string=''; +} + +export class RowBtn{ + str:string='' + btnGroup:Array>=new Array> +} + +class XMenu{ + str:string='' + icon:string='' + event:string='' +} +let xMenu:Array=[ + {str:'增功能',icon:'',event:''}, + {str:'编辑组',icon:'',event:''}, + {str:'改图标',icon:'',event:''}, + {str:'重命名',icon:'',event:''}, + {str:'移动到->',icon:'',event:''} +] +@ComponentV2 +export struct RowBtnTab { + @Param rowsBtn: Array = new Array; + @Param rightBtn: Array> = new Array>; + + @Builder + ToolsMenu(menus: Array) { + Menu() { + ForEach(menus, (item: ToolButton, index: number) => { + MenuItem({ startIcon: $r('app.media.startIcon'), content: item.str }) + .width('150') + .margin({ + top: 0, + left: 0, + bottom: 0, + right: 0 + }) + }) + } + } + + @Builder + TButton(strIcon: string, strName: string) { + Column() { + // 请将$r('app.media.loading')替换为实际资源文件 + Image($r('app.media.startIcon')) + .width(50) + .height(40) + .objectFit(ImageFit.Contain) + Text(strName) + .fontSize(12) + .width(50) + .height(10) + .textAlign(TextAlign.Center) + } + .height('50') + .width('50') + .padding('1') + } + + @Builder + XMenu(menus: Array) { + Menu() { + ForEach(menus, (item: ToolButton, index: number) => { + MenuItem({ startIcon: $r('app.media.startIcon'), content: item.str }) + .width('150') + .margin({ + top: 0, + left: 0, + bottom: 0, + right: 0 + }) + }) + } + } + + build() { + //单页的TabContent布局.垂直布局 + Column({ space: 2 }) { + //迭代生成垂直布局中的行布局 + ForEach(this.rowsBtn, (rowBtn: RowBtn, index: number) => { + //每一行的布局 + Row(){ + Column({ space: 5 }) { + //Group的按钮组 + Column(){ + //每个Group和非Group的横向布局 + Row(){ + ForEach(rowBtn.btnGroup,(btn:ToolButton|Array, index: number)=>{ + if (Array.isArray(btn)) { + if ((btn as Array).length > 0) { + Button((btn as Array)[0].str) + .bindMenu(this.ToolsMenu((btn as Array))) + .height('50') + .width('50') + .padding('1') + .type(ButtonType.Normal) + } + } + else + { + this.TButton((btn as ToolButton).icon, (btn as ToolButton).str); + } + }) + }.padding('1') + .margin({ top: 0,left:0,bottom:0,right:0}) + } + + Column(){ + Text(rowBtn.str) + .fontSize(8) + .fontColor(Color.Gray) + }.padding('1') + }.margin({ top: 0,left:0,bottom:0,right:0}) + .padding('1') + Column(){ + Button('X') + .fontColor(Color.Gray) + .fontSize(8) + .width(8) + .height(70) + .padding(1) + .type(ButtonType.Normal) + .align(Alignment.BottomEnd) + .bindMenu(this.XMenu(xMenu)) + .backgroundColor(Color.Transparent) + } + }.borderWidth('1') + .borderRadius(5) + }) + } + } +} \ No newline at end of file diff --git a/entry/src/main/ets/pages/titleTab.ets b/entry/src/main/ets/pages/titleTab.ets index 4d267498..e0670ce8 100644 --- a/entry/src/main/ets/pages/titleTab.ets +++ b/entry/src/main/ets/pages/titleTab.ets @@ -1,11 +1,12 @@ import { hilog } from '@kit.PerformanceAnalysisKit'; import { ArrayList } from '@kit.ArkTS'; import { AddFormMenuItem } from '@ohos.arkui.advanced.FormMenu'; -import {ToolButton,BtnRowTab}from './btnRowTab' +import {ToolButton,RowBtnTab,RowBtn}from './rowBtnTab' import { SceneResourceType } from '@kit.ArkGraphics3D'; const DOMAIN = 0x0000; + class TitleTabName { //标题 str: string=''; @@ -16,7 +17,7 @@ class TitleTabName { //提示 tips:string=''; //Content的内容 - rowsBtn:Array>>=new Array>>; + rowsBtn:Array=new Array; } //测试数据 @@ -25,72 +26,42 @@ let testPagInfo:Array=[ {str:'文件',icon:'',page:'',tips:'',rowsBtn:[]}, //第二个tab {str:'主页',icon:'',page:'',tips:'',rowsBtn:[ - //第一行按钮组 - [ - //第一个按钮 - {str:'新建',icon:'',tips:'',event:''} as ToolButton, - {str:'打开',icon:'',tips:'',event:''} as ToolButton, - [ - {str:'功能',icon:'',tips:'',event:''} as ToolButton, - {str:'功能1',icon:'',tips:'',event:''} as ToolButton, - {str:'功能2',icon:'',tips:'',event:''} as ToolButton, - {str:'功能3',icon:'',tips:'',event:''} as ToolButton, - ] as Array, - {str:'设置',icon:'',tips:'',event:''} as ToolButton, - ] as Array, - //第二行按钮组 - [ - //第一个按钮 - {str:'首选',icon:'',tips:'',event:''} as ToolButton, - {str:'保存',icon:'',tips:'',event:''} as ToolButton, - [ - {str:'功能',icon:'',tips:'',event:''} as ToolButton, - {str:'功能1',icon:'',tips:'',event:''} as ToolButton, - {str:'功能2',icon:'',tips:'',event:''} as ToolButton, - {str:'功能3',icon:'',tips:'',event:''} as ToolButton, - ] as Array, + //第一行按钮 + { str:'操作',btnGroup:[ + {str:'新建',icon:'',tips:'',event:''} as ToolButton, + {str:'打开',icon:'',tips:'',event:''} as ToolButton, + [ + {str:'转换',icon:'',tips:'',event:''} as ToolButton, + {str:'功能1',icon:'',tips:'',event:''} as ToolButton, + {str:'功能2',icon:'',tips:'',event:''} as ToolButton, + {str:'功能3',icon:'',tips:'',event:''} as ToolButton, + ], + {str:'设置',icon:'',tips:'',event:''} as ToolButton, + ], + }, + { str:'操作',btnGroup:[ + {str:'重置',icon:'',tips:'',event:''} as ToolButton, {str:'删除',icon:'',tips:'',event:''} as ToolButton, - ] as Array, - ]}, - {str:'曲线',icon:'',page:'',tips:'',rowsBtn:[ - [ [ - {str:'文本',icon:'',tips:'',event:''} as ToolButton, - {str:'点',icon:'',tips:'',event:''} as ToolButton, - {str:'直线',icon:'',tips:'',event:''} as ToolButton, - {str:'圆弧/圆',icon:'',tips:'',event:''} as ToolButton, - ] as Array, - {str:'艺术样条',icon:'',tips:'',event:''} as ToolButton, - {str:'曲面上的曲线',icon:'',tips:'',event:''} as ToolButton, - {str:'脊线',icon:'',tips:'',event:''} as ToolButton, - {str:'投影曲线',icon:'',tips:'',event:''} as ToolButton, - {str:'组合投影',icon:'',tips:'',event:''} as ToolButton, + {str:'格式',icon:'',tips:'',event:''} as ToolButton, + {str:'功能1',icon:'',tips:'',event:''} as ToolButton, + {str:'功能2',icon:'',tips:'',event:''} as ToolButton, + {str:'功能3',icon:'',tips:'',event:''} as ToolButton, + ], + {str:'设置',icon:'',tips:'',event:''} as ToolButton, ], - [ - [ - {str:'曲线编辑',icon:'',tips:'',event:''} as ToolButton, - {str:'延申曲线',icon:'',tips:'',event:''} as ToolButton, - {str:'桥接',icon:'',tips:'',event:''} as ToolButton, - {str:'镜像曲线',icon:'',tips:'',event:''} as ToolButton, - ] as Array, - {str:'曲线编辑',icon:'',tips:'',event:''} as ToolButton, - {str:'延申曲线',icon:'',tips:'',event:''} as ToolButton, - {str:'桥接曲线',icon:'',tips:'',event:''} as ToolButton, - {str:'抛物线',icon:'',tips:'',event:''} as ToolButton, - {str:'镜像曲线',icon:'',tips:'',event:''} as ToolButton, + } ] - ]}, + }, + {str:'曲线',icon:'',page:'',tips:'',rowsBtn:[]}, {str:'曲面',icon:'',page:'',tips:'',rowsBtn:[]}, {str:'装配',icon:'',page:'',tips:'',rowsBtn:[]}, - {str:'多边建模',icon:'',page:'',tips:'',rowsBtn:[]}, + {str:'多边形建模',icon:'',page:'',tips:'',rowsBtn:[]}, {str:'分析',icon:'',page:'',tips:'',rowsBtn:[]}, {str:'选择',icon:'',page:'',tips:'',rowsBtn:[]}, {str:'显示',icon:'',page:'',tips:'',rowsBtn:[]}, {str:'工具',icon:'',page:'',tips:'',rowsBtn:[]}, {str:'应用模块',icon:'',page:'',tips:'',rowsBtn:[]}, - {str:'设置',icon:'',page:'',tips:'',rowsBtn:[]}, - {str:'帮助',icon:'',page:'',tips:'',rowsBtn:[]}, - {str:'关于',icon:'',page:'',tips:'',rowsBtn:[]}, ] @Component @@ -140,12 +111,14 @@ export struct TitleTab { Tabs({barPosition: BarPosition.Start, index: this.titleBarDefaultFocusIndex,controller: this.titleBarTabs}){ ForEach(this.titleBarTabsName,(item:TitleTabName, index: number)=>{ TabContent() { - BtnRowTab({rowsBtn:item.rowsBtn}); + RowBtnTab({rowsBtn:item.rowsBtn}) }.align(Alignment.Start) - .margin({ top: 2,left:2,bottom:2,right:2}) + .padding(1) + .borderWidth('1') + .margin({ top: 0,left:0,bottom:2,right:0}) }) }.barHeight(0) - .margin({ top: 2,left:2,bottom:2,right:2}) + .margin({ top: 0,left:0,bottom:0,right:0}) .height('auto') .barMode(BarMode.Fixed) }.borderWidth('1')