|
@@ -1,5 +1,7 @@
|
|
|
import { IBestToast, YTAvoid, yTRouter, yTToast } from 'basic'
|
|
import { IBestToast, YTAvoid, yTRouter, yTToast } from 'basic'
|
|
|
|
|
+import { DiaLogPageEnum, DiaLogParam, YTDiaLogModel } from 'basic/src/main/ets/models/YTDiaLogModel'
|
|
|
import { CellStorage } from '.'
|
|
import { CellStorage } from '.'
|
|
|
|
|
+import { TurnTableRouteParams } from '../../model/Index'
|
|
|
import { ReNameInput } from './ReNameInput'
|
|
import { ReNameInput } from './ReNameInput'
|
|
|
import { Cell, Sector } from './Sector'
|
|
import { Cell, Sector } from './Sector'
|
|
|
|
|
|
|
@@ -108,29 +110,7 @@ export struct BigWheelView{
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
if(this.selected.length==this.cells.length){
|
|
if(this.selected.length==this.cells.length){
|
|
|
- yTToast.doubleConfirm({
|
|
|
|
|
- message: '当前已经转完所有,是否重置', click: () => {
|
|
|
|
|
- //背景色变成白色
|
|
|
|
|
- this.cells.forEach((item)=>{
|
|
|
|
|
- item.color='#fff'
|
|
|
|
|
- })
|
|
|
|
|
- //重置,所有的转盘重新开始
|
|
|
|
|
- this.selected=[]
|
|
|
|
|
- this.UnSelected=[]
|
|
|
|
|
- this.UnSelected=this.cells
|
|
|
|
|
- this.DBUnselectCell=this.UnSelected.map(item=>item.id)
|
|
|
|
|
- this.DBSelectCell=[]
|
|
|
|
|
- this.DBCells=this.cells.map((item)=>{
|
|
|
|
|
- return {
|
|
|
|
|
- id:item.id,
|
|
|
|
|
- title:item.title,
|
|
|
|
|
- proportion:item.proportion,
|
|
|
|
|
- color:item.color
|
|
|
|
|
- } as CellStorage
|
|
|
|
|
- })
|
|
|
|
|
- yTToast.hide()
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
|
|
+ this.isReloadDiaLog()
|
|
|
return
|
|
return
|
|
|
}
|
|
}
|
|
|
//如果都已经被选了,则不能再转了
|
|
//如果都已经被选了,则不能再转了
|
|
@@ -240,46 +220,253 @@ export struct BigWheelView{
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+ // 打开设置弹窗
|
|
|
|
|
+ openSettingDiaLog(){
|
|
|
|
|
+ let param: DiaLogParam = {
|
|
|
|
|
+ align: YTDiaLogModel.Center,
|
|
|
|
|
+ pageEnum: DiaLogPageEnum.TurnTableSetting,
|
|
|
|
|
+ param: {
|
|
|
|
|
+ generics: {
|
|
|
|
|
+ isRepeat: this.isRepeat,
|
|
|
|
|
+ spinDurationTime: this.spinDurationTime,
|
|
|
|
|
+ spinDuration: this.spinDuration
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ yTRouter.router2NaviDiaLog(param, (ans)=>{
|
|
|
|
|
+ let res = ans.result as string
|
|
|
|
|
+ if(res) {
|
|
|
|
|
+ let obj = JSON.parse(res) as TurnTableRouteParams
|
|
|
|
|
+ this.isRepeat = obj.isRepeat ?? this.isRepeat
|
|
|
|
|
+ this.spinDurationTime = obj.spinDurationTime ?? this.spinDurationTime
|
|
|
|
|
+ this.spinDuration = obj.spinDuration ?? this.spinDuration
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 打开重命名转盘
|
|
|
|
|
+ openRenameDiaLog(){
|
|
|
|
|
+ let cellList: string[] = this.cells.map((item) => item.title)
|
|
|
|
|
+
|
|
|
|
|
+ let param: DiaLogParam = {
|
|
|
|
|
+ align: YTDiaLogModel.Center,
|
|
|
|
|
+ pageEnum: DiaLogPageEnum.TurnTableName,
|
|
|
|
|
+ param: {
|
|
|
|
|
+ generics: cellList
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ yTRouter.router2NaviDiaLog(param, (ans)=>{
|
|
|
|
|
+ let res = ans.result as string
|
|
|
|
|
+ if(res) {
|
|
|
|
|
+ let obj = JSON.parse(res) as string[]
|
|
|
|
|
+ this.cells.forEach((item,index) => {
|
|
|
|
|
+ item.title = obj[index]
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 询问是否重置转盘
|
|
|
|
|
+ isReloadDiaLog(){
|
|
|
|
|
+ let param: DiaLogParam = {
|
|
|
|
|
+ align: YTDiaLogModel.Center,
|
|
|
|
|
+ pageEnum: DiaLogPageEnum.Confirm,
|
|
|
|
|
+ param: {
|
|
|
|
|
+ text: '所有选项已转完,请确定是否重置转盘',
|
|
|
|
|
+ color: '#95C50A',
|
|
|
|
|
+ number: 8
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ yTRouter.router2NaviDiaLog(param, (ans)=>{
|
|
|
|
|
+ let res = ans.result as string
|
|
|
|
|
+ if(res == 'true') {
|
|
|
|
|
+ this.resetTurnTable()
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 重置转盘
|
|
|
|
|
+ resetTurnTable(){
|
|
|
|
|
+ //背景色变成白色
|
|
|
|
|
+ this.cells.forEach((item)=>{
|
|
|
|
|
+ item.color='#fff'
|
|
|
|
|
+ })
|
|
|
|
|
+ //重置,所有的转盘重新开始
|
|
|
|
|
+ this.selected=[]
|
|
|
|
|
+ this.UnSelected=[]
|
|
|
|
|
+ this.UnSelected=this.cells
|
|
|
|
|
+ this.DBUnselectCell=this.UnSelected.map(item=>item.id)
|
|
|
|
|
+ this.DBSelectCell=[]
|
|
|
|
|
+ this.DBCells=this.cells.map((item)=>{
|
|
|
|
|
+ return {
|
|
|
|
|
+ id:item.id,
|
|
|
|
|
+ title:item.title,
|
|
|
|
|
+ proportion:item.proportion,
|
|
|
|
|
+ color:item.color
|
|
|
|
|
+ } as CellStorage
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
build() {
|
|
build() {
|
|
|
- Stack({alignContent:Alignment.Center}){
|
|
|
|
|
- Stack({alignContent:Alignment.Top}){
|
|
|
|
|
|
|
+ Column() {
|
|
|
|
|
+ // 标题
|
|
|
|
|
+ Row(){
|
|
|
|
|
+ Text()
|
|
|
|
|
+
|
|
|
|
|
+ Text('大转盘')
|
|
|
|
|
+ .fontSize(18)
|
|
|
|
|
+ .fontWeight(700)
|
|
|
|
|
+ .fontColor(Color.Black)
|
|
|
|
|
+ Image($r('app.media.Subtract'))
|
|
|
|
|
+ .width(24)
|
|
|
|
|
+ .margin({right: 16 })
|
|
|
|
|
+ .onClick(()=>{
|
|
|
|
|
+ this.isShow=true
|
|
|
|
|
+ this.openSettingDiaLog()
|
|
|
|
|
+ })
|
|
|
|
|
+ }.width('100%')
|
|
|
|
|
+ .height(84)
|
|
|
|
|
+ .justifyContent(FlexAlign.SpaceBetween)
|
|
|
|
|
+ .padding({ top: 44 })
|
|
|
|
|
+ .margin({bottom:20})
|
|
|
|
|
+
|
|
|
|
|
+ // 重置按钮
|
|
|
|
|
+ Row(){
|
|
|
|
|
+ Text('重置')
|
|
|
|
|
+ .borderRadius(8)
|
|
|
|
|
+ .fontColor(Color.White)
|
|
|
|
|
+ .backgroundColor('#95C50A')
|
|
|
|
|
+ .padding({left: 12, right:12, top: 8, bottom: 8})
|
|
|
|
|
+ .onClick(() => { this.resetTurnTable() })
|
|
|
|
|
+ }
|
|
|
|
|
+ .width('100%')
|
|
|
|
|
+ .justifyContent(FlexAlign.End)
|
|
|
|
|
+ .padding({left:30,right:30})
|
|
|
|
|
+
|
|
|
|
|
+ // 显示当前状态
|
|
|
|
|
+ Text(this.isAnimating ? '旋转中' : `${this.selectedName}`)
|
|
|
|
|
+ .fontSize(20)
|
|
|
|
|
+ .fontColor("#0b0e15")
|
|
|
|
|
+ .height(40)
|
|
|
|
|
+ .margin({top:30, bottom: 30})
|
|
|
|
|
+
|
|
|
|
|
+ // 转盘主体
|
|
|
|
|
+ Stack() {
|
|
|
|
|
+ Stack() {
|
|
|
|
|
+ // 遍历每个单元格并绘制扇形
|
|
|
|
|
+ ForEach(this.cells, (cell: Cell) => {
|
|
|
|
|
+ Stack() {
|
|
|
|
|
+ Sector({ radius: lpx2px(this.wheelWidth-15), angle: cell.angle, color: cell.color }); // 创建扇形
|
|
|
|
|
+ Text(cell.title).fontColor(Color.Black).fontWeight(700).margin({ bottom: this.wheelWidth / 1.4 }); // 显示单元格标题
|
|
|
|
|
+ }.width('100%').height('100%').rotate({ angle: cell.rotate }); // 设置宽度和高度,并旋转
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ .borderRadius('50%') // 设置圆角
|
|
|
|
|
+ .width(this.wheelWidth) // 设置转盘宽度
|
|
|
|
|
+ .height(this.wheelWidth) // 设置转盘高度
|
|
|
|
|
+ .rotate({ angle: this.currentAngle }); // 旋转转盘
|
|
|
|
|
+
|
|
|
Column() {
|
|
Column() {
|
|
|
- // YTHeader({ title: '大转盘', })
|
|
|
|
|
- Row(){
|
|
|
|
|
- Image($r('[basic].media.ic_back'))
|
|
|
|
|
- .width(24)
|
|
|
|
|
- .margin({ left: 16 })
|
|
|
|
|
- .onClick(()=>{
|
|
|
|
|
- yTRouter.routerBack()
|
|
|
|
|
- })
|
|
|
|
|
- Text('大转盘')
|
|
|
|
|
- .fontSize(18)
|
|
|
|
|
- .fontWeight(700)
|
|
|
|
|
- .fontColor(Color.Black)
|
|
|
|
|
- Image($r('app.media.Subtract'))
|
|
|
|
|
- .width(24)
|
|
|
|
|
- .margin({right: 16 })
|
|
|
|
|
- .onClick(()=>{
|
|
|
|
|
- this.isShow=true
|
|
|
|
|
- })
|
|
|
|
|
- }.width('100%')
|
|
|
|
|
- .height(84)
|
|
|
|
|
- .justifyContent(FlexAlign.SpaceBetween)
|
|
|
|
|
- .padding({ top: 44 })
|
|
|
|
|
- .margin({bottom:20})
|
|
|
|
|
- Row(){
|
|
|
|
|
- Column(){}.width(24).height(24)
|
|
|
|
|
- // Image($r('[basic].media.voicemuisc')).width(24)
|
|
|
|
|
- Text('重置').fontColor('rgba(0, 0, 0, 0.65)').onClick(()=>{
|
|
|
|
|
- //背景色变成白色
|
|
|
|
|
- this.cells.forEach((item)=>{
|
|
|
|
|
- item.color='#fff'
|
|
|
|
|
- })
|
|
|
|
|
|
|
+ Canvas(this.context)
|
|
|
|
|
+ .width(250)
|
|
|
|
|
+ .height(250)
|
|
|
|
|
+ .borderRadius('50%')
|
|
|
|
|
+ .backgroundColor(Color.Transparent)
|
|
|
|
|
+ .onReady(() => {
|
|
|
|
|
+ this.drawCircleWithCustomRadii()
|
|
|
|
|
+ })
|
|
|
|
|
+ } .width(this.wheelWidth) // 设置转盘宽度
|
|
|
|
|
+ .height(this.wheelWidth) // 设置转盘高度
|
|
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
|
|
+ .rotate({ angle: this.currentAngle }) // 旋转转盘
|
|
|
|
|
+
|
|
|
|
|
+ Image($r('app.media.zhizheng'))
|
|
|
|
|
+ .width(63) // 设置按钮宽度
|
|
|
|
|
+ .height(79) // 设置按钮高度
|
|
|
|
|
+ .objectFit(ImageFit.Contain)
|
|
|
|
|
+ .offset({y: -10})
|
|
|
|
|
+ .clickEffect({ level: ClickEffectLevel.LIGHT }) // 设置点击效果
|
|
|
|
|
+
|
|
|
|
|
+ }
|
|
|
|
|
+ .width(this.wheelWidth+35)
|
|
|
|
|
+ .height(this.wheelWidth+35)
|
|
|
|
|
+ .padding(20)
|
|
|
|
|
+ .backgroundImage($r('app.media.xuanzhuankuang'))
|
|
|
|
|
+ .backgroundImageSize({width:'100%',height:'100%'})
|
|
|
|
|
+ .backgroundImagePosition(Alignment.Center)
|
|
|
|
|
+
|
|
|
|
|
+ // 按钮
|
|
|
|
|
+ Button('转一转').fontColor(Color.White)
|
|
|
|
|
+ .width(246)
|
|
|
|
|
+ .height(44)
|
|
|
|
|
+ .borderRadius(8)
|
|
|
|
|
+ .backgroundColor('#95C50A')
|
|
|
|
|
+ .margin({top:80,bottom:30})
|
|
|
|
|
+ .onClick(()=>{
|
|
|
|
|
+ this.startAnimation()
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
|
|
+ // 大转盘的选择的项数切换
|
|
|
|
|
+ Row({space:15}) {
|
|
|
|
|
+ ForEach([2,3,4,5],(item:number,index:number)=>{
|
|
|
|
|
+ Text((item+1).toString())
|
|
|
|
|
+ .width(40)
|
|
|
|
|
+ .height(40)
|
|
|
|
|
+ .textAlign(TextAlign.Center)
|
|
|
|
|
+ .borderRadius('50%')
|
|
|
|
|
+ .backgroundColor(this.currSelectNumber == index ? '#95C50A' : '#F5F5F7')
|
|
|
|
|
+ .onClick(()=>{
|
|
|
|
|
+ this.currSelectNumber=index
|
|
|
|
|
+ this.number=item+1
|
|
|
|
|
+ const arr=this.cells
|
|
|
|
|
+ this.cells=[]
|
|
|
|
|
+ // 如果选中的长度比之前要长
|
|
|
|
|
+ if(this.number>arr.length) {
|
|
|
|
|
+ for (let i = 0; i < this.number; i++) {
|
|
|
|
|
+ if (i < arr.length) {
|
|
|
|
|
+ this.cells.push(arr[i])
|
|
|
|
|
+ }else{
|
|
|
|
|
+ this.cells.push(new Cell(i + 1, 1, "转盘" + (i + 1), '#fff'));
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }else{
|
|
|
|
|
+ //短
|
|
|
|
|
+ for (let i = 0; i < this.number; i++) {
|
|
|
|
|
+ this.cells.push(arr[i])
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ //要继承之前没选中的,选中的数组根据id
|
|
|
|
|
+ this.calculateAngles(); // 重新计算角度
|
|
|
|
|
+ //选中的和没选中的也要重新计算角度
|
|
|
|
|
+ //找到id重新过滤
|
|
|
this.selected=[]
|
|
this.selected=[]
|
|
|
this.UnSelected=[]
|
|
this.UnSelected=[]
|
|
|
- this.UnSelected=this.cells
|
|
|
|
|
|
|
+ //每次选择扇形数量都要重新更新一下
|
|
|
|
|
+ let a=[] as number[]
|
|
|
|
|
+ let b=[] as number[]
|
|
|
|
|
+ //先获取选中数组,没选中数组id
|
|
|
|
|
+ a=this.DBSelectCell
|
|
|
|
|
+ b=this.DBUnselectCell
|
|
|
|
|
+ //遍历扇形,获取选中数组和没选中数组
|
|
|
|
|
+ for (let i = 0; i < this.cells.length; i++) {
|
|
|
|
|
+ for(let j=0;j<a.length;j++){
|
|
|
|
|
+ if(a[j]==this.cells[i].id){
|
|
|
|
|
+ this.selected.push(this.cells[i])
|
|
|
|
|
+ continue
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ //找到选中的id数组
|
|
|
|
|
+ this.DBSelectCell=this.selected.map(item=>item.id)
|
|
|
|
|
+ this.UnSelected=this.cells.filter((item)=>{
|
|
|
|
|
+ return !this.DBSelectCell.includes(item.id)
|
|
|
|
|
+ })
|
|
|
this.DBUnselectCell=this.UnSelected.map(item=>item.id)
|
|
this.DBUnselectCell=this.UnSelected.map(item=>item.id)
|
|
|
- this.DBSelectCell=[]
|
|
|
|
|
|
|
+ this.DBCells=[]
|
|
|
this.DBCells=this.cells.map((item)=>{
|
|
this.DBCells=this.cells.map((item)=>{
|
|
|
return {
|
|
return {
|
|
|
id:item.id,
|
|
id:item.id,
|
|
@@ -289,158 +476,28 @@ export struct BigWheelView{
|
|
|
} as CellStorage
|
|
} as CellStorage
|
|
|
})
|
|
})
|
|
|
})
|
|
})
|
|
|
- }.width('100%')
|
|
|
|
|
- .justifyContent(FlexAlign.SpaceBetween)
|
|
|
|
|
- .padding({left:30,right:30})
|
|
|
|
|
- // 显示当前状态
|
|
|
|
|
- Text(this.isAnimating ? '旋转中' : `${this.selectedName}`)
|
|
|
|
|
- .fontSize(20)
|
|
|
|
|
- .fontColor("#0b0e15")
|
|
|
|
|
- .height(40)
|
|
|
|
|
- .margin({top:100})
|
|
|
|
|
- Stack() {
|
|
|
|
|
- Stack() {
|
|
|
|
|
- // 遍历每个单元格并绘制扇形
|
|
|
|
|
- ForEach(this.cells, (cell: Cell) => {
|
|
|
|
|
- Stack() {
|
|
|
|
|
- Sector({ radius: lpx2px(this.wheelWidth-15), angle: cell.angle, color: cell.color }); // 创建扇形
|
|
|
|
|
- Text(cell.title).fontColor(Color.Black).fontWeight(700).margin({ bottom: this.wheelWidth / 1.4 }); // 显示单元格标题
|
|
|
|
|
- }.width('100%').height('100%').rotate({ angle: cell.rotate }); // 设置宽度和高度,并旋转
|
|
|
|
|
- });
|
|
|
|
|
- }
|
|
|
|
|
- .borderRadius('50%') // 设置圆角
|
|
|
|
|
- // .backgroundColor(Color.Gray) // 设置背景颜色
|
|
|
|
|
- .width(this.wheelWidth) // 设置转盘宽度
|
|
|
|
|
- .height(this.wheelWidth) // 设置转盘高度
|
|
|
|
|
- .rotate({ angle: this.currentAngle }); // 旋转转盘
|
|
|
|
|
- Column() {
|
|
|
|
|
- Canvas(this.context)
|
|
|
|
|
- .width(250)
|
|
|
|
|
- .height(250)
|
|
|
|
|
- .borderRadius('50%')
|
|
|
|
|
- .backgroundColor(Color.Transparent)
|
|
|
|
|
- .onReady(() => {
|
|
|
|
|
- this.drawCircleWithCustomRadii()
|
|
|
|
|
- })
|
|
|
|
|
- } .width(this.wheelWidth) // 设置转盘宽度
|
|
|
|
|
- .height(this.wheelWidth) // 设置转盘高度
|
|
|
|
|
- .justifyContent(FlexAlign.Center)
|
|
|
|
|
- .rotate({ angle: this.currentAngle }) // 旋转转盘
|
|
|
|
|
- Image($r('app.media.zhizheng'))
|
|
|
|
|
- .width(63) // 设置按钮宽度
|
|
|
|
|
- .height(79) // 设置按钮高度
|
|
|
|
|
- .objectFit(ImageFit.Contain)
|
|
|
|
|
- .clickEffect({ level: ClickEffectLevel.LIGHT }) // 设置点击效果
|
|
|
|
|
- }
|
|
|
|
|
- .width(this.wheelWidth+15)
|
|
|
|
|
- .height(this.wheelWidth+15)
|
|
|
|
|
- .backgroundImage($r('app.media.xuanzhuankuang'))
|
|
|
|
|
- .backgroundImageSize({width:'100%',height:'100%'})
|
|
|
|
|
- .backgroundImagePosition(Alignment.Center)
|
|
|
|
|
- Button('转一转').fontColor(Color.White)
|
|
|
|
|
- .backgroundColor('#fd54e3').width(246)
|
|
|
|
|
- .height(44).borderRadius(24)
|
|
|
|
|
- .margin({top:99,bottom:48})
|
|
|
|
|
- .onClick(()=>{
|
|
|
|
|
- this.startAnimation()
|
|
|
|
|
- })
|
|
|
|
|
- Row({space:15}) {
|
|
|
|
|
- ForEach([2,3,4,5],(item:number,index:number)=>{
|
|
|
|
|
- Text((item+1).toString())
|
|
|
|
|
- .width(40)
|
|
|
|
|
- .height(40)
|
|
|
|
|
- .textAlign(TextAlign.Center)
|
|
|
|
|
- .border({width:1,color:'#000000'})
|
|
|
|
|
- .borderRadius('50%')
|
|
|
|
|
- .backgroundColor(this.currSelectNumber==index?'#bff2ff':'#f2f2f2')
|
|
|
|
|
- .onClick(()=>{
|
|
|
|
|
- this.currSelectNumber=index
|
|
|
|
|
- this.number=item+1
|
|
|
|
|
- const arr=this.cells
|
|
|
|
|
- this.cells=[]
|
|
|
|
|
- //如果选中的长度比之前要长
|
|
|
|
|
- if(this.number>arr.length) {
|
|
|
|
|
- for (let i = 0; i < this.number; i++) {
|
|
|
|
|
- if (i < arr.length) {
|
|
|
|
|
- this.cells.push(arr[i])
|
|
|
|
|
- }else{
|
|
|
|
|
- this.cells.push(new Cell(i + 1, 1, "转盘" + (i + 1), '#fff'));
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }else{
|
|
|
|
|
- //短
|
|
|
|
|
- for (let i = 0; i < this.number; i++) {
|
|
|
|
|
- this.cells.push(arr[i])
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- //要继承之前没选中的,选中的数组根据id
|
|
|
|
|
- this.calculateAngles(); // 重新计算角度
|
|
|
|
|
- //选中的和没选中的也要重新计算角度
|
|
|
|
|
- //找到id重新过滤
|
|
|
|
|
- this.selected=[]
|
|
|
|
|
- this.UnSelected=[]
|
|
|
|
|
- //每次选择扇形数量都要重新更新一下
|
|
|
|
|
- let a=[] as number[]
|
|
|
|
|
- let b=[] as number[]
|
|
|
|
|
- //先获取选中数组,没选中数组id
|
|
|
|
|
- a=this.DBSelectCell
|
|
|
|
|
- b=this.DBUnselectCell
|
|
|
|
|
- //遍历扇形,获取选中数组和没选中数组
|
|
|
|
|
- for (let i = 0; i < this.cells.length; i++) {
|
|
|
|
|
- for(let j=0;j<a.length;j++){
|
|
|
|
|
- if(a[j]==this.cells[i].id){
|
|
|
|
|
- this.selected.push(this.cells[i])
|
|
|
|
|
- continue
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- //找到选中的id数组
|
|
|
|
|
- this.DBSelectCell=this.selected.map(item=>item.id)
|
|
|
|
|
- this.UnSelected=this.cells.filter((item)=>{
|
|
|
|
|
- return !this.DBSelectCell.includes(item.id)
|
|
|
|
|
- })
|
|
|
|
|
- this.DBUnselectCell=this.UnSelected.map(item=>item.id)
|
|
|
|
|
- this.DBCells=[]
|
|
|
|
|
- this.DBCells=this.cells.map((item)=>{
|
|
|
|
|
- return {
|
|
|
|
|
- id:item.id,
|
|
|
|
|
- title:item.title,
|
|
|
|
|
- proportion:item.proportion,
|
|
|
|
|
- color:item.color
|
|
|
|
|
- } as CellStorage
|
|
|
|
|
- })
|
|
|
|
|
- })
|
|
|
|
|
- })
|
|
|
|
|
- Row(){
|
|
|
|
|
- Image($r('app.media.zidingyi')).width(16)
|
|
|
|
|
- Text('命名').fontSize(12).fontColor(Color.White)
|
|
|
|
|
- }.width(64)
|
|
|
|
|
- .height(40)
|
|
|
|
|
- .borderRadius(20)
|
|
|
|
|
- .backgroundColor('rgba(255, 157, 240, 1)')
|
|
|
|
|
- .justifyContent(FlexAlign.Center)
|
|
|
|
|
- .onClick(()=>{
|
|
|
|
|
- this.isshowRename=true
|
|
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
- }.width('100%').padding({ bottom: this.safeBottom })
|
|
|
|
|
- .justifyContent(FlexAlign.Center).onClick(()=>{
|
|
|
|
|
- this.isShow=false
|
|
|
|
|
})
|
|
})
|
|
|
- //是否展示选项设置
|
|
|
|
|
- if(this.isShow) {
|
|
|
|
|
- this.BigWheelManagerBuilder()
|
|
|
|
|
-
|
|
|
|
|
- }
|
|
|
|
|
- }.height('100%')
|
|
|
|
|
- .backgroundImage($r('app.media.backimgNumber'))
|
|
|
|
|
- .backgroundImageSize({width:'100%',height:'100%'})
|
|
|
|
|
- //重命名设置
|
|
|
|
|
- if(this.isshowRename) {
|
|
|
|
|
- this.ReNameBuilder()
|
|
|
|
|
|
|
|
|
|
|
|
+ // 选项命名
|
|
|
|
|
+ Row(){
|
|
|
|
|
+ Image($r('app.media.zidingyi')).width(16)
|
|
|
|
|
+ Text('命名').fontSize(12).fontColor(Color.White)
|
|
|
|
|
+ }.width(64)
|
|
|
|
|
+ .height(40)
|
|
|
|
|
+ .borderRadius(20)
|
|
|
|
|
+ .backgroundColor('#95C50A')
|
|
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
|
|
+ .onClick(()=>{
|
|
|
|
|
+ this.isshowRename=true
|
|
|
|
|
+ this.openRenameDiaLog()
|
|
|
|
|
+ })
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+ .width('100%')
|
|
|
|
|
+ .padding({ bottom: this.safeBottom })
|
|
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
|
|
+ // .backgroundImage($r('app.media.backimgNumber'))
|
|
|
|
|
+ // .backgroundImageSize({width:'100%',height:'100%'})
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
@Builder
|
|
@Builder
|
|
@@ -486,93 +543,5 @@ export struct BigWheelView{
|
|
|
|
|
|
|
|
}.width('100%').height('100%').justifyContent(FlexAlign.Center).backgroundColor('rgba(30, 30, 30,0.5)')
|
|
}.width('100%').height('100%').justifyContent(FlexAlign.Center).backgroundColor('rgba(30, 30, 30,0.5)')
|
|
|
}
|
|
}
|
|
|
- @Builder
|
|
|
|
|
- BigWheelManagerBuilder(){
|
|
|
|
|
- Column() {
|
|
|
|
|
- //允许结果是否重复
|
|
|
|
|
- Row() {
|
|
|
|
|
- Row({ space: 10 }) {
|
|
|
|
|
- Image($r('app.media.qiehuan')).width(24)
|
|
|
|
|
- Text('允许结果重复').fontWeight(700)
|
|
|
|
|
- }
|
|
|
|
|
- Row() {
|
|
|
|
|
- Toggle({ type: ToggleType.Switch ,isOn:$$this.isRepeat})
|
|
|
|
|
- .width(38)
|
|
|
|
|
- .height(20)
|
|
|
|
|
- .selectedColor('rgba(253, 84, 227, 1)') //打开状态下的背景颜色
|
|
|
|
|
- .switchStyle({
|
|
|
|
|
- pointRadius: 8, //圆形滑块半径
|
|
|
|
|
- trackBorderRadius: 14, //滑轨的圆角
|
|
|
|
|
- pointColor: Color.White, //圆形滑块颜色 switchPointColor不生效
|
|
|
|
|
- unselectedColor: 'rgba(233, 233, 234, 1)' //关闭状态的背景颜色
|
|
|
|
|
- })
|
|
|
|
|
- .onClick(() => {
|
|
|
|
|
- this.isRepeat=!this.isRepeat
|
|
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .width('100%')
|
|
|
|
|
- .height(40)
|
|
|
|
|
- .backgroundColor(Color.White)
|
|
|
|
|
- .borderRadius(8)
|
|
|
|
|
- .justifyContent(FlexAlign.SpaceBetween)
|
|
|
|
|
- .padding({ left: 12, right: 12 })
|
|
|
|
|
- .alignItems(VerticalAlign.Center)
|
|
|
|
|
- Row() {
|
|
|
|
|
- Text('每次转动轮盘可能会随机选中相同的选项').fontSize(12).fontColor('rgba(0, 0, 0, 0.45)')
|
|
|
|
|
- }.width('100%')
|
|
|
|
|
- .justifyContent(FlexAlign.Start)
|
|
|
|
|
- .padding({ left: 22 })
|
|
|
|
|
- .margin({ bottom: 25, top: 10 })
|
|
|
|
|
-
|
|
|
|
|
- Row() {
|
|
|
|
|
- Row({ space: 10 }) {
|
|
|
|
|
- Image($r('app.media.xuanzhuantime')).width(24)
|
|
|
|
|
- Text('旋转时长').fontWeight(700)
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- Row() {
|
|
|
|
|
-
|
|
|
|
|
- Counter() {
|
|
|
|
|
- Text(this.spinDurationTime.toString() + 's').border({ width: 0 })
|
|
|
|
|
- }
|
|
|
|
|
- .onInc(() => {
|
|
|
|
|
- this.spinDurationTime++
|
|
|
|
|
- this.spinDuration = this.spinDurationTime * 1000
|
|
|
|
|
- })
|
|
|
|
|
- .onDec(() => {
|
|
|
|
|
- if(this.spinDurationTime==1){
|
|
|
|
|
- IBestToast.show({
|
|
|
|
|
- message:'秒数最低为1秒'
|
|
|
|
|
- })
|
|
|
|
|
- return
|
|
|
|
|
- }
|
|
|
|
|
- this.spinDurationTime--
|
|
|
|
|
- this.spinDuration = this.spinDurationTime * 1000
|
|
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- }
|
|
|
|
|
- .width('100%')
|
|
|
|
|
- .height(40)
|
|
|
|
|
- .backgroundColor(Color.White)
|
|
|
|
|
- .borderRadius(8)
|
|
|
|
|
- .justifyContent(FlexAlign.SpaceBetween)
|
|
|
|
|
- .padding({ left: 12, right: 12 })
|
|
|
|
|
- .alignItems(VerticalAlign.Center)
|
|
|
|
|
-
|
|
|
|
|
- }
|
|
|
|
|
- .width('100%')
|
|
|
|
|
- .height(214)
|
|
|
|
|
- .padding({ left: 22, top: 56, right: 22 })
|
|
|
|
|
- .borderRadius({ bottomLeft: 20, bottomRight: 20 })
|
|
|
|
|
- .linearGradient({
|
|
|
|
|
- angle: 135,
|
|
|
|
|
- colors: [
|
|
|
|
|
- ['rgba(239, 144, 237, 1)', 0.2],
|
|
|
|
|
- ['rgba(191, 242, 255, 1)', 1]
|
|
|
|
|
- ]
|
|
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
}
|
|
}
|
|
|
|
|
+
|