diff --git a/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_common_bridge.cpp b/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_common_bridge.cpp
index c6b01e22c0de87b8315011a589cc098d83e92a26..0378536ed20633dcdf167ed9b58f192ede6f4274 100644
--- a/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_common_bridge.cpp
+++ b/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_common_bridge.cpp
@@ -38,6 +38,7 @@
 #include "bridge/declarative_frontend/jsview/js_utils.h"
 #include "bridge/declarative_frontend/jsview/js_accessibility.h"
 #include "bridge/declarative_frontend/jsview/js_popups.h"
+#include "bridge/declarative_frontend/style_string/js_span_string.h"
 using namespace OHOS::Ace::Framework;
 
 namespace OHOS::Ace::NG {
@@ -3534,12 +3535,80 @@ ArkUINativeModuleValue CommonBridge::SetBindMenu(ArkUIRuntimeCallInfo* runtimeCa
     return panda::JSValueRef::Undefined(vm);
 }
 
+bool ParseTipsMessage(
+    ArkUIRuntimeCallInfo* runtimeCallInfo, const EcmaVM* vm, std::string& message, RefPtr<SpanString>& styledString)
+{
+    bool parseRuslut = false;
+    Local<JSValueRef> messageArg = runtimeCallInfo->GetCallArgRef(NUM_1);
+    if (messageArg->IsString(vm)) {
+        message = messageArg->ToString(vm)->ToString(vm);
+        parseRuslut = true;
+    } else if (messageArg->IsObject(vm)) {
+        Framework::JsiCallbackInfo info = Framework::JsiCallbackInfo(runtimeCallInfo);
+        Framework::JSRef<Framework::JSVal> args = info[1];
+        auto* spanString = Framework::JSRef<Framework::JSObject>::Cast(args)->Unwrap<Framework::JSSpanString>();
+        if (!spanString) {
+            ArkTSUtils::ParseJsString(vm, messageArg, message);
+        } else {
+            styledString = spanString->GetController();
+        }
+        parseRuslut = true;
+    }
+    return parseRuslut;
+}
+
+void ParseTipsParam(const RefPtr<PopupParam>& tipsParam, const ArkUIBindTipsOptionsTime& timeOptions,
+    const ArkUIBindTipsOptionsArrow& arrowOptions)
+{
+    CHECK_NULL_VOID(tipsParam);
+    tipsParam->SetShowInSubWindow(true);
+    tipsParam->SetAppearingTime(timeOptions.appearingTime);
+    tipsParam->SetDisappearingTime(timeOptions.disappearingTime);
+    tipsParam->SetAppearingTimeWithContinuousOperation(timeOptions.appearingTimeWithContinuousOperation);
+    tipsParam->SetDisappearingTimeWithContinuousOperation(timeOptions.disappearingTimeWithContinuousOperation);
+    tipsParam->SetEnableArrow(arrowOptions.enableArrow);
+    if (arrowOptions.arrowPointPosition && arrowOptions.enableArrow) {
+        CalcDimension offset;
+        char* pEnd = nullptr;
+        std::strtod(arrowOptions.arrowPointPosition, &pEnd);
+        if (pEnd != nullptr) {
+            if (std::strcmp(pEnd, "Start") == 0) {
+                offset = 0.0_pct; // 0.0_pct : The offset is 0%
+            }
+            if (std::strcmp(pEnd, "Center") == 0) {
+                offset = 0.5_pct; // 0.5_pct : The offset is 50%
+            }
+            if (std::strcmp(pEnd, "End") == 0) {
+                offset = 1.0_pct; // 1.0_pct : The offset is 100%
+            }
+            tipsParam->SetArrowOffset(offset);
+        }
+    }
+    CalcDimension arrowWidth(arrowOptions.arrowWidthValue, static_cast<DimensionUnit>(arrowOptions.arrowWidthUnit));
+    bool setArrowWidthError = true;
+    if (arrowOptions.arrowWidthValue > 0 &&
+        static_cast<DimensionUnit>(arrowOptions.arrowWidthUnit) != DimensionUnit::PERCENT) {
+        tipsParam->SetArrowWidth(arrowWidth);
+        setArrowWidthError = false;
+    }
+    tipsParam->SetErrorArrowWidth(setArrowWidthError);
+    CalcDimension arrowHeight(arrowOptions.arrowHeightValue, static_cast<DimensionUnit>(arrowOptions.arrowHeightUnit));
+    bool setArrowHeightError = true;
+    if (arrowOptions.arrowHeightValue > 0 &&
+        static_cast<DimensionUnit>(arrowOptions.arrowHeightUnit) != DimensionUnit::PERCENT) {
+        tipsParam->SetArrowHeight(arrowHeight);
+        setArrowHeightError = false;
+    }
+    tipsParam->SetErrorArrowHeight(setArrowHeightError);
+    tipsParam->SetBlockEvent(false);
+    tipsParam->SetTipsFlag(true);
+}
+
 ArkUINativeModuleValue CommonBridge::SetBindTips(ArkUIRuntimeCallInfo* runtimeCallInfo)
 {
     EcmaVM* vm = runtimeCallInfo->GetVM();
     CHECK_NULL_RETURN(vm, panda::NativePointerRef::New(vm, nullptr));
     Local<JSValueRef> nodeArg = runtimeCallInfo->GetCallArgRef(NUM_0);
-    Local<JSValueRef> messageArg = runtimeCallInfo->GetCallArgRef(NUM_1);
     Local<JSValueRef> appearingTimeArg = runtimeCallInfo->GetCallArgRef(NUM_2);
     Local<JSValueRef> disappearingTimeArg = runtimeCallInfo->GetCallArgRef(NUM_3);
     Local<JSValueRef> appearingTimeWithContinuousOperationArg = runtimeCallInfo->GetCallArgRef(NUM_4);
@@ -3549,41 +3618,41 @@ ArkUINativeModuleValue CommonBridge::SetBindTips(ArkUIRuntimeCallInfo* runtimeCa
     Local<JSValueRef> arrowWidthArg = runtimeCallInfo->GetCallArgRef(NUM_8);
     Local<JSValueRef> arrowHeightArg = runtimeCallInfo->GetCallArgRef(NUM_9);
     auto nativeNode = nodePtr(nodeArg->ToNativePointer(vm)->Value());
-
-    std::string message = messageArg->ToString(vm)->ToString(vm);
-
-    ArkUIBindTipsOptionsTime tipsOptionsTime {
-        .appearingTime = 700.0f,    // 700.0f : Default appearing time for BindTips,
-        .disappearingTime = 300.0f, // 300.0f : Default disappearing time for BindTips
-        .appearingTimeWithContinuousOperation =
-            300.0f, // 300.0f : Default appearing time with continuous operation for BindTips
-        .disappearingTimeWithContinuousOperation =
-            0.0f // 0.0f : Default disappearing time with continuous operation for BindTips
+    std::string message;
+    RefPtr<SpanString> styledString;
+    if (!ParseTipsMessage(runtimeCallInfo, vm, message, styledString)) {
+        return panda::JSValueRef::Undefined(vm);
+    }
+    ArkUIBindTipsOptionsTime timeOptions {
+        .appearingTime = 700.0f,                         // 700.0f : Default appearing time
+        .disappearingTime = 300.0f,                      // 300.0f : Default disappearing time
+        .appearingTimeWithContinuousOperation = 300.0f,  // 300.0f : Default continous appearing time
+        .disappearingTimeWithContinuousOperation = 0.0f  // 0.0f : Default continous disappearing time
     };
-    ParseTipsOptionsTime(vm, tipsOptionsTime, appearingTimeArg, tipsOptionsTime.appearingTime);
-    ParseTipsOptionsTime(vm, tipsOptionsTime, disappearingTimeArg, tipsOptionsTime.disappearingTime);
-    ParseTipsOptionsTime(vm, tipsOptionsTime, appearingTimeWithContinuousOperationArg,
-        tipsOptionsTime.appearingTimeWithContinuousOperation);
-    ParseTipsOptionsTime(vm, tipsOptionsTime, disappearingTimeWithContinuousOperationArg,
-        tipsOptionsTime.disappearingTimeWithContinuousOperation);
-
-    ArkUIBindTipsOptionsArrow bindTipsOptionsArrow;
-
-    bindTipsOptionsArrow.enableArrow = (enableArrowArg->IsBoolean()) ? enableArrowArg->ToBoolean(vm)->Value() : true;
-
+    ParseTipsOptionsTime(vm, timeOptions, appearingTimeArg, timeOptions.appearingTime);
+    ParseTipsOptionsTime(vm, timeOptions, disappearingTimeArg, timeOptions.disappearingTime);
+    ParseTipsOptionsTime(
+        vm, timeOptions, appearingTimeWithContinuousOperationArg, timeOptions.appearingTimeWithContinuousOperation);
+    ParseTipsOptionsTime(vm, timeOptions, disappearingTimeWithContinuousOperationArg,
+        timeOptions.disappearingTimeWithContinuousOperation);
+    ArkUIBindTipsOptionsArrow arrowOptions;
+    arrowOptions.enableArrow = (enableArrowArg->IsBoolean()) ? enableArrowArg->ToBoolean(vm)->Value() : true;
     std::string arrowPointPosition;
     if (arrowPointPositionArg->IsString(vm)) {
         arrowPointPosition = arrowPointPositionArg->ToString(vm)->ToString(vm);
-        bindTipsOptionsArrow.arrowPointPosition = arrowPointPosition.c_str();
+        arrowOptions.arrowPointPosition = arrowPointPosition.c_str();
+    }
+    ParseTipsOptionsArrowSize(vm, arrowWidthArg, arrowOptions.arrowWidthValue, arrowOptions.arrowWidthUnit);
+    ParseTipsOptionsArrowSize(vm, arrowHeightArg, arrowOptions.arrowHeightValue, arrowOptions.arrowHeightUnit);
+    if (styledString) {
+        auto tipsParam = AceType::MakeRefPtr<PopupParam>();
+        ParseTipsParam(tipsParam, timeOptions, arrowOptions);
+        auto* frameNode = reinterpret_cast<FrameNode*>(nativeNode);
+        ViewAbstract::BindTips(tipsParam, AceType::Claim(frameNode), styledString);
+    } else {
+        GetArkUINodeModifiers()->getCommonModifier()->setBindTips(
+            nativeNode, message.c_str(), timeOptions, arrowOptions);
     }
-
-    ParseTipsOptionsArrowSize(
-        vm, arrowWidthArg, bindTipsOptionsArrow.arrowWidthValue, bindTipsOptionsArrow.arrowWidthUnit);
-        
-    ParseTipsOptionsArrowSize(
-        vm, arrowHeightArg, bindTipsOptionsArrow.arrowHeightValue, bindTipsOptionsArrow.arrowHeightUnit);
-    GetArkUINodeModifiers()->getCommonModifier()->setBindTips(
-        nativeNode, message.c_str(), tipsOptionsTime, bindTipsOptionsArrow);
     return panda::JSValueRef::Undefined(vm);
 }
 
diff --git a/frameworks/bridge/declarative_frontend/jsview/js_popups.cpp b/frameworks/bridge/declarative_frontend/jsview/js_popups.cpp
index b9708427f0332daba5675d4eec375f8492fedf2b..50cd3016a5e537756a7c4c1270a2c9461f663073 100644
--- a/frameworks/bridge/declarative_frontend/jsview/js_popups.cpp
+++ b/frameworks/bridge/declarative_frontend/jsview/js_popups.cpp
@@ -25,8 +25,10 @@
 #include "core/components/popup/popup_theme.h"
 #include "core/components_ng/base/view_abstract_model_ng.h"
 #include "core/components_ng/base/view_stack_model.h"
+#include "core/components_ng/pattern/text/span/span_string.h"
 
 #include "bridge/declarative_frontend/jsview/js_popups.h"
+#include "bridge/declarative_frontend/style_string/js_span_string.h"
 
 namespace OHOS::Ace::Framework {
 namespace {
@@ -1200,7 +1202,19 @@ void JSViewAbstract::JsBindTips(const JSCallbackInfo& info)
     auto tipsParam = AceType::MakeRefPtr<PopupParam>();
     CHECK_NULL_VOID(tipsParam);
     // Set message to tipsParam
-    tipsParam->SetMessage(info[0]->ToString());
+    std::string value;
+    RefPtr<SpanString> styledString;
+    if (info[0]->IsString()) {
+        value = info[0]->ToString();
+    } else {
+        auto* spanString = JSRef<JSObject>::Cast(info[0])->Unwrap<JSSpanString>();
+        if (!spanString) {
+            JSViewAbstract::ParseJsString(info[0], value);
+        } else {
+            styledString = spanString->GetController();
+        }
+    }
+    tipsParam->SetMessage(value);
     // Set bindTipsOptions to tipsParam
     JSRef<JSObject> tipsObj;
     if (info.Length() > PARAMETER_LENGTH_FIRST && info[1]->IsObject()) {
@@ -1214,7 +1228,7 @@ void JSViewAbstract::JsBindTips(const JSCallbackInfo& info)
         ParseTipsArrowPositionParam(tipsObj, tipsParam);
         ParseTipsArrowSizeParam(tipsObj, tipsParam);
     }
-    ViewAbstractModel::GetInstance()->BindTips(tipsParam);
+    ViewAbstractModel::GetInstance()->BindTips(tipsParam, styledString);
 }
 
 void JSViewAbstract::SetPopupDismiss(
diff --git a/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.cpp b/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.cpp
index cdcd10944d3353a3a07c4823a5e5187f69e0bbdc..9325b530e18c2b6a4f3b58202c010a65934a67fe 100755
--- a/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.cpp
+++ b/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.cpp
@@ -1441,7 +1441,7 @@ void ViewAbstractModelImpl::BindPopup(const RefPtr<PopupParam>& param, const Ref
     }
 }
 
-void ViewAbstractModelImpl::BindTips(const RefPtr<PopupParam>& param)
+void ViewAbstractModelImpl::BindTips(const RefPtr<PopupParam>& param, const RefPtr<SpanString>& spanString)
 {
     ViewStackProcessor::GetInstance()->GetCoverageComponent();
     auto tipsComponent = ViewStackProcessor::GetInstance()->GetPopupComponent(true);
diff --git a/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.h b/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.h
index 60565112c5275c45cb669f70fd71e4af55a5c9d0..80b3b4f87b647696cf9ba773dc2f92e1700f0326 100755
--- a/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.h
+++ b/frameworks/bridge/declarative_frontend/jsview/models/view_abstract_model_impl.h
@@ -22,6 +22,10 @@
 #include "core/components_ng/pattern/menu/menu_pattern.h"
 #include "core/components_ng/property/progress_mask_property.h"
 
+namespace OHOS::Ace {
+class SpanString;
+}
+
 namespace OHOS::Ace::Framework {
 
 class ViewAbstractModelImpl : public ViewAbstractModel {
@@ -273,7 +277,7 @@ public:
 
     void BindBackground(std::function<void()>&& buildFunc, const Alignment& align) override;
     void BindPopup(const RefPtr<PopupParam>& param, const RefPtr<AceType>& customNode) override;
-    void BindTips(const RefPtr<PopupParam>& param) override;
+    void BindTips(const RefPtr<PopupParam>& param, const RefPtr<OHOS::Ace::SpanString>& sapnString) override;
     int32_t OpenPopup(const RefPtr<PopupParam>& param, const RefPtr<NG::UINode>& customNode) override
     {
         return 0;
diff --git a/frameworks/core/components_ng/base/view_abstract.cpp b/frameworks/core/components_ng/base/view_abstract.cpp
index ac8e0d66c60f9080e65de1e71469d8dadf93ea29..2fa5eb0d79557a902e2aafec2b836f354dfd09d3 100644
--- a/frameworks/core/components_ng/base/view_abstract.cpp
+++ b/frameworks/core/components_ng/base/view_abstract.cpp
@@ -2090,7 +2090,8 @@ void ViewAbstract::BindPopup(
     }
 }
 
-void ViewAbstract::BindTips(const RefPtr<PopupParam>& param, const RefPtr<FrameNode>& targetNode)
+void ViewAbstract::BindTips(
+    const RefPtr<PopupParam>& param, const RefPtr<FrameNode>& targetNode, const RefPtr<SpanString>& spanString)
 {
     CHECK_NULL_VOID(param);
     CHECK_NULL_VOID(targetNode);
@@ -2117,11 +2118,11 @@ void ViewAbstract::BindTips(const RefPtr<PopupParam>& param, const RefPtr<FrameN
             showInSubWindow = true;
         }
     }
-    HandleHoverTipsInfo(param, targetNode, tipsInfo, showInSubWindow, instanceId);
+    HandleHoverTipsInfo(param, targetNode, tipsInfo, showInSubWindow, spanString);
 }
 
 void ViewAbstract::HandleHoverTipsInfo(const RefPtr<PopupParam>& param, const RefPtr<FrameNode>& targetNode,
-    PopupInfo& tipsInfo, bool showInSubWindow, int32_t instanceId)
+    PopupInfo& tipsInfo, bool showInSubWindow, const RefPtr<SpanString>& spanString)
 {
     CHECK_NULL_VOID(param);
     CHECK_NULL_VOID(targetNode);
@@ -2129,12 +2130,15 @@ void ViewAbstract::HandleHoverTipsInfo(const RefPtr<PopupParam>& param, const Re
     auto targetTag = targetNode->GetTag();
     auto popupId = tipsInfo.popupId;
     auto popupNode = tipsInfo.popupNode;
+    auto context = targetNode->GetContext();
+    CHECK_NULL_VOID(context);
+    auto instanceId = context->GetInstanceId();
     if (!tipsInfo.isTips && popupNode) {
         return;
     }
     RefPtr<BubblePattern> popupPattern;
     tipsInfo.markNeedUpdate = true;
-    popupNode = BubbleView::CreateBubbleNode(targetTag, targetId, param);
+    popupNode = BubbleView::CreateBubbleNode(targetTag, targetId, param, spanString);
     if (popupNode) {
         popupId = popupNode->GetId();
     }
diff --git a/frameworks/core/components_ng/base/view_abstract.h b/frameworks/core/components_ng/base/view_abstract.h
index 751c0c2be8d9b6ac6e03584b6e0be8c407cf1aa0..f1d86255d62c472cb9303253d820973c7fafa49d 100644
--- a/frameworks/core/components_ng/base/view_abstract.h
+++ b/frameworks/core/components_ng/base/view_abstract.h
@@ -61,6 +61,7 @@ class BrightnessBlender;
 namespace OHOS::Ace {
 class ImageSourceInfo;
 class BasicShape;
+class SpanString;
 }
 
 namespace OHOS::Ace::NG {
@@ -391,9 +392,10 @@ public:
     // Bind properties
     static void BindPopup(const RefPtr<PopupParam> &param, const RefPtr<FrameNode> &targetNode,
         const RefPtr<UINode> &customNode);
-    static void BindTips(const RefPtr<PopupParam>& param, const RefPtr<FrameNode>& targetNode);
+    static void BindTips(
+        const RefPtr<PopupParam>& param, const RefPtr<FrameNode>& targetNode, const RefPtr<SpanString>& spanString);
     static void HandleHoverTipsInfo(const RefPtr<PopupParam>& param, const RefPtr<FrameNode>& targetNode,
-        PopupInfo& tipsInfo, bool showInSubWindow, int32_t instanceId);
+        PopupInfo& tipsInfo, bool showInSubWindow, const RefPtr<SpanString>& spanString);
     static void AddHoverEventForTips(const RefPtr<PopupParam>& param, const RefPtr<FrameNode>& targetNode,
         PopupInfo& tipsInfo, bool showInSubWindow);
     static RefPtr<OverlayManager> GetCurOverlayManager(const RefPtr<UINode>& node);
diff --git a/frameworks/core/components_ng/base/view_abstract_model.h b/frameworks/core/components_ng/base/view_abstract_model.h
index 978b44b3afbbea93046aea8667262acff98e9a94..63f8ea38ba4e98c46c578be19f1e600ab618ba6a 100755
--- a/frameworks/core/components_ng/base/view_abstract_model.h
+++ b/frameworks/core/components_ng/base/view_abstract_model.h
@@ -59,7 +59,7 @@ enum class ResponseType : int32_t {
     RIGHT_CLICK = 0,
     LONG_PRESS,
 };
-
+class SpanString;
 class ACE_FORCE_EXPORT ViewAbstractModel {
 public:
     static ViewAbstractModel* GetInstance();
@@ -379,7 +379,7 @@ public:
 
     // popup and menu
     virtual void BindPopup(const RefPtr<PopupParam>& param, const RefPtr<AceType>& customNode) = 0;
-    virtual void BindTips(const RefPtr<PopupParam>& param) = 0;
+    virtual void BindTips(const RefPtr<PopupParam>& param, const RefPtr<SpanString>& spanString) = 0;
     virtual int32_t OpenPopup(const RefPtr<PopupParam>& param, const RefPtr<NG::UINode>& customNode) = 0;
     virtual int32_t UpdatePopup(const RefPtr<PopupParam>& param, const RefPtr<NG::UINode>& customNode) = 0;
     virtual int32_t ClosePopup(const RefPtr<NG::UINode>& customNode) = 0;
diff --git a/frameworks/core/components_ng/base/view_abstract_model_ng.h b/frameworks/core/components_ng/base/view_abstract_model_ng.h
index 6b9d5e3ae0e92523cc9ece5c95da9e717c432af4..d452f9f0d707ec0df5646dc0bd9d6915b0f0ea68 100755
--- a/frameworks/core/components_ng/base/view_abstract_model_ng.h
+++ b/frameworks/core/components_ng/base/view_abstract_model_ng.h
@@ -43,6 +43,9 @@
 #include "core/image/image_source_info.h"
 #include "core/pipeline_ng/pipeline_context.h"
 
+namespace OHOS::Ace {
+class SpanString;
+}
 namespace OHOS::Ace::NG {
 class ACE_FORCE_EXPORT ViewAbstractModelNG : public ViewAbstractModel {
 public:
@@ -1296,10 +1299,10 @@ public:
         ViewAbstract::BindPopup(param, AceType::Claim(targetNode), AceType::DynamicCast<UINode>(customNode));
     }
 
-    void BindTips(const RefPtr<PopupParam>& param) override
+    void BindTips(const RefPtr<PopupParam>& param, const RefPtr<OHOS::Ace::SpanString>& spanString) override
     {
         auto targetNode = ViewStackProcessor::GetInstance()->GetMainFrameNode();
-        ViewAbstract::BindTips(param, AceType::Claim(targetNode));
+        ViewAbstract::BindTips(param, AceType::Claim(targetNode), spanString);
     }
 
     int32_t OpenPopup(const RefPtr<PopupParam>& param, const RefPtr<NG::UINode>& customNode) override
diff --git a/frameworks/core/components_ng/base/view_abstract_model_static.h b/frameworks/core/components_ng/base/view_abstract_model_static.h
index 89d2a0c44f44a9aee04b0b2beccf23fa07ce372e..4a9f2de094e686c1bfe575920ef569ece16154d7 100755
--- a/frameworks/core/components_ng/base/view_abstract_model_static.h
+++ b/frameworks/core/components_ng/base/view_abstract_model_static.h
@@ -114,6 +114,13 @@ public:
         CHECK_NULL_VOID(targetNode);
         ViewAbstract::BindPopup(param, AceType::Claim(targetNode), AceType::DynamicCast<UINode>(customNode));
     }
+
+    static void BindTips(FrameNode* targetNode, const RefPtr<PopupParam>& param, const RefPtr<SpanString>& spanString)
+    {
+        CHECK_NULL_VOID(targetNode);
+        ViewAbstract::BindTips(param, AceType::Claim(targetNode), spanString);
+    }
+
     static void SetAccessibilityVirtualNode(FrameNode* frameNode, std::function<RefPtr<NG::UINode>()>&& buildFunc);
     static void DisableOnAccessibilityHover(FrameNode* frameNode);
     static void SetOnAccessibilityHover(FrameNode* frameNode, OnAccessibilityHoverFunc &&onAccessibilityHoverEventFunc);
diff --git a/frameworks/core/components_ng/pattern/bubble/bubble_pattern.h b/frameworks/core/components_ng/pattern/bubble/bubble_pattern.h
index 5a2bebc7634ac4c85cb1f6d4183f53111c5d697d..e629adb0609d327c458c67f08718e0e11d431d33 100644
--- a/frameworks/core/components_ng/pattern/bubble/bubble_pattern.h
+++ b/frameworks/core/components_ng/pattern/bubble/bubble_pattern.h
@@ -158,6 +158,11 @@ public:
         messageNode_ = messageNode;
     }
 
+    RefPtr<FrameNode> GetMessageNode()
+    {
+        return messageNode_;
+    }
+
     void SetCustomPopupTag(bool isCustomPopup)
     {
         isCustomPopup_ = isCustomPopup;
diff --git a/frameworks/core/components_ng/pattern/bubble/bubble_view.cpp b/frameworks/core/components_ng/pattern/bubble/bubble_view.cpp
index 44df71cf2e6a9cf51c66854443a339b4ac0a17fa..ccd7f70149a4b4dcc4f1d364ab0500ee155f04ed 100644
--- a/frameworks/core/components_ng/pattern/bubble/bubble_view.cpp
+++ b/frameworks/core/components_ng/pattern/bubble/bubble_view.cpp
@@ -133,8 +133,8 @@ void SetHitTestMode(RefPtr<FrameNode>& popupNode, bool isBlockEvent)
     }
 }
 
-RefPtr<FrameNode> BubbleView::CreateBubbleNode(
-    const std::string& targetTag, int32_t targetId, const RefPtr<PopupParam>& param)
+RefPtr<FrameNode> BubbleView::CreateBubbleNode(const std::string& targetTag, int32_t targetId,
+    const RefPtr<PopupParam>& param, const RefPtr<SpanString>& spanString)
 {
     auto popupId = ElementRegister::GetInstance()->MakeUniqueId();
     ACE_LAYOUT_SCOPED_TRACE("Create[%s][self:%d]", V2::POPUP_ETS_TAG, popupId);
@@ -310,6 +310,13 @@ RefPtr<FrameNode> BubbleView::CreateBubbleNode(
             renderContext->UpdateBackShadow(shadow);
         }
     }
+    if (spanString) {
+        auto messageNode = bubblePattern->GetMessageNode();
+        if (messageNode) {
+            auto textPattern = messageNode->GetPattern<TextPattern>();
+            textPattern->SetStyledString(spanString, false);
+        }
+    }
     child->MountToParent(popupNode);
     return popupNode;
 }
diff --git a/frameworks/core/components_ng/pattern/bubble/bubble_view.h b/frameworks/core/components_ng/pattern/bubble/bubble_view.h
index 4b09517200ce7cfec7f31594edf520431095e13a..e204f3310d551babdbdf34194c6dde99ebc49cb4 100644
--- a/frameworks/core/components_ng/pattern/bubble/bubble_view.h
+++ b/frameworks/core/components_ng/pattern/bubble/bubble_view.h
@@ -26,6 +26,7 @@
 #include "core/components/common/properties/popup_param.h"
 #include "core/components_ng/base/frame_node.h"
 #include "core/components_ng/pattern/text/text_layout_property.h"
+#include "core/components_ng/pattern/text/span/span_string.h"
 #include "core/components_ng/pattern/text/text_styles.h"
 #include "core/pipeline_ng/ui_task_scheduler.h"
 
@@ -33,8 +34,8 @@ namespace OHOS::Ace::NG {
 
 class ACE_EXPORT BubbleView {
 public:
-    static RefPtr<FrameNode> CreateBubbleNode(
-        const std::string& tag, int32_t targetId, const RefPtr<PopupParam>& param);
+    static RefPtr<FrameNode> CreateBubbleNode(const std::string& tag, int32_t targetId, const RefPtr<PopupParam>& param,
+        const RefPtr<SpanString>& spanString = nullptr);
     static RefPtr<FrameNode> CreateCustomBubbleNode(const std::string& targetTag, int32_t targetId,
         const RefPtr<UINode>& customNode, const RefPtr<PopupParam>& param);
     static RefPtr<FrameNode> CreateMessage(const std::string& message, bool isUseCustom);
diff --git a/frameworks/core/interfaces/native/implementation/common_method_modifier.cpp b/frameworks/core/interfaces/native/implementation/common_method_modifier.cpp
index fc81310c7783500168560e001d6a294ed8fcdae4..2808e6fa377b6b07c609cb6895de3a3965e5eb1e 100644
--- a/frameworks/core/interfaces/native/implementation/common_method_modifier.cpp
+++ b/frameworks/core/interfaces/native/implementation/common_method_modifier.cpp
@@ -1474,6 +1474,56 @@ GeometryTransitionOptions Convert(const Ark_GeometryTransitionOptions& src)
     return dst;
 }
 
+template<>
+RefPtr<PopupParam> Convert(const Ark_TipsOptions& src)
+{
+    auto popupParam = AceType::MakeRefPtr<PopupParam>();
+    auto appearingTimeOpt = Converter::OptConvert<int>(src.appearingTime);
+    if (appearingTimeOpt.has_value()) {
+        popupParam->SetAppearingTime(appearingTimeOpt.value());
+    }
+    auto disappearingTimeOpt = Converter::OptConvert<int>(src.disappearingTime);
+    if (disappearingTimeOpt.has_value()) {
+        popupParam->SetDisappearingTime(disappearingTimeOpt.value());
+    }
+    auto appearingTimeWithContinuousOperationOpt =
+        Converter::OptConvert<int>(src.appearingTimeWithContinuousOperation);
+    if (appearingTimeWithContinuousOperationOpt.has_value()) {
+        popupParam->SetAppearingTimeWithContinuousOperation(appearingTimeWithContinuousOperationOpt.value());
+    }
+    auto disappearingTimeWithContinuousOperationOpt =
+        Converter::OptConvert<int>(src.disappearingTimeWithContinuousOperation);
+    if (disappearingTimeWithContinuousOperationOpt.has_value()) {
+        popupParam->SetAppearingTime(disappearingTimeWithContinuousOperationOpt.value());
+    }
+    auto enableArrowOpt = Converter::OptConvert<bool>(src.enableArrow);
+    if (enableArrowOpt.has_value()) {
+        popupParam->SetEnableArrow(enableArrowOpt.value());
+    }
+    if (enableArrowOpt.value()) {
+        auto arrowPointPositionOpt = Converter::OptConvert<Dimension>(src.arrowPointPosition);
+        if (arrowPointPositionOpt.has_value()) {
+            popupParam->SetArrowOffset(arrowPointPositionOpt.value());
+        }
+        auto arrowWidthOpt = Converter::OptConvert<CalcDimension>(src.arrowWidth);
+        Validator::ValidateNonNegative(arrowWidthOpt);
+        Validator::ValidateNonPercent(arrowWidthOpt);
+        if (arrowWidthOpt.has_value()) {
+            popupParam->SetArrowWidth(arrowWidthOpt.value());
+        }
+        auto arrowHeightOpt = Converter::OptConvert<CalcDimension>(src.arrowHeight);
+        Validator::ValidateNonNegative(arrowHeightOpt);
+        Validator::ValidateNonPercent(arrowHeightOpt);
+        if (arrowHeightOpt.has_value()) {
+            popupParam->SetArrowHeight(arrowHeightOpt.value());
+        }
+    }
+    popupParam->SetBlockEvent(false);
+    popupParam->SetTipsFlag(true);
+    popupParam->SetShowInSubWindow(true);
+    return popupParam;
+}
+
 template<>
 RefPtr<PopupParam> Convert(const Ark_PopupOptions& src)
 {
@@ -5278,9 +5328,26 @@ void BindTipsImpl(Ark_NativePointer node,
 {
     auto frameNode = reinterpret_cast<FrameNode *>(node);
     CHECK_NULL_VOID(frameNode);
-    //auto convValue = Converter::Convert<type>(message);
-    //auto convValue = Converter::OptConvert<type>(message); // for enums
-    //CommonMethodModelNG::SetBindTips(frameNode, convValue);
+    auto popupParam = AceType::MakeRefPtr<PopupParam>();
+    RefPtr<SpanString> styledString;
+    auto tipsOption = Converter::OptConvertPtr<Ark_TipsOptions>(options);
+    if (tipsOption.has_value()) {
+        popupParam = Converter::Convert<RefPtr<PopupParam>>(tipsOption.value());
+    }
+    Converter::VisitUnion(*message,
+        [frameNode, popupParam, styledString] (const Ark_ResourceStr& value) {
+            auto message = Converter::OptConvert<std::string>(value);
+            if (message.has_value()) {
+                popupParam->SetMessage(message.value());
+            }
+            ViewAbstractModelStatic::BindTips(frameNode, popupParam, styledString);
+        },
+        [] (const Ark_StyledString& value) {
+            return;
+        },
+        [] () {
+            return;
+        });
 }
 void BindPopupImpl(Ark_NativePointer node,
                    const Opt_Boolean* show,
diff --git a/frameworks/core/interfaces/native/node/node_common_modifier.cpp b/frameworks/core/interfaces/native/node/node_common_modifier.cpp
index 7305eef4b152f95a732ec8ab802900f2303045e3..e0fea709a109e70490a15f0a214bd1f7c7065c09 100644
--- a/frameworks/core/interfaces/native/node/node_common_modifier.cpp
+++ b/frameworks/core/interfaces/native/node/node_common_modifier.cpp
@@ -34,6 +34,7 @@
 #include "core/components_ng/pattern/shape/shape_abstract_model_ng.h"
 #include "core/components_ng/pattern/text/image_span_view.h"
 #include "core/components_ng/pattern/text/span_model_ng.h"
+#include "core/components_ng/pattern/text/span/span_string.h"
 #include "core/components_ng/pattern/text/text_model_ng.h"
 #include "core/components_ng/pattern/toggle/toggle_model_ng.h"
 #include "core/components_ng/pattern/checkbox/checkbox_model_ng.h"
@@ -2395,7 +2396,7 @@ void SetBindTips(ArkUINodeHandle node, ArkUI_CharPtr message, ArkUIBindTipsOptio
     }
     tipsParam->SetBlockEvent(false);
     tipsParam->SetTipsFlag(true);
-    ViewAbstract::BindTips(tipsParam, AceType::Claim(frameNode));
+    ViewAbstract::BindTips(tipsParam, AceType::Claim(frameNode), nullptr);
 }
 
 void ResetBindTips(ArkUINodeHandle node)
@@ -2405,7 +2406,8 @@ void ResetBindTips(ArkUINodeHandle node)
     auto tipsParam = AceType::MakeRefPtr<PopupParam>();
     tipsParam->SetBlockEvent(false);
     tipsParam->SetTipsFlag(true);
-    ViewAbstract::BindTips(tipsParam, AceType::Claim(frameNode));
+    RefPtr<SpanString> styledString;
+    ViewAbstract::BindTips(tipsParam, AceType::Claim(frameNode), styledString);
 }
 
 void SetOffset(ArkUINodeHandle node, const ArkUI_Float32* number, const ArkUI_Int32* unit)
diff --git a/test/unittest/core/base/view_abstract_test_ng.h b/test/unittest/core/base/view_abstract_test_ng.h
index 633a894df821f696ffcddfa770ab94bb4070df73..1cde6abb0fcd284e96b1498b23853db61895352c 100644
--- a/test/unittest/core/base/view_abstract_test_ng.h
+++ b/test/unittest/core/base/view_abstract_test_ng.h
@@ -23,6 +23,7 @@
 #include "test/mock/core/pipeline/mock_pipeline_context.h"
 
 #include "base/error/error_code.h"
+#include "core/components/common/layout/position_param.h"
 #include "core/components/common/properties/decoration.h"
 #include "core/components/popup/popup_theme.h"
 #include "core/components_ng/base/frame_node.h"
@@ -39,16 +40,16 @@
 #include "core/components_ng/pattern/navigation/navigation_model_ng.h"
 #include "core/components_ng/pattern/navigator/navigator_model_ng.h"
 #include "core/components_ng/pattern/navrouter/navrouter_model_ng.h"
+#include "core/components_ng/pattern/panel/sliding_panel_model_ng.h"
 #include "core/components_ng/pattern/picker/datepicker_model_ng.h"
 #include "core/components_ng/pattern/root/root_pattern.h"
 #include "core/components_ng/pattern/stepper/stepper_item_model_ng.h"
+#include "core/components_ng/pattern/text/span/span_string.h"
 #include "core/components_ng/pattern/text/text_model_ng.h"
 #include "core/components_ng/property/property.h"
 #include "core/interfaces/native/node/node_api.h"
+#include "core/pipeline/base/element.h"
 #include "core/pipeline/base/element_register.h"
-#include "frameworks/core/components/common/layout/position_param.h"
-#include "frameworks/core/components_ng/pattern/panel/sliding_panel_model_ng.h"
-#include "frameworks/core/pipeline/base/element.h"
 
 #undef private
 #undef protected
diff --git a/test/unittest/core/base/view_abstract_test_ng_for_property_config.cpp b/test/unittest/core/base/view_abstract_test_ng_for_property_config.cpp
index b7f9220defd5adde6ba6a3108df0b053747e42a6..cc5d394d7f72f1f3f2b5bff6adb7a7dab68f8548 100644
--- a/test/unittest/core/base/view_abstract_test_ng_for_property_config.cpp
+++ b/test/unittest/core/base/view_abstract_test_ng_for_property_config.cpp
@@ -1364,6 +1364,7 @@ HWTEST_F(ViewAbstractTestNg, ViewAbstractBindTipsTest001, TestSize.Level1)
     const RefPtr<FrameNode> targetNode2 = FrameNode::CreateFrameNode("three", 3, AceType::MakeRefPtr<Pattern>());
     auto param = AceType::MakeRefPtr<PopupParam>();
     auto param2 = AceType::MakeRefPtr<PopupParam>();
+    auto spanString = AceType::MakeRefPtr<SpanString>(u"tipTest");
 
     /**
      * @tc.steps: step2. get tipsInfo  and change some params.
@@ -1393,7 +1394,7 @@ HWTEST_F(ViewAbstractTestNg, ViewAbstractBindTipsTest001, TestSize.Level1)
      * @tc.steps: step3. Call BindTips many times.
      * @tc.expected: popupNode in overlayManager of targetNode not null
      */
-    ViewAbstract::BindTips(param, targetNode);
+    ViewAbstract::BindTips(param, targetNode, spanString);
     overlayManager->HideTips(targetNode->GetId(), info, 300);
     auto popupInfo = overlayManager->GetPopupInfo(targetNode->GetId());
     auto popupNode = popupInfo.popupNode;
@@ -1403,7 +1404,7 @@ HWTEST_F(ViewAbstractTestNg, ViewAbstractBindTipsTest001, TestSize.Level1)
     ASSERT_NE(context1, nullptr);
     auto subwindow = Subwindow::CreateSubwindow(context1->GetInstanceId());
     SubwindowManager::GetInstance()->AddSubwindow(context1->GetInstanceId(), subwindow);
-    ViewAbstract::BindTips(param, targetNode);
+    ViewAbstract::BindTips(param, targetNode, spanString);
     EXPECT_NE(overlayManager->GetPopupInfo(targetNode->GetId()).popupNode, nullptr);
 
     /**
@@ -1411,7 +1412,7 @@ HWTEST_F(ViewAbstractTestNg, ViewAbstractBindTipsTest001, TestSize.Level1)
      * @tc.expected: popupNode in overlayManager of targetNode not null
      */
     param2->SetUseCustomComponent(true);
-    ViewAbstract::BindTips(param2, targetNode2);
+    ViewAbstract::BindTips(param2, targetNode2, spanString);
     EXPECT_NE(overlayManager->GetPopupInfo(targetNode->GetId()).popupNode, nullptr);
 }
 
@@ -1511,6 +1512,7 @@ HWTEST_F(ViewAbstractTestNg, ViewAbstractHandleHoverTipsInfoTest001, TestSize.Le
      */
     const RefPtr<FrameNode> targetNode = FrameNode::CreateFrameNode("two", 2, AceType::MakeRefPtr<Pattern>());
     auto param = AceType::MakeRefPtr<PopupParam>();
+    auto spanString = AceType::MakeRefPtr<SpanString>(u"tipTest");
     auto container = Container::Current();
     ASSERT_NE(container, nullptr);
     auto pipelineContext = container->GetPipelineContext();
@@ -1522,13 +1524,13 @@ HWTEST_F(ViewAbstractTestNg, ViewAbstractHandleHoverTipsInfoTest001, TestSize.Le
 
     auto popupInfo = overlayManager->GetPopupInfo(targetNode->GetId());
     popupInfo.isTips = true;
-    ViewAbstract::HandleHoverTipsInfo(param, targetNode, popupInfo, false, 1);
+    ViewAbstract::HandleHoverTipsInfo(param, targetNode, popupInfo, false, spanString);
     for (const auto& destroyCallback : targetNode->destroyCallbacksMap_) {
         if (destroyCallback.second) {
             destroyCallback.second();
         }
     }
-    ViewAbstract::HandleHoverTipsInfo(param, targetNode, popupInfo, true, 1);
+    ViewAbstract::HandleHoverTipsInfo(param, targetNode, popupInfo, true, spanString);
     for (const auto& destroyCallback : targetNode->destroyCallbacksMap_) {
         if (destroyCallback.second) {
             destroyCallback.second();