(Arkts界面示例)ets pages Demo(笔记版本0.0.1)
| 数据类型 | 概述 |
|---|---|
| number | 数值 |
| boolean | 布尔 |
| string | 字符串 |
| undefined | 一个未定义或不存在的值 |
| null | 空 |
| object | 对象 |
| Symbol | 独一无二的值 |
| bigint | 任意大的整数 |
| enum | 枚举 |
| any | 任意 |
| unknown | 未知类型 |
| void | 没有任何返回值的类型 |
| never | 永远不存在的类型 |
Index.ets 文件
import router from '@ohos.router'@Entry//表示该自定义组件为入口组件
@Component //表示自定义组件
struct Index {//表示组件中的状态变量，状态变量变化会触发UI刷新@State changeValue: string = ''@State submitValue: string = ''controller: SearchController = new SearchController()build() {Column() {Search({ value: this.changeValue, placeholder: 'file name', controller: this.controller }).searchButton('SEARCH').width(300).height(50).backgroundColor('#F5F5F5').placeholderColor(Color.Grey).placeholderFont({ size: 15, weight: 550 }).textFont({ size: 15, weight: 500 }).copyOption(CopyOptions.InApp).onSubmit((value: string) => {this.submitValue = valuerouter.pushUrl({url:'pages/'+this.submitValue})}).onChange((value: string) => {this.changeValue = value}).margin(20)}.width('100%')}
}hello.ets
import router from '@ohos.router'@Entry
@Component
struct hello{build() {Column({ space: 5 }) {Text('首页').onClick(() => {router.pushUrl({ url: 'pages/Index' })})Text('Hello worid').fontSize(20)}.width('100%').margin({top:10})}
}API参考 Search Flex布局 > pages/flex_n.ets > struct FlexExample
API参考 Search 边框设置 > pages/border_n.ets > struct BorderExample
API参考 Search 图片边框设置 > pages/image_border_setting_n1.ets >struct image_border_setting_n1
API参考 Search 图片边框设置 > pages/image_border_setting_n2.ets >struct image_border_setting_n2
API参考 Search 背景设置 > pages/background_n.ets >struct BackgroundExample
API参考 Search 透明度设置 > pages/opacity_n.ets >struct OpacityExample
API参考 Search 显隐控制 > pages/visibility_n.ets >struct VisibilityExample
API参考 Search 禁用控制 > pages/enabled_n.ets >struct EnabledExample
API参考 Search 浮层 > pages/overlay_n.ets >struct OverlayExample
API参考 Search Z序控制 > pages/zindex_n.ets >struct ZIndexExample
API参考 Search 图形变换 > pages/transform_n.ets >struct TransformExample
API参考 Search 图形效果 > pages/blur_n1.ets >struct BlurEffectsExample
API参考 Search 图形效果 > pages/image_effects_n2.ets >struct ImageEffectsExample
API参考 Search 形状裁剪 > pages/clip_and_mask_n.ets >struct ClipAndMaskExample
API参考 Search 文本样式设置 > pages/text_style_n.ets >struct TextStyleExample
API参考 Search 栅格设置 > pages/grid_container_n.ets >struct GridContainerExample1
API参考 Search 颜色渐变 > pages/color_gradient_n1.ets >struct ColorGradientExample
API参考 Search 颜色渐变 > pages/color_gradient_n2.ets >struct ColorGradientExample
API参考 Search 颜色渐变 > pages/color_gradient_n3.ets >struct ColorGradientExample
API参考 Search Popup控制 > pages/popup_n.ets >struct PopupExample
API参考 Search 菜单控制 > pages/menu_n1.ets >struct PopupExample
API参考 Search 菜单控制 > pages/menu_n2.ets >struct PopupExample
API参考 Search 菜单控制 > pages/menu_n3.ets >struct ContextMenuExample
API参考 Search 点击控制 > pages/touch_able.ets >struct TouchAbleExample
API参考 Search 焦点控制 > pages/focusable_n.ets >struct FocusableExample
API参考 Search 焦点控制 > pages/request_foucus_n2.ets >struct RequestFocusExample
API参考 Search 悬浮态效果 > pages/hover_n.ets >struct HoverExample
API参考 Search 组件标识 > pages/id_n.ets >struct IdExample
API参考 Search 触摸热区设置 > pages/touch_target_n.ets >struct TouchTargetExample
API参考 Search 多态样式 > pages/style_n.ets >struct StyleExample
API参考 Search 触摸测试样式 > pages/hit_test_behavior_n.ets >struct HitTestBehaviorExample
API参考 Search 分布式迁移标识 > pages/restore_id_n.ets >struct RestoreIdExample
API参考 Search 绑定手势方法 > pages/gesture_settings_n.ets >struct GestureSettingsExample
API参考 Search 绑定手势方法 > pages/gesture_settings_n.ets >struct GestureSettingsExample
API参考 Search 基础手势 > pages/gesture_settings_n.ets >struct GestureSettingsExample
API参考 Search 基础手势 > pages/tap_gesture_n.ets >struct TapGestureExample
API参考 Search 基础手势 > pages/long_press_n.ets >struct LongPressGestureExample
API参考 Search 基础手势 > pages/long.ets >struct LongPressGestureExample
API参考 Search 基础手势 > pages/pan_gesrure_n.ets >struct PanGestureExample
API参考 Search 基础手势 > pages/pan_gesrure_n.ets >struct PanGestureExample
API参考 Search 基础手势 > pages/rotation_gesrure_n.ets >struct RotationGesture
API参考 Search 基础手势 > pages/swipe_gesture_n.ets >struct SwipeGesture
API参考 Search 组合手势 > pages/gesture_group_n.ets >struct GestureGroupExample
API参考 Search 组合手势 > pages/gesture_group_n.ets >struct GestureGroupExample
AlphabetIndexer(字母 索引器 示例)
可以与容器组件联动用于按逻辑结构快速定位容器显示区域的组件。
API参考 Search AlphabetIndexer > pages/alphabel_indexer.ets >struct AlphabetIndexerSample
Blank(空白填充组件)
空白填充组件，在容器主轴方向上，空白填充组件具有自动填充容器空余部分的能力。仅当父组件为Row/Column/Flex时生效。
API参考 Search Blank 基础组件 > pages/bank_n.ets >struct BlankExample
Button(按钮组件)
按钮组件 可快速创建不同样式的按钮。
API参考 Search Button 基础组件 > pages/button_n1.ets >struct ButtonExample
API参考 Search Button 基础组件 > pages/button_n2.ets >struct SwipeGestureExample
Checkbox(多选框组件)
提供多选框组件，通常用于某选项的打开或关闭。
API参考 Search Checkbox 基础组件 > pages/checkbox_n.ets >struct CheckboxExample
CheckboxGroup(多选框群组)
多选框群组，用于控制多选框全选或者不全选状态。
API参考 Search CheckboxGroup 基础组件 > pages/checkbox_group_n.ets >struct CheckboxGroup
DataPanel(数据面板组件)
数据面板组件，用于将多个数据占比情况使用占比图进行展示。
API参考 Search DataPanel 基础组件 > pages/data_panel_n.ets >struct DataPanel
DatePicker(日期选择器组件)
日期选择器组件，用于根据指定日期范围创建日期滑动选择器。
API参考 Search DatePicker 基础组件 > pages/data_picker_n.ets >struct DatePickerExample
Divider(分隔器组件)
提供分隔器组件，分隔不同内容块/内容元素。
API参考 Search Divider 基础组件 > pages/divider_n.ets >struct DividerExample
Gauge(数据量规图表组)
数据量规图表组件，用于将数据展示为环形图表。
API参考 Search Gauge 基础组件 > pages/gauge_n.ets >struct GaugeExample
Image
图片组件，支持本地图片和网络图片的渲染展示。
API参考 Search Image 基础组件 > pages/image_n1.ets >struct ImageExample1
API参考 Search Image 基础组件 > pages/image_n2.ets >struct Index
API参考 Search Image 基础组件 > pages/image_n3.ets >struct ImageExample2
API参考 Search Image 基础组件 > pages/image_n4.ets >struct ImageExample2
API参考 Search Image 基础组件 > pages/image_n5.ets >struct ImageExample2