添加 title bar

app/oh-package.json5

@@ -5,6 +5,8 @@
   "main": "",
   "author": "",
   "license": "",
-  "dependencies": {}
+  "dependencies": {
+    "@devwiki/common_ui": "file:../common_ui"
+  }
 }
 

app/src/main/ets/pages/Index.ets

@@ -1,16 +1,23 @@
+import { TitleBar } from '@devwiki/common_ui/src/main/ets/component/TitleBar';
+import { ComposeTitleBar } from '@ohos.arkui.advanced.ComposeTitleBar';
+import { EditableTitleBar } from '@ohos.arkui.advanced.EditableTitleBar';
+import { SelectTitleBar } from '@ohos.arkui.advanced.SelectTitleBar';
+
 @Entry
 @Component
 struct Index {
   @State message: string = 'Hello World';
 
+  onLeftClicked(event: ClickEvent) {
+    this.message = "TitleBar LeftClicked";
+  }
+
   build() {
-    Row() {
-      Column() {
-        Text(this.message)
-          .fontSize(50)
-          .fontWeight(FontWeight.Bold)
-      }
-      .width('100%')
+    Column() {
+      TitleBar({onLeftClicked: this.onLeftClicked}).height(48);
+      Divider();
+
+      Text(this.message);
     }
     .height('100%')
   }