1import { ColorBlock, RadioBlock, SliderBlock } from 'common'; 2 3 4@Component 5export struct CompSheetTransitionBlocks { 6 @Link enableCompBindSheetIsShow: boolean; 7 @Link compBindSheetIsShow: boolean; 8 @Link enableCompBindSheetOptionsHeight: boolean; 9 @Link compBindSheetOptionsHeight: SheetSize; 10 @Link enableCompBindSheetOptionsDetents: boolean; 11 @Link compBindSheetOptionsDetents: [(SheetSize | Length), (SheetSize | Length)?, (SheetSize | Length)?]; 12 @Link enableCompBindSheetOptionsPreferType: boolean; 13 @Link compBindSheetOptionsPreferType: SheetType; 14 @Link enableCompBindSheetOptionsShowClose: boolean; 15 @Link compBindSheetOptionsShowClose: boolean; 16 @Link enableCompBindSheetOptionsDragBar: boolean; 17 @Link compBindSheetOptionsDragBar: boolean; 18 @Link enableCompBindSheetOptionsBlurStyle: boolean; 19 @Link compBindSheetOptionsBlurStyle: BlurStyle; 20 @Link enableCompBindSheetOptionsMaskColor: boolean; 21 @Link compBindSheetOptionsMaskColor: ResourceColor | undefined; 22 @Link enableCompBindSheetOptionsTitleTitle: boolean; 23 @Link compBindSheetOptionsTitleTitle: boolean; 24 @Link enableCompBindSheetOptionsTitleSubtitle: boolean; 25 @Link compBindSheetOptionsTitleSubtitle: boolean; 26 @Link enableCompBindSheetOptionsEnableOutsideInteractive: boolean; 27 @Link compBindSheetOptionsEnableOutsideInteractive: boolean; 28 @Link enableCompBindSheetOptionsBorderWidth: boolean; 29 @Link compBindSheetOptionsBorderWidth: number; 30 @Link enableCompBindSheetOptionsBorderColor: boolean; 31 @Link compBindSheetOptionsBorderColor: ResourceColor; 32 @Link enableCompBindSheetOptionsBorderStyle: boolean; 33 @Link compBindSheetOptionsBorderStyle: BorderStyle; 34 @Link enableCompBindSheetOptionWidth: boolean; 35 @Link compBindSheetOptionsWidth: number; 36 @Link enableCompBindSheetOptionShadow: boolean; 37 @Link compBindSheetOptionShadow: ShadowStyle; 38 @Link enableCompBindSheetOptionMode: boolean; 39 @Link compBindSheetOptionMode: SheetMode; 40 @Link enableCompBindSheetOptionScrollSizeMode: boolean; 41 @Link compBindSheetOptionScrollSizeMode: ScrollSizeMode; 42 43 build() { 44 Column() { 45 RadioBlock({ 46 title: 'bindSheet.isShow', 47 isEnabled: $enableCompBindSheetIsShow, 48 value: $compBindSheetIsShow, 49 dataSource: [ 50 { label: 'true', value: true }, 51 { label: 'false', value: false }, 52 ] 53 }) 54 if (this.enableCompBindSheetIsShow) { 55 RadioBlock({ 56 title: 'bindSheet.options.height', 57 isEnabled: $enableCompBindSheetOptionsHeight, 58 value: $compBindSheetOptionsHeight, 59 dataSource: [ 60 { label: 'MEDIUM', value: SheetSize.MEDIUM }, 61 { label: 'LARGE', value: SheetSize.LARGE }, 62 { label: 'FIT_CONTENT', value: SheetSize.FIT_CONTENT }, 63 ] 64 }) 65 RadioBlock({ 66 title: 'bindSheet.options.detents', 67 isEnabled: $enableCompBindSheetOptionsDetents, 68 value: $compBindSheetOptionsDetents, 69 dataSource: [ 70 { label: 'MEDIUM,LARGE,FIT_CONTENT', value: [SheetSize.MEDIUM, SheetSize.LARGE, SheetSize.FIT_CONTENT] }, 71 { label: 'LARGE,FIT_CONTENT', value: [SheetSize.LARGE, SheetSize.FIT_CONTENT] }, 72 { label: 'FIT_CONTENT', value: SheetSize.FIT_CONTENT }, 73 ] 74 }) 75 RadioBlock({ 76 title: 'bindSheet.options.preferType', 77 isEnabled: $enableCompBindSheetOptionsPreferType, 78 value: $compBindSheetOptionsPreferType, 79 dataSource: [ 80 { label: 'BOTTOM', value: SheetType.BOTTOM }, 81 { label: 'CENTER', value: SheetType.CENTER }, 82 { label: 'POPUP', value: SheetType.POPUP }, 83 ] 84 }) 85 RadioBlock({ 86 title: 'bindSheet.options.showClose', 87 isEnabled: $enableCompBindSheetOptionsShowClose, 88 value: $compBindSheetOptionsShowClose, 89 dataSource: [ 90 { label: 'true', value: true }, 91 { label: 'false', value: false }, 92 ] 93 }) 94 RadioBlock({ 95 title: 'bindSheet.options.dragBar', 96 isEnabled: $enableCompBindSheetOptionsDragBar, 97 value: $compBindSheetOptionsDragBar, 98 dataSource: [ 99 { label: 'true', value: true }, 100 { label: 'false', value: false }, 101 ] 102 }) 103 RadioBlock({ 104 title: 'bindSheet.options.blurStyle', 105 isEnabled: $enableCompBindSheetOptionsBlurStyle, 106 value: $compBindSheetOptionsBlurStyle, 107 dataSource: [ 108 { label: 'Thin', value: BlurStyle.Thin }, 109 { label: 'Regular', value: BlurStyle.Regular }, 110 { label: 'Thick', value: BlurStyle.Thick }, 111 { label: 'BACKGROUND_THIN', value: BlurStyle.BACKGROUND_THIN }, 112 { label: 'BACKGROUND_REGULAR', value: BlurStyle.BACKGROUND_REGULAR }, 113 { label: 'BACKGROUND_THICK', value: BlurStyle.BACKGROUND_THICK }, 114 { label: 'BACKGROUND_ULTRA_THICK', value: BlurStyle.BACKGROUND_ULTRA_THICK }, 115 { label: 'NONE', value: BlurStyle.NONE }, 116 { label: 'COMPONENT_ULTRA_THIN', value: BlurStyle.COMPONENT_ULTRA_THIN }, 117 { label: 'COMPONENT_THIN', value: BlurStyle.COMPONENT_THIN }, 118 { label: 'COMPONENT_REGULAR', value: BlurStyle.COMPONENT_REGULAR }, 119 { label: 'COMPONENT_THICK', value: BlurStyle.COMPONENT_THICK }, 120 { label: 'COMPONENT_ULTRA_THICK', value: BlurStyle.COMPONENT_ULTRA_THICK }, 121 ] 122 }) 123 ColorBlock({ 124 title: 'bindSheet.options.maskColor', 125 isEnabled: $enableCompBindSheetOptionsMaskColor, 126 color: $compBindSheetOptionsMaskColor 127 }) 128 RadioBlock({ 129 title: 'bindSheet.options.title.title', 130 isEnabled: $enableCompBindSheetOptionsTitleTitle, 131 value: $compBindSheetOptionsTitleTitle, 132 dataSource: [ 133 { label: 'true', value: true }, 134 { label: 'false', value: false }, 135 ] 136 }) 137 RadioBlock({ 138 title: 'bindSheet.options.title.subtitle', 139 isEnabled: $enableCompBindSheetOptionsTitleSubtitle, 140 value: $compBindSheetOptionsTitleSubtitle, 141 dataSource: [ 142 { label: 'true', value: true }, 143 { label: 'false', value: false }, 144 ] 145 }) 146 RadioBlock({ 147 title: 'bindSheet.options.enableOutsideInteractive', 148 isEnabled: $enableCompBindSheetOptionsEnableOutsideInteractive, 149 value: $compBindSheetOptionsEnableOutsideInteractive, 150 dataSource: [ 151 { label: 'true', value: true }, 152 { label: 'false', value: false }, 153 ] 154 }) 155 SliderBlock({ 156 title: 'bindSheet.options.borderWidth', 157 isEnabled: $enableCompBindSheetOptionsBorderWidth, 158 value: $compBindSheetOptionsBorderWidth, 159 min: 0, 160 max: 32 161 }) 162 ColorBlock({ 163 title: 'bindSheet.options.borderColor', 164 isEnabled: $enableCompBindSheetOptionsBorderColor, 165 color: $compBindSheetOptionsBorderColor 166 }) 167 RadioBlock({ 168 title: 'bindSheet.options.borderStyle', 169 isEnabled: $enableCompBindSheetOptionsBorderStyle, 170 value: $compBindSheetOptionsBorderStyle, 171 dataSource: [ 172 { label: 'Dotted', value: BorderStyle.Dotted }, 173 { label: 'Dashed', value: BorderStyle.Dashed }, 174 { label: 'Solid', value: BorderStyle.Solid } 175 ] 176 }) 177 SliderBlock({ 178 title: 'bindSheet.options.width', 179 isEnabled: $enableCompBindSheetOptionWidth, 180 value: $compBindSheetOptionsBorderWidth, 181 min: 0, 182 max: 32 183 }) 184 RadioBlock({ 185 title: 'bindSheet.options.shadow', 186 isEnabled: $enableCompBindSheetOptionShadow, 187 value: $compBindSheetOptionShadow, 188 dataSource: [ 189 { label: 'OUTER_DEFAULT_XS', value: ShadowStyle.OUTER_DEFAULT_XS }, 190 { label: 'OUTER_DEFAULT_SM', value: ShadowStyle.OUTER_DEFAULT_SM }, 191 { label: 'OUTER_DEFAULT_MD', value: ShadowStyle.OUTER_DEFAULT_MD }, 192 { label: 'OUTER_DEFAULT_LG', value: ShadowStyle.OUTER_DEFAULT_LG }, 193 { label: 'OUTER_FLOATING_SM', value: ShadowStyle.OUTER_FLOATING_SM }, 194 { label: 'OUTER_FLOATING_MD', value: ShadowStyle.OUTER_FLOATING_MD }, 195 ] 196 }) 197 RadioBlock({ 198 title: 'bindSheet.options.mode', 199 isEnabled: $enableCompBindSheetOptionMode, 200 value: $compBindSheetOptionMode, 201 dataSource: [ 202 { label: 'OVERLAY', value: SheetMode.OVERLAY }, 203 { label: 'EMBEDDED', value: SheetMode.EMBEDDED }, 204 ] 205 }) 206 RadioBlock({ 207 title: 'bindSheet.options.scrollSizeMode', 208 isEnabled: $enableCompBindSheetOptionScrollSizeMode, 209 value: $compBindSheetOptionScrollSizeMode, 210 dataSource: [ 211 { label: 'FOLLOW_DETENT', value: ScrollSizeMode.FOLLOW_DETENT }, 212 { label: 'CONTINUOUS', value: ScrollSizeMode.CONTINUOUS }, 213 ] 214 }) 215 } 216 } 217 } 218}