diff --git a/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.cpp b/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.cpp
index e307c21d5c0e0508cdb8307ec2337cfeda54b9a2..77e2ece1d24809c1efe0e02dedb0a315ffeffcc3 100644
--- a/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.cpp
+++ b/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.cpp
@@ -1965,4 +1965,106 @@ void NavigationModelNG::SetSystemBarStyle(const RefPtr<SystemBarStyle>& style)
     CHECK_NULL_VOID(pattern);
     pattern->SetSystemBarStyle(style);
 }
+
+RefPtr<FrameNode> NavigationModelNG::CreateFrameNode(int32_t nodeId)
+{
+    auto navigationGroupNode = NavigationGroupNode::GetOrCreateGroupNode(
+        V2::NAVIGATION_VIEW_ETS_TAG, nodeId, []() { return AceType::MakeRefPtr<NavigationPattern>(); });
+    // navBar node
+    if (!navigationGroupNode->GetNavBarNode()) {
+        int32_t navBarNodeId = ElementRegister::GetInstance()->MakeUniqueId();
+        auto navBarNode = NavBarNode::GetOrCreateNavBarNode(
+            V2::NAVBAR_ETS_TAG, navBarNodeId, []() { return AceType::MakeRefPtr<NavBarPattern>(); });
+        auto navBarRenderContext = navBarNode->GetRenderContext();
+        CHECK_NULL_RETURN(navBarRenderContext, nullptr);
+        navBarRenderContext->UpdateClipEdge(true);
+        navigationGroupNode->AddChild(navBarNode);
+        navigationGroupNode->SetNavBarNode(navBarNode);
+
+        // titleBar node
+        if (!navBarNode->GetTitleBarNode()) {
+            int32_t titleBarNodeId = ElementRegister::GetInstance()->MakeUniqueId();
+            auto titleBarNode = TitleBarNode::GetOrCreateTitleBarNode(
+                V2::TITLE_BAR_ETS_TAG, titleBarNodeId, []() { return AceType::MakeRefPtr<TitleBarPattern>(); });
+            navBarNode->AddChild(titleBarNode);
+            navBarNode->SetTitleBarNode(titleBarNode);
+        }
+
+        // navBar content node
+        if (!navBarNode->GetNavBarContentNode()) {
+            int32_t navBarContentNodeId = ElementRegister::GetInstance()->MakeUniqueId();
+            auto navBarContentNode = FrameNode::GetOrCreateFrameNode(V2::NAVBAR_CONTENT_ETS_TAG, navBarContentNodeId,
+                []() { return AceType::MakeRefPtr<LinearLayoutPattern>(true); });
+            auto navBarContentRenderContext = navBarContentNode->GetRenderContext();
+            CHECK_NULL_RETURN(navBarContentRenderContext, nullptr);
+            navBarContentRenderContext->UpdateClipEdge(true);
+            navBarNode->AddChild(navBarContentNode);
+            navBarNode->SetNavBarContentNode(navBarContentNode);
+        }
+
+        // toolBar node
+        if (!navBarNode->GetToolBarNode()) {
+            int32_t toolBarNodeId = ElementRegister::GetInstance()->MakeUniqueId();
+            auto toolBarNode = NavToolbarNode::GetOrCreateToolbarNode(
+                V2::TOOL_BAR_ETS_TAG, toolBarNodeId, []() { return AceType::MakeRefPtr<NavToolbarPattern>(); });
+            navBarNode->AddChild(toolBarNode);
+            navBarNode->SetToolBarNode(toolBarNode);
+            navBarNode->SetPreToolBarNode(toolBarNode);
+            navBarNode->UpdatePrevToolBarIsCustom(false);
+        }
+        auto navBarLayoutProperty = navBarNode->GetLayoutProperty<NavBarLayoutProperty>();
+        CHECK_NULL_RETURN(navBarLayoutProperty, nullptr);
+        navBarLayoutProperty->UpdateTitleMode(NavigationTitleMode::FREE);
+    }
+
+    // content node
+    if (!navigationGroupNode->GetContentNode()) {
+        int32_t contentNodeId = ElementRegister::GetInstance()->MakeUniqueId();
+        auto contentNode = FrameNode::GetOrCreateFrameNode(V2::NAVIGATION_CONTENT_ETS_TAG, contentNodeId,
+            []() { return AceType::MakeRefPtr<NavigationContentPattern>(); });
+        contentNode->GetLayoutProperty()->UpdateAlignment(Alignment::TOP_LEFT);
+        contentNode->GetEventHub<EventHub>()->GetOrCreateGestureEventHub()->SetHitTestMode(
+            HitTestMode::HTMTRANSPARENT_SELF);
+        navigationGroupNode->AddChild(contentNode);
+        navigationGroupNode->SetContentNode(contentNode);
+    }
+
+    // divider node
+    if (!navigationGroupNode->GetDividerNode()) {
+        int32_t dividerNodeId = ElementRegister::GetInstance()->MakeUniqueId();
+        auto dividerNode = FrameNode::GetOrCreateFrameNode(
+            V2::DIVIDER_ETS_TAG, dividerNodeId, []() { return AceType::MakeRefPtr<DividerPattern>(); });
+        navigationGroupNode->AddChild(dividerNode);
+        navigationGroupNode->SetDividerNode(dividerNode);
+
+        auto dividerLayoutProperty = dividerNode->GetLayoutProperty<DividerLayoutProperty>();
+        CHECK_NULL_RETURN(dividerLayoutProperty, nullptr);
+        dividerLayoutProperty->UpdateStrokeWidth(DIVIDER_WIDTH);
+        dividerLayoutProperty->UpdateVertical(true);
+        auto dividerRenderProperty = dividerNode->GetPaintProperty<DividerRenderProperty>();
+        CHECK_NULL_RETURN(dividerRenderProperty, nullptr);
+    }
+    auto navigationLayoutProperty = navigationGroupNode->GetLayoutProperty<NavigationLayoutProperty>();
+    if (!navigationLayoutProperty->HasNavigationMode()) {
+        navigationLayoutProperty->UpdateNavigationMode(NavigationMode::AUTO);
+    }
+    navigationLayoutProperty->UpdateNavBarWidth(DEFAULT_NAV_BAR_WIDTH);
+
+    SetNavigationStack(AceType::RawPtr(navigationGroupNode));
+
+    return navigationGroupNode;
+}
+
+void NavigationModelNG::SetNavigationStack(FrameNode* frameNode)
+{
+    CHECK_NULL_VOID(frameNode);
+    auto pattern = frameNode->GetPattern<NavigationPattern>();
+    CHECK_NULL_VOID(pattern);
+    auto navigationStack = pattern->GetNavigationStack();
+    if (!navigationStack) {
+        auto navigationStack = AceType::MakeRefPtr<NavigationStack>();
+        pattern->SetNavigationStack(std::move(navigationStack));
+    }
+}
+
 } // namespace OHOS::Ace::NG
diff --git a/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.h b/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.h
index 736d4a2b3686ab8c25ac549199fefce24e060d16..ec86bf78244eb21ae4ea28dbf28ffaec976fbac9 100644
--- a/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.h
+++ b/frameworks/core/components_ng/pattern/navigation/navigation_model_ng.h
@@ -68,6 +68,8 @@ public:
     void SetOnNavigationModeChange(std::function<void(NG::NavigationMode)>&& onModeChange) override;
     void SetCustomTransition(NavigationTransitionEvent&& animationTransition) override;
     void SetIsCustomAnimation(bool isCustom) override;
+    static RefPtr<FrameNode> CreateFrameNode(int32_t nodeId);
+    static void SetNavigationStack(FrameNode* frameNode);
     static void SetHideToolBar(FrameNode* frameNode, bool hideToolBar);
     static void SetMinContentWidth(FrameNode* frameNode, const Dimension& value);
     static void SetMinNavBarWidth(FrameNode* frameNode, const Dimension& value);
diff --git a/frameworks/core/components_ng/pattern/tabs/tab_bar_pattern.h b/frameworks/core/components_ng/pattern/tabs/tab_bar_pattern.h
index 21b4e1dc759cea0908f8f7cd279c71af28f824a2..17735e68c573bb6c11da3935d553cba32536fe39 100644
--- a/frameworks/core/components_ng/pattern/tabs/tab_bar_pattern.h
+++ b/frameworks/core/components_ng/pattern/tabs/tab_bar_pattern.h
@@ -106,12 +106,18 @@ public:
         return tabBarStyle_;
     }
 
+    void SetCustomNode(FrameNode* node)
+    {
+        node_ = node;
+    }
+
 private:
     std::string text_;
     std::string icon_;
     std::optional<TabBarSymbol> symbol_;
     TabBarBuilderFunc builder_;
     TabBarStyle tabBarStyle_;
+    FrameNode* node_ = nullptr;
 };
 
 enum class AnimationType {
diff --git a/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.cpp b/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.cpp
index a2d552f0b80adad5c580aa3af353fc64bfed7b11..4d6f9bef707b60c4413ede875ec5d48c2daf72fa 100644
--- a/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.cpp
+++ b/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.cpp
@@ -493,6 +493,16 @@ void TabContentModelNG::SetIndicator(const IndicatorStyle& indicator)
     frameNodePattern->SetIndicatorStyle(indicator);
 }
 
+void TabContentModelNG::SetCustomTabBar(FrameNode* node, FrameNode* tabBar)
+{
+    CHECK_NULL_VOID(node);
+    CHECK_NULL_VOID(tabBar);
+    auto frameNodePattern = node->GetPattern<TabContentPattern>();
+    CHECK_NULL_VOID(frameNodePattern);
+    frameNodePattern->SetTabBarStyle(TabBarStyle::NOSTYLE);
+    frameNodePattern->SetCustomTabBar(tabBar);
+}
+
 void TabContentModelNG::SetBoard(const BoardStyle& board)
 {
     auto frameNodePattern = ViewStackProcessor::GetInstance()->GetMainFrameNodePattern<TabContentPattern>();
diff --git a/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.h b/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.h
index b0d8d1977843b16fe155fd8611cff374ac538c29..48e1fd7b4e3fd6ecf50b456341db8746394c8b4b 100644
--- a/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.h
+++ b/frameworks/core/components_ng/pattern/tabs/tab_content_model_ng.h
@@ -60,6 +60,7 @@ public:
     void SetOnWillShow(std::function<void()>&& onWillShow) override;
     void SetOnWillHide(std::function<void()>&& onWillHide) override;
     void SetCustomStyleNode(const RefPtr<NG::FrameNode>& customStyleNode) override;
+    static void SetCustomTabBar(FrameNode* node, FrameNode* tabBar);
     static void UpdateDefaultSymbol(RefPtr<TabTheme>& tabTheme, RefPtr<TextLayoutProperty> symbolProperty);
     static void UpdateSymbolEffect(RefPtr<TextLayoutProperty> symbolProperty, bool isActive);
 
diff --git a/frameworks/core/components_ng/pattern/tabs/tab_content_pattern.h b/frameworks/core/components_ng/pattern/tabs/tab_content_pattern.h
index 04504ccc3eaa2697fdda5f95717127c763ce83a7..f5ecf517ebb83c9077f853dc2a5b54509e2bf79b 100644
--- a/frameworks/core/components_ng/pattern/tabs/tab_content_pattern.h
+++ b/frameworks/core/components_ng/pattern/tabs/tab_content_pattern.h
@@ -167,6 +167,11 @@ public:
         return tabBarParam_;
     }
 
+    void SetCustomTabBar(FrameNode* node)
+    {
+        tabBarParam_.SetCustomNode(node);
+    }
+
     void SetTabBarStyle(TabBarStyle tabBarStyle)
     {
         tabBarParam_.SetTabBarStyle(tabBarStyle);
diff --git a/frameworks/core/interfaces/arkoala/arkoala_api.h b/frameworks/core/interfaces/arkoala/arkoala_api.h
index 03394ab4ff5d30e12ee55789c8add0a131aac503..5ba32a93e4e4e58126e71772852b1416cd678938 100644
--- a/frameworks/core/interfaces/arkoala/arkoala_api.h
+++ b/frameworks/core/interfaces/arkoala/arkoala_api.h
@@ -652,7 +652,8 @@ enum ArkUINodeType {
     ARKUI_SELECT,
     ARKUI_IMAGE_ANIMATOR,
     ARKUI_CIRCLE,
-    ARKUI_TAB_CONTENT
+    ARKUI_TAB_CONTENT,
+    ARKUI_NAVIGATION
 };
 
 enum ArkUIEventCategory {
diff --git a/frameworks/core/interfaces/native/node/view_model.cpp b/frameworks/core/interfaces/native/node/view_model.cpp
index 23c58a5b05f0d05f23c1d7362142adde20685a5f..f0802288b2e93b799e7570e0297b2d718dbd4962 100644
--- a/frameworks/core/interfaces/native/node/view_model.cpp
+++ b/frameworks/core/interfaces/native/node/view_model.cpp
@@ -70,6 +70,7 @@
 #include "core/components_ng/pattern/search/search_model_ng.h"
 #include "core/components_ng/pattern/radio/radio_model_ng.h"
 #include "core/components_ng/pattern/select/select_model_ng.h"
+#include "core/components_ng/pattern/navigation/navigation_model_ng.h"
 #include "core/components_ng/pattern/image_animator/image_animator_model_ng.h"
 #include "core/interfaces/native/node/node_api.h"
 #include "core/pipeline/base/element_register.h"
@@ -338,6 +339,13 @@ void* createCustomNode(ArkUI_Int32 nodeId)
     return AceType::RawPtr(frameNode);
 }
 
+void* createNavigationNode(ArkUI_Int32 nodeId)
+{
+    auto frameNode = NavigationModelNG::CreateFrameNode(nodeId);
+    frameNode->IncRefCount();
+    return AceType::RawPtr(frameNode);
+}
+
 void* createWaterFlowNode(ArkUI_Int32 nodeId)
 {
     auto frameNode = WaterFlowModelNG::CreateFrameNode(nodeId);
@@ -530,6 +538,7 @@ void* CreateNode(ArkUINodeType tag, ArkUI_Int32 nodeId)
         createImageAnimatorNode,
         createCircleNode,
         createTabContentNode,
+        createNavigationNode,
     };
     if (tag >= sizeof(createArkUIFrameNodes) / sizeof(createArkUIFrameNode*)) {
         TAG_LOGE(AceLogTag::ACE_NATIVE_NODE, "fail to create %{public}d type of node", tag);
@@ -602,7 +611,7 @@ void InsertChildAfter(void* parentNode, void* childNode, void* siblingNode)
     CHECK_NULL_VOID(childNode);
     auto* parent = reinterpret_cast<UINode*>(parentNode);
     auto* child = reinterpret_cast<UINode*>(childNode);
-    
+
     if (AceType::InstanceOf<GroupNode>(parent)) {
         auto* groupNode = AceType::DynamicCast<GroupNode>(parent);
         groupNode->AddChildToGroup(AceType::Claim(child));