TestCalculate

/** * 计算器 / @Entry @Component struct Calculator{ /创建数组，用来设置计算器按钮上显示的内容/ private buttonTexts = [ 'AC' , 'Del' , '+/-' , '/' , '7' , '8' , '9' , '' , '4' , '5' , '6' , '-' , '1' , '2' , '3' , '+' , '%' , '0' , '.' , '=' ] @State displayText: string = '0' @State firstOperand: number | null = null @State operator: string | null = null @State waitingForSecondOperand: boolean = false /构件界面/ build() { /添加列/ Column(){ /--------------------------添加第一列 上面空白的部分/ Column(){ }/设置列的样式/ .width('100%') .height('10%') /-------------------------------添加第二列 输入框/ Column(){ /添加文本框用来输入计算/ TextInput() .fontSize(70) .height('80%')/设置文本框的高度/ .textAlign(TextAlign.End)/设置文本框的对齐方式 输入显示在右边/ .backgroundColor(Color.White) .fontColor(Color.Black) .padding({right:20}) }/设置列的样式/ .width('100%') .height('35%') .backgroundColor(Color.White) /------------------------------------添加第三列 按钮框/ Column(){ /添加网格组件/ Grid(){ /循环创建计算器的按钮 同时设置按钮上显示的内容/ ForEach(this.buttonTexts, (item: string , index) => { /添加网格项/ GridItem(){ /添加按钮/ Button(item) .width('100%')/设置按钮的宽度/ .height('100%')/设置按钮的高度/ .fontSize(30)/设置按钮的字体大小/ .borderRadius(50)/设置按钮的圆角/ .backgroundColor(this.setButtonBackgroundColor(item))/设置按钮的背景颜色/ .fontColor(this.setButtonFontColor( item))/设置按钮的字体颜色/ .onClick(()=>{ //this.handleButonClick(item) }) } }) }/设置网格的样式/ .columnsTemplate('1fr 1fr 1fr 1fr')/设置4列的模板/ .rowsTemplate('1fr 1fr 1fr 1fr 1fr')/设置5行的模板/ .columnsGap(10) .rowsGap(10) }/设置列的样式/ .width('95%') .height('55%') .margin(10)/设置列的边距/ }/设置列的样式/ .width('100%') .height('100%') } /创建函数用来处理按钮点击事件//* handleButonClick(item: string) { switch (item) { case 'AC': this.displayText = '0' this.firstOperand = null this.Operand = null this.waitingForSecondOperand = false break case 'Del': if (this.displayText.length > 1 ) { this.displayText = this.displayText.slice(0, -1) } else { this.displayText = '0'; } break case '+/-': const currentValue = parseFloat(this.displayText); this.displayText = String(currentValue * -1) break case '%': const currentValue = parseFloat(this.displayText); this.displayText = String(percentValue); break case '.': if (!this.displayText.includes('.')) { this.displayText += '.' } break case '=': if (this.operator && this.firstOperand !== null) { const secondOperand = parseFloat(this.displayText) let result = 0 switch (this.operator) { case '+': result = this.firstOperand + secondOperand break case '-': result = this.firstOperand - secondOperand break case '': result = this.firstOperand * secondOperand break case '/': result = secondOperand !== 0 ? this.firstOperand / secondOperand : 0 break } this.displayText = String(result) this.firstOperand = result this.operator = null this.waitingForSecondOperand = false } break default: if (this.waitingForSecondOperand) { this.displayText = item this.waitingForSecondOperand = false } else { this.displayText = this.displayText === '0' ? item : this.displayText + item } break } }/ /*** * 设置按钮背景颜色 / setButtonBackgroundColor(item: string) { /分支判断/ switch (item) { case '/': case '': case '-': case '+': return '#ffef8282'; case '=': return '#ffdd4637'; default: return '#ededed'; } } /** * 创建函数用来设置按钮上显示的内容的颜色 / setButtonFontColor(item: string){ switch( item){ case 'AC': case 'Del': case '+/-': case '/': case '': case '-': case '+': return '#ffef3c3c'; case '=': return '#ffffffff'; default: return '#ff000000'; } } } WWechat import { window } from '@kit.ArkUI' import { MyPage } from '../component/Mypage' import { WechatPage } from '../component/WechatPage' /** * @Description: 微信主页面 * @Author: khc * @Date: 2026/3/30 9:15 * @Version: 1.0 / @Entry @Component struct Home{ /创建变量，用来获取点击选项时选项的索引值/ @State selectedIndex: number = 0 aboutToAppear(): void { /设置全铺整个屏幕/ window.getLastWindow(getContext(),(error,win)=>{ win.setWindowLayoutFullScreen(true) }) } /构造界面/ build() { /添加列/ Column(){ /添加选项卡组件 1: barPosition: BarPosition.End在底部显示 index:指定默认选中的选项 指定选项的索引/ Tabs({barPosition: BarPosition.End,index: this.selectedIndex}){ /-----------------------------------微信*/ TabContent(){ /调用微信页面/ //WechatPage() /添加列/ Column(){ }/设置列的样式/ .width('100%') .height('100%') .backgroundColor(Color.Red) }/设置选项的标题/ //.tabBar('微信') .tabBar(this.buildTabBar(0,'微信',$r('app.media.wechat1'),$r('app.media.wechat2'))) /------------------------------------通讯录/ TabContent(){ /添加列/ Column(){ }/设置列的样式/ .width('100%') .height('100%') .backgroundColor(Color.Green) }/设置选项的标题/ //.tabBar('通讯录') .tabBar(this.buildTabBar(1,'通讯录',$r('app.media.contacts1'),$r('app.media.contacts2'))) /------------------------------------------发现/ TabContent(){ /添加列/ Column(){ }/设置列的样式/ .width('100%') .height('100%') .backgroundColor(Color.Blue) }/设置选项的标题/ //.tabBar('发现') .tabBar(this.buildTabBar(2,'发现',$r('app.media.find1'),$r('app.media.find2'))) /------------------------------------------我/ TabContent(){ /调用MyPage主页面/ //MyPage() /添加列/ Column(){ }/设置列的样式/ .width('100%') .height('100%') .backgroundColor(Color.White) }/设置选项的标题/ //.tabBar('我') .tabBar(this.buildTabBar(3,'我',$r('app.media.me1'),$r('app.media.me2'))) }/设置Tabs的样式/ .onChange((index: number)=>{/index就是选中的选项的索引/ /把选中的索引保存到selectedIndex中/ this.selectedIndex = index }) }/设置列的样式/ .width('100%')/设置列的宽度/ .height('100%')/设置列的高度/ } /** * 创建选项中的内容 * index 选项的索引 * title 标题 * icon 默认的图标 * selection 选中时的图标 * */ @Builder buildTabBar(index: number,title: string,icon: Resource,selection: Resource ){ /添加列/ Column(){ /添加图标/ Image(this.selectedIndex == index ? selection:icon) .width(30) .height(30) /添加标题/ Text(title) .fontColor(this.selectedIndex == index ? Color.Green:'') }/设置列的样式/ .width('100%') .height('65%') } }