ArkTS 組件
組件 通用事件 速查表
通用事件 | 事件名稱 | 簡要說明 |
---|---|---|
點擊事件 | onClick(event: Callback<ClickEvent>, distanceThreshold: number): T | 相較于原有 onClick 接口,新增 distanceThreshold 參數作為點擊事件移動閾值,當手指的移動距離超出所設置的點擊手勢移動閾值時,點擊手勢識別失敗 |
onClick(event: (event: ClickEvent) => void): T | 點擊動作觸發該回調 | |
觸摸事件 | onTouch(event: (event: TouchEvent) => void): T | 手指觸摸動作觸發該回調 |
掛載卸載事件 | onAttach(callback: Callback<void>): T | 組件掛載至組件樹時觸發此回調 |
onDetach(callback: Callback<void>): T | 組件從組件樹卸載時觸發此回調 | |
onAppear(event: () => void): T | 組件掛載顯示后觸發此回調 | |
onDisAppear(event: () => void): T | 組件卸載消失時觸發此回調 | |
拖拽事件 | onDragStart(event: (event: DragEvent, extraParams?: string) => CustomBuilder | DragItemInfo) | 第一次拖拽此事件綁定的組件時,長按時間 >= 500ms,然后手指移動距離 >= 10vp,觸發回調 |
onDragEnter(event: (event: DragEvent, extraParams?: string) => void) | 拽進入組件范圍內時,觸發回調,當監聽了onDrop事件時,此事件才有效 | |
onDragMove(event: (event: DragEvent, extraParams?: string) => void) | 拖拽在組件范圍內移動時,觸發回調,當監聽了onDrop事件時,此事件才有效 | |
onDragLeave(event: (event: DragEvent, extraParams?: string) => void) | 拖拽離開組件范圍內時,觸發回調,當監聽了onDrop事件時,此事件才有效 | |
onDrop(event: (event: DragEvent, extraParams?: string) => void) | 綁定此事件的組件可作為拖放目標。當在本組件范圍內停止拖放行為時,將觸發回調。 如果開發者未在 onDrop 中主動調用 event.setResult()來設置拖拽接收的結果,對于系統支持的默認可拖入組件,處理結果將依據系統實際處理的數據。 對于其他組件,系統將默認視為數據接收成功。 | |
onDrop(eventCallback: OnDragEventCallback, dropOptions?: DropOptions) | 綁定此事件的組件可作為拖放目標。當在本組件范圍內停止拖放行為時,將觸發回調。 如果開發者未在 onDrop 中主動調用 event.setResult()來設置拖拽接收的結果,對于系統支持的默認可拖入組件,處理結果將依據系統實際處理的數據。 對于其他組件,系統將默認視為數據接收成功 | |
onDragEnd(event: (event: DragEvent, extraParams?: string) => void) | 綁定此事件的組件觸發的拖拽結束后,觸發回調 | |
onPreDrag(event: (preDragStatus: PreDragStatus) => void) | 綁定此事件的組件,當觸發拖拽發起前的不同階段時,觸發回調 | |
按鍵事件 | onKeyEvent(event: (event: KeyEvent) => void): T | 綁定該方法的組件獲焦后,按鍵動作觸發該回調 |
onKeyEvent(event: Callback<KeyEvent, boolean>): T | 當綁定該方法的組件獲得焦點后,按鍵操作將觸發此回調。若此回調的返回值為 true,則視為按鍵事件已被處理 | |
onKeyPreIme(event: Callback<KeyEvent, boolean>): T | 綁定該方法的組件獲焦后,按鍵動作優先觸發該回調 | |
onKeyEventDispatch(event: Callback<KeyEvent, boolean>): T | 對應組件收到按鍵事件時,會觸發該回調,該按鍵事件不會分發給其子組件。不支持構造 KeyEvent 進行分發,只支持分發已有的按鍵事件 該回調的返回值為 true 時,視作該按鍵事件已被消費,不會冒泡給父組件處理 | |
焦點事件 | onFocus(event: () => void) | 當前組件獲取焦點時觸發的回調 |
onBlur(event:() => void) | 當前組件失去焦點時觸發的回調 | |
鼠標事件 | onMouse(event: (event: MouseEvent) => void) | 當前組件被鼠標按鍵點擊時或者鼠標在組件上懸浮移動時,觸發該回調 |
懸浮事件 | onHover(event: (isHover: boolean, event: HoverEvent) => void): T | 鼠標或手寫筆進入或退出組件時觸發 hover 事件 |
onHoverMove(event: Callback<HoverEvent>): T | 手寫筆懸浮于組件上方時觸發懸浮移動事件 | |
無障礙懸浮事件 | onAccessibilityHover(callback: AccessibilityCallback): T | 開啟無障礙模式后,單指觸摸綁定該回調的組件時觸發該回調 |
組件區域變化事件 | onAreaChange(event: (oldValue: Area, newValue: Area) => void): T | 組件區域變化時觸發該回調。僅會響應由布局變化所導致的組件大小、位置發生變化時的回調 |
組件尺寸變化事件 | onSizeChange(event: SizeChangeCallback): T | 組件區域變化時觸發該回調。 僅會響應由布局變化所導致的組件尺寸發生變化時的回調。由繪制變化所導致的渲染屬性變化不會響應回調,如 translate、offset |
SizeChangeCallback = (oldValue: SizeOptions, newValue: SizeOptions) => void | 組件區域變化時的回調類型 | |
組件可見區域變化事件 | onVisibleAreaChange(ratios: Array<number>, event: VisibleAreaChangeCallback): T | 組件可見區域變化時觸發該回調 |
onVisibleAreaApproximateChange(options: VisibleAreaEventOptions, event: VisibleAreaChangeCallback | undefined): void | 設置onVisibleAreaChange事件的回調參數,限制它的執行間隔 | |
組件快捷鍵事件 | keyboardShortcut(value: string | FunctionKey, keys: Array<ModifierKey>, action?: () => void): T | 設置組件的自定義組合鍵 |
自定義事件分發 | onChildTouchTest(event: (value: Array<TouchTestInfo>) => TouchResult): T | 當前組件可通過設置回調來自定義子節點如何去做觸摸測試 |
自定義事件攔截 | onTouchIntercept(callback: Callback<TouchEvent, HitTestMode>) | 為組件提供自定義的事件攔截能力,開發者可根據事件在控件上按下時發生的位置,輸入源等事件信息決定控件上的 HitTestMode 屬性 |
焦點軸事件 | onFocusAxisEvent(event: Callback<FocusAxisEvent>): T | 綁定該方法的組件獲焦后,游戲手柄上的搖桿、十字鍵等的操作會觸發該回調 |
軸事件 | onAxisEvent(event: (event: AxisEvent) => void): T | 鼠標滾輪滾動或觸控板雙指移動觸發該回調 |
組件 通用屬性 速查表
通用屬性 | 屬性名稱 | 簡要說明 |
---|---|---|
尺寸設置 | width(value: Length) | 設置組件自身的寬度,缺省時使用元素自身內容需要的寬度。若子組件的寬大于父組件的寬,則會畫出父組件的范圍。 |
height(value: Length) | 設置組件自身的高度,缺省時使用元素自身內容需要的高度。若子組件的高大于父組件的高,則會畫出父組件的范圍。 | |
width(widthValue: Length | LayoutPolicy) | 設置組件自身的寬度或水平方向布局策略,缺省時使用元素自身內容需要的寬度。若子組件的寬大于父組件的寬,則會畫出父組件的范圍 | |
height(heightValue: Length | LayoutPolicy) | 設置組件自身的高度或垂直方向布局策略,缺省時使用元素自身內容需要的高度。若子組件的高大于父組件的高,則會畫出父組件的范圍 | |
size(value: SizeOptions) | 設置高寬尺寸 | |
padding(value: Padding | Length | LocalizedPadding) | 設置內邊距屬性 | |
margin(value: Margin | Length | LocalizedMargin) | 設置外邊距屬性 | |
safeAreaPadding(value: Padding | LengthMetrics | LocalizedPadding) | 設置安全區邊距屬性。允許容器向自身添加組件級安全區域,供子組件延伸 | |
layoutWeight(value: number | string) | 設置組件的布局權重,使用該屬性的組件在父容器(Row/Column/Flex)的主軸方向按照權重分配尺寸 | |
constraintSize(value: ConstraintSizeOptions) | 設置約束尺寸,組件布局時,進行尺寸范圍限制 | |
位置設置 | align(value: Alignment) | 設置容器元素繪制區域內的子元素的對齊方式 |
direction(value: Direction) | 設置容器元素內主軸方向上的布局 | |
position(value: Position | Edges | LocalizedEdges) | 絕對定位,確定子組件相對父組件的位置 | |
markAnchor(value: Position | LocalizedPosition) | 設置元素在位置定位時的錨點 | |
offset(value: Position | Edges | LocalizedEdges) | 相對偏移,組件相對原本的布局位置進行偏移 | |
alignRules(value: AlignRuleOption) | 指定設置在相對容器中子組件的對齊規則,僅當父容器為RelativeContainer時生效 | |
alignRules(alignRule: LocalizedAlignRuleOptions) | 指定設置在相對容器中子組件的對齊規則,僅當父容器為RelativeContainer時生效。 該方法水平方向上以 start 和 end 分別替代原方法的 left 和 right, 以便在 RTL 模式下能鏡像顯示,建議使用該方法指定設置在相對容器中子組件的對齊規則 | |
布局約束 | aspectRatio(value: number) | 指定當前組件的寬高比,aspectRatio=width/height |
displayPriority(value: number) | 設置當前組件在布局容器中顯示的優先級 | |
組件級像素取整 | pixelRound(value: PixelRoundPolicy) | 指定當前組件在指定方向上的像素取整對齊方式,某方向不設置時默認在該方向進行四舍五入取整 |
Flex 布局 | flexBasis(value: number | string) | 設置組件的基準尺寸 |
flexGrow(value: number) | 設置組件在父容器的剩余空間所占比例 | |
flexShrink(value: number) | 置父容器壓縮尺寸分配給此屬性所在組件的比例。當父容器為 Column、Row 時,需設置主軸方向的尺寸 | |
alignSelf(value: ItemAlign) | 子組件在父容器交叉軸的對齊格式 | |
邊框設置 | border(value: BorderOptions) | 設置邊框樣式 |
borderStyle(value: BorderStyle | EdgeStyles) | 設置元素的邊框線條樣式 | |
borderWidth(value: Length | EdgeWidths | LocalizedEdgeWidths) | 設置邊框的寬度 | |
borderColor(value: ResourceColor | EdgeColors | LocalizedEdgeColors) | 設置邊框的顏色 | |
borderRadius(value: Length | BorderRadiuses | LocalizedBorderRadiuses) | 設置邊框的圓角。圓角大小受組件尺寸限制,最大值為組件寬或高的一半 | |
圖片邊框設置 | borderImage(value: BorderImageOption) | 設置組件的圖片邊框 |
背景設置 | background(builder: CustomBuilder, options?: { align?: Alignment }) | 設置組件背景 |
backgroundColor(value: ResourceColor) | 設置組件背景色 | |
backgroundImage(src: ResourceStr | PixelMap, repeat?: ImageRepeat) | 設置組件的背景圖片 | |
backgroundImageSize(value: SizeOptions | ImageSize) | 設置組件背景圖片的寬高 | |
backgroundImagePosition(value: Position | Alignment) | 設置背景圖的位置 | |
backgroundBlurStyle(value: BlurStyle, options?: BackgroundBlurStyleOptions) | 為當前組件提供一種在背景和內容之間的模糊能力,通過枚舉值的方式封裝了不同的模糊半徑、蒙版顏色、蒙版透明度、飽和度、亮度 | |
backdropBlur(value: number, options?: BlurOptions) | 為組件添加背景模糊效果,可以自定義設置模糊半徑和灰階參數 | |
backgroundEffect(options: BackgroundEffectOptions) | 設置組件背景屬性,包含背景模糊半徑,亮度,飽和度,顏色等參數 | |
backgroundImageResizable(value: ResizableOptions) | 設置背景圖在拉伸時可調整大小的圖像選項 | |
backgroundBrightness(params: BackgroundBrightnessOptions) | 設置組件背景提亮效果 | |
透明度設置 | opacity(value: number | Resource) | 設置組件的不透明度 |
顯隱控制 | visibility(value: Visibility) | 控制組件的顯隱 |
禁用控制 | enabled(value: boolean) | 設置組件是否可交互 |
浮層 | overlay(value: string | CustomBuilder | ComponentContent, options?: OverlayOptions ) | 在當前組件上,增加遮罩文本或者疊加自定義組件以及 ComponentContent 作為該組件的浮層。 浮層不通過組件樹進行渲染,部分接口(例如getRectangleById)不支持獲取浮層中的組件 |
Z 序控制 | zIndex(value: number) | 設置組件的堆疊順序 |
圖形變換 | rotate(value: RotateOptions) | 設置組件旋轉 |
translate(value: TranslateOptions) | 設置組件平移 | |
scale(value: ScaleOptions) | 設置組件縮放 | |
transform(value: object) | 設置組件的變換矩陣 | |
圖像效果 | blur(value: number, options?: BlurOptions) | 為組件添加內容模糊效果 |
shadow(value: ShadowOptions | ShadowStyle) | 為組件添加陰影效果 | |
grayscale(value: number) | 為組件添加灰度效果 | |
brightness(value: number) | 為組件添加高光效果 | |
saturate(value: number) | 為組件添加飽和度效果 | |
contrast(value: number) | 為組件添加對比度效果 | |
invert(value: number | InvertOptions) | 反轉輸入的圖像 | |
sepia(value: number) | 將圖像轉換為深褐色 | |
hueRotate(value: number | string) | 色相旋轉效果 | |
colorBlend(value: Color | string | Resource) | 為組件添加顏色疊加效果 | |
linearGradientBlur(value: number, options: LinearGradientBlurOptions) | 為組件添加內容線性漸變模糊效果 | |
renderGroup(value: boolean) | 設置當前控件和子控件是否先整體離屏渲染繪制后再與父控件融合繪制 | |
blendMode(value: BlendMode, type?: BlendApplyType) | 將當前控件的內容(包含子節點內容)與下方畫布(可能為離屏畫布)已有內容進行混合 | |
useShadowBatching(value: boolean) | 控件內部子節點的陰影進行同層繪制,同層元素陰影重疊 | |
sphericalEffect(value: number) | 設置組件的圖像球面化程度 | |
lightUpEffect(value: number) | 設置組件圖像亮起程度 | |
pixelStretchEffect(options: PixelStretchEffectOptions) | 設置組件的圖像邊緣像素擴展距離 | |
systemBarEffect() | 根據背景進行智能反色并且帶有模糊效果 | |
FractionStop = [ number, number ] | 定義模糊段 | |
freeze(value: boolean) | 設置當前控件和子控件是否整體離屏渲染繪制后重復繪制緩存,不再進行內部屬性更新 | |
形狀裁剪 | clip(value: boolean) | 是否對子組件超出當前組件范圍外的區域進行裁剪 |
clip(value: boolean | CircleAttribute | EllipseAttribute | PathAttribute | RectAttribute) | 按指定的形狀對當前組件進行裁剪 | |
mask(value: ProgressMask) | 為組件上添加可調節進度的遮罩 | |
maskShape(value: CircleShape | EllipseShape | PathShape | RectShape) | 為組件上添加指定形狀的遮罩 | |
constructor(value: number, total: number, color: ResourceColor) | 構造 ProgressMask 對象 | |
updateProgress(value: number): void | 更新進度遮罩的進度值 | |
updateColor(value: ResourceColor): void | 更新進度遮罩的顏色 | |
enableBreathingAnimation(value: boolean): void | 進度滿時的呼吸光暈動畫開關。默認關閉呼吸光暈動畫 | |
linearGradient(value: {angle?: number | string; direction?: GradientDirection; colors: Array<[ResourceColor, number]>; repeating?: boolean;}) | 線性漸變 | |
sweepGradient(value: {center: [Length, Length]; start?: number | string; end?: number | string; rotation?: number | string; colors: Array<[ResourceColor, number]>; repeating?: boolean;}) | 角度漸變 | |
radialGradient(value: { center: [Length, Length]; radius: number | string; colors: Array<[ResourceColor, number]>; repeating?: boolean }) | 徑向漸變 | |
Popup 控制 | bindPopup(show: boolean, popup: PopupOptions | CustomPopupOptions) | 給組件綁定 Popup 彈窗 |
菜單控制 | bindMenu(content: Array | CustomBuilder, options?: MenuOptions) | 給組件綁定菜單,點擊后彈出菜單。彈出菜單項支持圖標+文本排列和自定義兩種功能 |
bindMenu(isShow: boolean, content: Array | CustomBuilder, options?: MenuOptions) | 給組件綁定菜單,點擊后彈出菜單。彈出菜單項支持圖標+文本排列和自定義兩種功能 | |
bindContextMenu(content: CustomBuilder, responseType: ResponseType, options?: ContextMenuOptions) | 給組件綁定菜單,觸發方式為長按或者右鍵點擊,彈出菜單項需要自定義 | |
bindContextMenu(isShown: boolean, content: CustomBuilder, options?: ContextMenuOptions) | 給組件綁定菜單,觸發方式為控制綁定的 isShown | |
焦點控制 | focusable(value: boolean) | 設置當前組件是否可以獲焦 |
tabIndex(index: number) | 自定義組件 tab 鍵走焦能力 | |
defaultFocus(value: boolean) | 設置當前組件是否為當前頁面上的默認焦點 | |
groupDefaultFocus(value: boolean) | 設置當前組件是否為當前組件所在容器獲焦時的默認焦點 | |
focusOnTouch(value: boolean) | 設置當前組件是否支持點擊獲焦能力 | |
focusBox(style: FocusBoxStyle): T | 設置當前組件系統焦點框樣式 | |
requestFocus(value: string): boolean | 方法語句中可使用的全局接口,調用此接口可以主動讓焦點轉移至參數指定的組件上 | |
focusScopePriority(scopeId: string, priority?: FocusPriority): T | 設置當前組件在指定容器內獲焦的優先級。需要配合 focusScopeId 一起使用 | |
focusScopeId(id: string, isGroup?: boolean) | 設置當前容器組件的 id 標識,設置當前容器組件是否為焦點組 | |
focusScopeId(id: string, isGroup?: boolean, arrowStepOut?: boolean) | 設置當前容器組件的 id 標識,設置當前容器組件是否為焦點組 | |
tabStop(isTabStop: boolean) :T | 設置當前容器組件的 tabStop,可決定在走焦時焦點是否會停留在當前容器 | |
懸浮態效果 | hoverEffect(value: HoverEffect) | 設置組件的鼠標懸浮態顯示效果 |
組件標識 | id(value: string): T | 組件的唯一標識,唯一性由使用者保證 |
key(value: string): T | 組件的唯一標識,唯一性由使用者保證 | |
getInspectorByKey(id: string): string | 獲取指定 id 的組件的所有屬性,不包括子組件信息。 此接口僅用于對應用的測試。由于耗時長,不建議使用 | |
getInspectorTree(): Object | 獲取組件樹及組件屬性。此接口僅用于對應用的測試。由于耗時長,不建議使用 | |
sendEventByKey(id: string, action: number, params: string): boolean | 給指定 id 的組件發送事件。此接口僅用于對應用的測試。由于耗時長,不建議使用 | |
sendTouchEvent(event: TouchObject): boolean | 發送觸摸事件。此接口僅用于對應用的測試。由于耗時長,不建議使用 | |
sendKeyEvent(event: KeyEvent): boolean | 發送按鍵事件。此接口僅用于對應用的測試。由于耗時長,不建議使用 | |
sendMouseEvent(event: MouseEvent): boolean | 發送鼠標事件。此接口僅用于對應用的測試。由于耗時長,不建議使用 | |
復用標識 | reuseId(id: string) | 復用標識,用于劃分自定義組件的復用組 |
多態樣式 | stateStyles(value: StateStyles) | 設置組件不同狀態的樣式 |
分布式遷移標識 | restoreId(value: number) | 標記支持分布式遷移的組件 Id,用于兩端設備組件的配對 |
前景色設置 | foregroundColor(value: ResourceColor | ColoringStrategy) | 設置組件的前景色。當組件未設置前景色,默認繼承父組件 |
前景屬性設置 | foregroundEffect(options: ForegroundEffectOptions) | 設置組件的前景屬性 |
組件內容模糊 | foregroundBlurStyle(value: BlurStyle, options?: ForegroundBlurStyleOptions) | 為當前組件提供內容模糊能力 |
運動模糊 | motionBlur(value: MotionBlurOptions) | 在當前組件由縮放大小或位移變化引起的運動過程中,增加動態模糊效果 |
點擊回彈效果 | clickEffect(value: ClickEffect | null) | 設置當前組件點擊回彈效果 |
無障礙屬性 | accessibilityGroup(value: boolean) | 設置是否啟用無障礙分組。啟用無障礙分組后該組件及其所有子組件將作為一整個可以選中的組件,無障礙服務將不再關注其子組件內容。 |
accessibilityGroup(isGroup: boolean, accessibilityOptions: AccessibilityOptions) | 設置是否啟用無障礙分組,支持優先拼接無障礙文本進行朗讀。啟用無障礙分組后該組件及其所有子組件將作為一整個可以選中的組件,無障礙服務將不再關注其子組件內容 | |
accessibilityText(value: string) | 設置無障礙文本。當組件不包含文本屬性時,開發人員可通過設置無障礙文本屬性,使不包含文字信息的組件能夠播報無障礙文本的內容 | |
accessibilityText(text: Resource) | 設置無障礙文本,支持通過 Resource 引用資源文件。當組件不包含文本屬性時,開發人員可通過設置無障礙文本屬性,使不包含文字信息的組件能夠播報無障礙文本的內容 | |
accessibilityDescription(value: string) | 設置無障礙說明。該屬性用于為用戶進一步說明當前組件,開發人員可為組件設置相對較詳細的解釋文本,幫助用戶理解將要執行的操作 | |
accessibilityDescription(description: Resource) | 設置無障礙說明,支持通過 Resource 引用資源文件。該屬性用于為用戶進一步說明當前組件,開發人員可為組件設置相對較詳細的解釋文本,幫助用戶理解將要執行的操作 | |
accessibilityLevel(value: string) | 設置無障礙重要性。該屬性用于控制某個組件是否可被無障礙輔助服務所識別 | |
accessibilityVirtualNode(builder: CustomBuilder) | 設置無障礙虛擬子節點。對自繪制組件傳入一個自定義的 CustomBuilder,該 CustomBuilder 中的組件在后端僅做布局不做顯示,輔助應用獲取無障礙節點信息時會返回 CustomBuilder 中的節點信息 | |
accessibilityChecked(isCheck: boolean) | 無障礙節點是否選中的狀態維護,用于支持多選的情況使用,表示組件是否被選中 | |
accessibilitySelected(isSelect: boolean) | 無障礙節點是否選中的狀態維護,用于支持單選的情況使用,表示組件是否被選中 | |
accessibilityTextHint(value: string) | 設置組件的文本提示信息,供無障礙輔助應用查詢 | |
動態屬性設置 | attributeModifier(modifier: AttributeModifier<T>) | 動態設置組件的屬性方法 |
applyNormalAttribute(instance: T) : void | 組件普通狀態時的樣式 | |
applyPressedAttribute(instance: T) : void | 組件按壓狀態的樣式 | |
applyFocusedAttribute(instance: T) : void | 組件獲焦狀態的樣式 | |
applyDisabledAttribute(instance: T) : void | 組件禁用狀態的樣式 | |
applySelectedAttribute(instance: T) : void | 組件選中狀態的樣式 | |
動態手勢設置 | gestureModifier(modifier: GestureModifier) | 動態設置組件綁定的手勢 |
applyGesture(event: UIGestureEvent): void | 組件需要綁定的手勢 | |
外描邊設置 | outline(value: OutlineOptions) | 統一外描邊樣式設置接口 |
outlineStyle(value: OutlineStyle | EdgeOutlineStyles) | 設置元素的外描邊樣式 | |
outlineWidth(value: Dimension | EdgeOutlineWidths) | 設置元素的外描邊寬度 | |
outlineColor(value: ResourceColor | EdgeColors) | 設置元素的外描邊顏色 | |
outlineRadius(value: Dimension | OutlineRadiuses) | 設置元素的外描邊圓角半徑 | |
視效設置 | visualEffect(effect: VisualEffect): T | 設置非濾鏡視覺效果 |
backgroundFilter(filter: Filter): T | 設置背景濾鏡視覺效果 | |
foregroundFilter(filter: Filter): T | 設置前景濾鏡(內容)視覺效果 | |
compositingFilter(filter: Filter): T | 設置合成濾鏡視覺效果 | |
自定義繪制設置 | drawModifier(modifier: DrawModifier | undefined) | 設置組件的自定義繪制修改器 |
drawFront?(drawContext: DrawContext): void | 自定義繪制前景的接口,若重載該方法則可進行前景的自定義繪制 | |
drawContent?(drawContext: DrawContext): void | 自定義繪制內容的接口,若重載該方法可進行內容的自定義繪制,會替換組件原本的內容繪制函數 | |
drawBehind?(drawContext: DrawContext): void | 自定義繪制背景的接口,若重載該方法則可進行背景的自定義繪制 | |
invalidate(): void | 主動觸發重繪的接口,開發者無需也無法重載,調用會觸發所綁定組件的重繪 | |
自定義內容 | contentModifier(modifier:ContentModifier<T>) | 定制內容區的方法 |
applyContent() : WrappedBuilder<[T]> | 定制內容區的 Builder | |
自定義屬性設置 | customProperty(name: string, value: Optional<Object>) | 設置組件的自定義屬性。自定義組件不支持設置自定義屬性 |
觸摸交互控制 | responseRegion(value: Array | Rectangle) | 設置一個或多個觸摸熱區 |
hitTestBehavior(value: HitTestMode) | 設置組件的觸摸測試類型 | |
模態轉場設置 | bindContentCover(isShow: Optional<boolean>, builder: CustomBuilder, options?: ContentCoverOptions) | 給組件綁定全屏模態頁面,點擊后顯示模態頁面。模態頁面內容自定義,顯示方式可設置無動畫過渡,上下切換過渡以及透明漸變過渡方式 |
bindSheet(isShow: Optional<boolean>, builder: CustomBuilder, options?: SheetOptions) | 給組件綁定半模態頁面,點擊后顯示模態頁面 | |
隱私遮罩 | obscured(reasons: Array<ObscuredReasons>) | 設置組件內容的遮罩類型 |
文本通用 ? | fontColor(value: ResourceColor) | 設置字體顏色 |
fontSize(value: number | string | Resource) | 設置字體大小 | |
fontStyle(value: FontStyle) | 設置字體樣式 | |
fontWeight(value: number | FontWeight | string) | 設置文本的字體粗細,設置過大可能會在不同字體下有截斷 | |
fontFamily(value: string | Resource) | 設置字體列表 | |
lineHeight(value: number | string | Resource) | 設置文本的文本行高,設置值不大于 0 時,不限制文本行高,自適應字體大小 | |
decoration(value: DecorationStyleInterface) | 設置文本裝飾線樣式及其顏色 | |
拖拽控制 | allowDrop(value: Array | null) | 設置該組件上允許落入的數據類型 |
draggable(value: boolean) | 設置該組件是否允許進行拖拽 | |
dragPreview(value: CustomBuilder | DragItemInfo | string) | 設置組件拖拽過程中的預覽圖 | |
dragPreview(preview: CustomBuilder | DragItemInfo | string, config?: PreviewConfiguration):T | 自定義組件拖拽過程中的預覽圖,僅用于設置浮起效果或者禁用浮起效果 | |
dragPreviewOptions(value: DragPreviewOptions, options?: DragInteractionOptions) | 設置拖拽過程中背板圖處理模式及數量角標的顯示。不支持 onItemDragStart 拖拽方式 | |
安全區域 | expandSafeArea(types?: Array<SafeAreaType>, edges?: Array<SafeAreaEdge>) | 控制組件擴展其安全區域 |
setKeyboardAvoidMode(value: KeyboardAvoidMode): void | 控制虛擬鍵盤抬起時頁面的避讓模式 | |
getKeyboardAvoidMode(): KeyboardAvoidMode | 返回虛擬鍵盤抬起時的頁面避讓模式 | |
組件內容填充方式 | renderFit(fitMode: RenderFit) | 設置寬高動畫過程中的組件內容填充方式 |
事件獨占控制 | monopolizeEvents(monopolize: boolean) | 設置組件是否獨占事件 |
鼠標光標控制 | setCursor(value: PointerStyle): void | 更改當前的鼠標光標樣式 |
restoreDefault(): void | 將鼠標光標恢復成默認的箭頭光標樣式 | |
特效繪制合并 | useEffect(value: boolean) | 用于對背景模糊等特效進行繪制合并 |
useEffect(useEffect: boolean, effectType: EffectType) | 用于設置組件是否應用窗口定義的效果模板 |