|
@@ -28,6 +28,7 @@ export interface ConfirmOptions {
|
|
|
export interface ListOptions<T> {
|
|
|
title?: string
|
|
|
cancel?: Btn
|
|
|
+ index?: number
|
|
|
alignment?: DialogAlignment
|
|
|
values: Array<T>
|
|
|
onSelected: (index: number, value: T) => void
|
|
@@ -43,22 +44,39 @@ function customDialogBuilder<T>(option: ListOptions<T>, dialogTag: string) {
|
|
|
|
|
|
Column() {
|
|
|
Text(option.title)
|
|
|
- .fontSize(13)
|
|
|
+ .fontSize(16)
|
|
|
+ .fontColor('#00BE87')
|
|
|
.textAlign(TextAlign.Center)
|
|
|
- .width('60%')
|
|
|
- .maxLines(2)
|
|
|
- .ellipsisMode(EllipsisMode.END)
|
|
|
- .textOverflow({
|
|
|
- overflow: TextOverflow.Ellipsis
|
|
|
+ .width('100%')
|
|
|
+ .height(60)
|
|
|
+ .backgroundColor('#F0FFFA')
|
|
|
+ .borderRadius({
|
|
|
+ topLeft: 10,
|
|
|
+ topRight: 10
|
|
|
})
|
|
|
.visibility(option.title ? Visibility.Visible : Visibility.None)
|
|
|
- List({ space: 20, initialIndex: 0 }) {
|
|
|
- ForEach(option.values, (item: T, index: number) => {
|
|
|
- ListItem() {
|
|
|
- Text(typeof item === "string" ? item : (item as ListItem).content)
|
|
|
+ Column(){
|
|
|
+ List() {
|
|
|
+ ForEach(option.values, (item: T, index: number) => {
|
|
|
+ ListItem() {
|
|
|
+ Row() {
|
|
|
+ Text(typeof item === "string" ? item : (item as ListItem).content)
|
|
|
+ .fontSize(option.index === index ? 16 : 14)
|
|
|
+ .fontWeight(option.index === index ? FontWeight.Bold : FontWeight.Normal)
|
|
|
+ .maxLines(1)
|
|
|
+ .width('70%')
|
|
|
+ .ellipsisMode(EllipsisMode.CENTER)
|
|
|
+ .textOverflow({
|
|
|
+ overflow: TextOverflow.Ellipsis
|
|
|
+ })
|
|
|
+ .textAlign(TextAlign.Center)
|
|
|
+ .align(Alignment.Center)
|
|
|
+ .fontColor('#11102C')
|
|
|
+ }
|
|
|
+ .alignItems(VerticalAlign.Center)
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
+ .height(60)
|
|
|
.width('100%')
|
|
|
- .fontSize(16)
|
|
|
- .textAlign(TextAlign.Center)
|
|
|
.onClick(() => {
|
|
|
if (ToolsHelper.mapDialog.get(dialogTag)) {
|
|
|
promptAction.closeCustomDialog(ToolsHelper.mapDialog.get(dialogTag))
|
|
@@ -66,29 +84,47 @@ function customDialogBuilder<T>(option: ListOptions<T>, dialogTag: string) {
|
|
|
}
|
|
|
option.onSelected(index, item)
|
|
|
})
|
|
|
+ }
|
|
|
+ }, (item: T) => typeof item === "string" ? item : (item as ListItem).content)
|
|
|
+ }
|
|
|
+ .listDirection(Axis.Vertical) // 排列方向
|
|
|
+ .scrollBar(BarState.Off)
|
|
|
+ .friction(0.6)
|
|
|
+ .divider({
|
|
|
+ strokeWidth: 1,
|
|
|
+ color: '#F6F6F6',
|
|
|
+ }) // 每行之间的分界线
|
|
|
+ .edgeEffect(EdgeEffect.Spring) // 边缘效果设置为Spring
|
|
|
+ .width('100%')
|
|
|
+ .height(option.values === undefined ? '20%' :option.values.length < 5 ? option.values.length*60 : 300)
|
|
|
+
|
|
|
+ if (option.cancel) {
|
|
|
+ Column() {
|
|
|
+ Text(option.cancel.text ?? '取消')
|
|
|
+ .fontSize(16)
|
|
|
+ .fontColor(option.cancel.color ?? '#777777')
|
|
|
+ .textAlign(TextAlign.Center)
|
|
|
+ .width(325)
|
|
|
+ .height(44)
|
|
|
+ .backgroundColor('white')
|
|
|
+ .borderRadius(22)
|
|
|
+ .borderWidth(1)
|
|
|
+ .borderColor('#D7D7D7')
|
|
|
}
|
|
|
- }, (item: string) => item)
|
|
|
- }
|
|
|
- .listDirection(Axis.Vertical) // 排列方向
|
|
|
- .scrollBar(BarState.Off)
|
|
|
- .friction(0.6)
|
|
|
- .divider({
|
|
|
- strokeWidth: 1,
|
|
|
- color: 0xEEEEEE,
|
|
|
- startMargin: 20,
|
|
|
- endMargin: 20
|
|
|
- }) // 每行之间的分界线
|
|
|
- .edgeEffect(EdgeEffect.Spring) // 边缘效果设置为Spring
|
|
|
- .width('100%')
|
|
|
- .height(option.values.length < 8 ? `${option.values.length / 16 * 100}%` : '50%')
|
|
|
- .margin({ top: 20 })
|
|
|
- }
|
|
|
- .padding({
|
|
|
- top: 20,
|
|
|
- bottom: 20,
|
|
|
- left: 20,
|
|
|
- right: 20
|
|
|
- })
|
|
|
+ .onClick(() => {
|
|
|
+ if (ToolsHelper.mapDialog.get(dialogTag)) {
|
|
|
+ promptAction.closeCustomDialog(ToolsHelper.mapDialog.get(dialogTag))
|
|
|
+ ToolsHelper.mapDialog.remove(dialogTag)
|
|
|
+ }
|
|
|
+ option.cancel?.onClick && option.cancel.onClick()
|
|
|
+ })
|
|
|
+ .height(71)
|
|
|
+ .width('100%')
|
|
|
+ .alignItems(HorizontalAlign.Center)
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
+ }
|
|
|
+ }.justifyContent(FlexAlign.End)
|
|
|
+ }.justifyContent(FlexAlign.Start)
|
|
|
}
|
|
|
|
|
|
interface ThrottleInterface {
|
|
@@ -236,8 +272,14 @@ export class ToolsHelper {
|
|
|
} else {
|
|
|
const dialogTag = ToolsHelper.getUuid()
|
|
|
promptAction.openCustomDialog({
|
|
|
+ cornerRadius: 0,
|
|
|
+ autoCancel: false,
|
|
|
+ width: '100%',
|
|
|
+ // height: options.values === undefined ? '20%' :
|
|
|
+ // options.values?.length < 8 ? `${options.values?.length / 16 * 100+10}%` : '50%',
|
|
|
alignment: options.alignment ?? DialogAlignment.Bottom,
|
|
|
- builder: customDialogBuilder.bind(p, options, dialogTag)
|
|
|
+ builder: customDialogBuilder.bind(p, options, dialogTag),
|
|
|
+ backgroundColor: 'white'
|
|
|
}).then((dialogId: number) => {
|
|
|
ToolsHelper.mapDialog.set(dialogTag, dialogId)
|
|
|
})
|