diff --git a/arkui/ace_engine/native/libace.ndk.json b/arkui/ace_engine/native/libace.ndk.json
index 8100266932659ad07914ce83f5def2008258c843..4b580ebd2c06983df55276e0bfe7db3c265387b3 100644
--- a/arkui/ace_engine/native/libace.ndk.json
+++ b/arkui/ace_engine/native/libace.ndk.json
@@ -3318,5 +3318,13 @@
     {
         "first_introduced": "19",
         "name": "OH_ArkUI_PanGesture_GetDistanceByToolType"
+    },
+    {
+        "first_introduced": "20",
+        "name": "OH_ArkUI_AddSupportedUIStates"
+    },
+    {
+        "first_introduced": "20",
+        "name": "OH_ArkUI_RemoveSupportedUIStates"
     }
 ]
\ No newline at end of file
diff --git a/arkui/ace_engine/native/native_node.h b/arkui/ace_engine/native/native_node.h
index c3fb83c3263dd9783b828689a7b1a4069e500c8b..7bc43a7671d4be4b527c490ca841e3143781b6ee 100644
--- a/arkui/ace_engine/native/native_node.h
+++ b/arkui/ace_engine/native/native_node.h
@@ -9221,6 +9221,53 @@ int32_t OH_ArkUI_GetNodeSnapshot(ArkUI_NodeHandle node, ArkUI_SnapshotOptions* s
  */
 int32_t OH_ArkUI_NodeUtils_GetPositionToParent(ArkUI_NodeHandle node, ArkUI_IntOffset* globalOffset);
 
+/**
+ * @brief Adds the UI state style supported by the component. To handle states change efficiently, need to specify the
+ * states of interest and the corresponding handler. When a state of interest occurs, the handler will be executed.
+ *  - You can adjust the UI style based on the current state within the callback. If this API is called multiple
+ * times on the same node, the last set of states and handler will take precedence.
+ *  - Some component types have default system handling for certain states. For example, the <b>Button</b>
+ * component has a default style effect for the PRESSED state. When custom state handling is implemented on such
+ * components, the default style effect will be applied first, followed by the custom style changes, resulting in
+ * a combined effect. To disable the default style effects, set <b>excludeInner</b> to <b>true</b>, if this is allowed
+ * by the system implementation.
+ *  - And when this API is called, the provided handler function will be executed immediately.
+ *  - There is no need to explicitly register a listener for the NORMAL state. Once a non-NORMAL state is registered,
+ * the system will automatically notify your application when the state changes back to NORMAL.
+ *
+ * @param node Target node.
+ * @param uiStates Target UI states to be handled on the node.
+ *        The combined result of all target UI states can be calculated using the <b>|</b> operator.
+ *        Example: <b>targetUIStates = ArkUI_UIState::PRESSED | ArkUI_UIState::FOCUSED</b>.
+ * @param statesChangeHandler Handler for UI state changes.
+ *        It rturns the current UI status. The value is the result of combining all current state enum values using the
+ *        <b>|</b> operator. You can determine the state using the <b>&</b> operator.
+ *        Example: <b>if (currentStates & ArkUI_UIState::PRESSED == ArkUI_UIState::PRESSED)</b>.
+ *        However, for checking the normal state, use the equality operator directly.
+ *        Example: <b>if (currentStates == ArkUI_UIState::NORMAL)</b>.
+ * @param excludeInner Whether to disable the default state styles.
+ * @param userData Custom data used in the <b>statesChangeHandler</b> callback.
+ * @return Returns the result code.
+ *         Returns {@link ARKUI_ERROR_CODE_NO_ERROR} if the operation is successful.
+ *         Returns {@link ARKUI_ERROR_CODE_PARAM_INVALID} if a parameter error occurs.
+ * @since 20
+ */
+ArkUI_ErrorCode OH_ArkUI_AddSupportedUIStates(ArkUI_NodeHandle node, int32_t uiStates,
+    void (statesChangeHandler)(int32_t currentStates, void* userData), bool excludeInner, void* userData);
+
+/**
+ * @brief Removes registered UI states. When all states registered using <b>OH_ArkUI_AddSupportedUIStates</b>
+ * are removed, the registered <b>stateChangeHandler</b> will no longer be executed.
+ * 
+ * @param node Target node.
+ * @param uiStates Target UI states to be removed.
+ * @return Returns the result code.
+ *         Returns {@link ARKUI_ERROR_CODE_NO_ERROR} if the operation is successful.
+ *         Returns {@link ARKUI_ERROR_CODE_PARAM_INVALID} if a parameter error occurs.
+ * @since 20
+ */
+ArkUI_ErrorCode OH_ArkUI_RemoveSupportedUIStates(ArkUI_NodeHandle node, int32_t uiStates);
+
 #ifdef __cplusplus
 };
 #endif
diff --git a/arkui/ace_engine/native/native_type.h b/arkui/ace_engine/native/native_type.h
index 8595c4076fa53223c45385cbe93de63a300c0271..5c50eadcba23a6ea8874c58d35a24eb23cb87821 100644
--- a/arkui/ace_engine/native/native_type.h
+++ b/arkui/ace_engine/native/native_type.h
@@ -2591,6 +2591,28 @@ typedef enum {
     ARKUI_LAZY_EXPAND = 2,
 } ArkUI_ExpandMode;
 
+/**
+ * @brief Defines the navigation point indicator style of the <b><Swiper></b> component.
+ * @brief Enumerates the UI states of a component, used for handling state-specific styles.
+ *
+ * @since 20
+ */
+typedef enum {
+    /** Normal state. */
+    UI_STATE_NORMAL = 0,
+    /** Pressed state. */
+    UI_STATE_PRESSED = 1 << 0,
+    /** Focused state. */
+    UI_STATE_FOCUSED = 1 << 1,
+    /** Disabled state. */
+    UI_STATE_DISABLED = 1 << 2,
+    /**
+     * Selected state. This state is supported only by specific component types:
+     * <b>Checkbox</b>, <b>Radio</b>, <b>Toggle</b>, <b>List</b>, <b>Grid</b>, and <b>MenuItem</b>.
+     */
+    UI_STATE_SELECTED = 1 << 3,
+} ArkUI_UIState;
+
 /**
  * @brief Defines parameter used by the system font style callback event.
  *