• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1import {
2  memo,
3  __memo_context_type,
4  __memo_id_type,
5  AppStorage,
6  State,
7  StateDecoratedVariable,
8  MutableState,
9  stateOf,
10  observableProxy
11} from '@ohos.arkui.stateManagement' // should be insert by ui-plugins
12
13import hilog from '@ohos.hilog'
14import {
15  $r,
16  Entry,
17  Text,
18  TextInput,
19  Curve,
20  ResourceColor,
21  NavPathStack,
22  NavDestination,
23  Scroll,
24  SheetMode,
25  LengthMetrics,
26  BlurStyle,
27  HoverModeAreaType,
28  TranslateOptions,
29  SheetKeyboardAvoidMode,
30  DismissContentCoverAction,
31  ShadowType,
32  EdgeColors,
33  BorderStyle,
34  EdgeStyles,
35  LocalizedEdgeColors,
36  CustomBuilder,
37  SheetTitleOptions,
38  EdgeWidths,
39  LocalizedEdgeWidths,
40  ScrollSizeMode,
41  ShadowStyle,
42  ShadowOptions,
43  TextAttribute,
44  Column,
45  DismissReason,
46  Component,
47  Callback,
48  Row,
49  Button,
50  SheetDismiss,
51  SpringBackAction,
52  ButtonAttribute,
53  animateTo,
54  Color,
55  Dimension,
56  Resource,
57  ModalTransition,
58  DismissSheetAction,
59  ContentCoverOptions,
60  SheetSize,
61  Length,
62  SheetType,
63  SheetOptions,
64  TransitionEffect,
65  ClickEvent,
66  UserView ,
67  Builder,
68  NavDestinationContext
69} from '@ohos.arkui.component'  // TextAttribute should be insert by ui-plugins
70
71import { UIContext } from '@ohos.arkui.UIContext';
72
73
74@Entry
75@Component
76export struct BindContentCoverTest {
77  @State stateVar: string = 'state var';
78  @State showVal: boolean =false;
79  @State showVal1: boolean =false;
80  @State showVal2: boolean =false;
81
82  @State height: SheetSize|Length = SheetSize.LARGE
83  @State width:Dimension = '80%'
84  @State showDragBar:boolean = true
85  @State sheetType: SheetType = SheetType.BOTTOM
86  @State showClose:boolean|Resource = true
87
88
89  @State scrollSizeMode: ScrollSizeMode = ScrollSizeMode.FOLLOW_DETENT
90  @State mode:SheetMode = SheetMode.OVERLAY
91
92  @State blurStyle: BlurStyle = BlurStyle.NONE
93  @State maskColor: ResourceColor = Color.Red
94
95  @State enableOutsideInteractive: boolean = true
96  @State shadowStyle: ShadowStyle|ShadowOptions = ShadowStyle.OUTER_DEFAULT_SM
97
98  @State borderStyle:	BorderStyle | EdgeStyles = BorderStyle.Dashed
99  @State borderColor: ResourceColor | EdgeColors | LocalizedEdgeColors =  Color.Green
100  @State borderWidth: undefined|EdgeWidths|LocalizedEdgeWidths|String|Resource|Double = '2vp'
101  @State title:SheetTitleOptions | CustomBuilder = { title: $r('app.string.mytitle'), subtitle: $r('app.string.app_name') } as SheetTitleOptions
102  @State hoverModeArea: HoverModeAreaType = HoverModeAreaType.BOTTOM_SCREEN
103  @State keyboardAvoidMode: SheetKeyboardAvoidMode = SheetKeyboardAvoidMode.NONE
104  @State modalTransition:ModalTransition =ModalTransition.DEFAULT
105
106  @State fontSize:number = 20
107
108  @Builder
109  SheetBuilder() {
110    Column(undefined) {
111      Text('1111')
112      Text('1111')
113      Text('1111')
114      Text('1111')
115      Button('close bindContentCover').onClick((e: ClickEvent) => {
116        this.showVal1 = false
117        this.showVal = false
118      })
119      TextInput({text: ''})
120      TextInput({text: ''})
121      TextInput({text: ''})
122      TextInput({text: ''})
123      TextInput({text: ''})
124      TextInput({text: ''})
125      TextInput({text: ''})
126      TextInput({text: ''})
127      TextInput({text: ''})
128      TextInput({text: ''})
129    }
130  }
131
132  build() {
133    NavDestination() {
134      Scroll() {
135        Column(undefined) {
136          Row() {
137            Button('ModalTransition.ALPHA').onClick((e: ClickEvent) => {
138              this.modalTransition = ModalTransition.ALPHA
139            }).fontSize(10)
140          }
141
142          Button('bindContentCover')
143            .onClick((e: ClickEvent) => {
144              this.showVal1 = true
145            })
146            .backgroundColor('#FFFF00FF')
147            .bindContentCover(this.showVal1, this.SheetBuilder,
148              {
149                modalTransition: this.modalTransition,
150                backgroundColor: Color.Yellow,
151                onAppear: () => {
152                  hilog.info(0x0000, 'xhq', 'bindContentCover onAppear');
153                },
154                onWillAppear: () => {
155                  hilog.info(0x0000, 'xhq', 'bindContentCover onWillAppear');
156                },
157                onWillDisappear: () => {
158                  hilog.info(0x0000, 'xhq', 'bindContentCover onWillDisappear');
159                },
160                onDisappear: () => {
161                  this.showVal1 = false
162                  hilog.info(0x0000, 'xhq', 'bindContentCover onDisappear');
163                }
164              } as ContentCoverOptions)
165        }.width('100%').height('100%')
166      }.width('100%').height('100%')
167    }
168    .title('模态类组件测试001')
169  }
170}
171
172@Component
173struct Child {
174  @State stateVar: string = 'Child';
175  build() {
176    Text(this.stateVar).fontSize(50)
177  }
178}
179