diff --git a/customappbar/interfaces/custom_app_bar.js b/customappbar/interfaces/custom_app_bar.js
index 38c1475eeca443375f910a3e8ce870b9433ac11c..b509c682656a58ab69b23440fb1e7545b2b5afb4 100644
--- a/customappbar/interfaces/custom_app_bar.js
+++ b/customappbar/interfaces/custom_app_bar.js
@@ -55,6 +55,7 @@ const TITLE_MARGIN_RIGHT = 12;
 const TITLE_MARGIN_TOP = 8;
 const TITLE_LABEL_MARGIN = 8.5;
 const TITLE_TEXT_MARGIN = 3;
+const TITLE_CONSTRAINT_SIZE = 'calc(100% - 73.5vp)';
 const MD_WIDTH = 480;
 const LG_WIDTH_LIMIT = 0.6;
 const LG_WIDTH_HEIGHT_RATIO = 1.95;
@@ -1016,6 +1017,7 @@ export class CustomAppBar extends ViewPU {
             Text.maxLines(1);
             Text.textOverflow({ overflow: TextOverflow.Ellipsis });
             Text.ellipsisMode(EllipsisMode.END);
+            Text.constraintSize({ maxWidth: TITLE_CONSTRAINT_SIZE });
         }, Text);
         Text.pop();
         this.observeComponentCreation2((elmtId, isInitialRender) => {
@@ -1186,7 +1188,7 @@ export class CustomAppBar extends ViewPU {
             });
             Row.layoutWeight(1);
             Row.backgroundColor(Color.Transparent);
-            Row.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK);
+            Row.backgroundBlurStyle(this.isHalfScreen ? BlurStyle.COMPONENT_ULTRA_THICK : undefined);
             Row.borderRadius({
                 topLeft: this.isHalfScreen ? HALF_CONTAINER_BORDER_SIZE : this.deviceBorderRadius,
                 topRight: this.isHalfScreen ? HALF_CONTAINER_BORDER_SIZE : this.deviceBorderRadius,
diff --git a/customappbar/source/custom_app_bar.ets b/customappbar/source/custom_app_bar.ets
index f2686dae480463c7c41b16443c5cbadab95b6574..d094653fbb56c0e12a57f46f693b6b5be6f852ea 100644
--- a/customappbar/source/custom_app_bar.ets
+++ b/customappbar/source/custom_app_bar.ets
@@ -51,6 +51,7 @@ const TITLE_MARGIN_RIGHT: number = 12;
 const TITLE_MARGIN_TOP: number = 8;
 const TITLE_LABEL_MARGIN: number = 8.5;
 const TITLE_TEXT_MARGIN: number = 3;
+const TITLE_CONSTRAINT_SIZE: string = 'calc(100% - 73.5vp)';
 const MD_WIDTH: number = 480;
 const LG_WIDTH_LIMIT: number = 0.6;
 const LG_WIDTH_HEIGHT_RATIO: number = 1.95;
@@ -563,6 +564,7 @@ export struct CustomAppBar {
             .maxLines(1)
             .textOverflow({ overflow: TextOverflow.Ellipsis })
             .ellipsisMode(EllipsisMode.END)
+            .constraintSize({ maxWidth: TITLE_CONSTRAINT_SIZE })
           SymbolGlyph($r('sys.symbol.chevron_right'))
             .height(CHEVRON_HEIGHT)
             .width(CHEVRON_WIDTH)
@@ -686,7 +688,7 @@ export struct CustomAppBar {
             })
             .layoutWeight(1)
             .backgroundColor(Color.Transparent)
-            .backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK)
+            .backgroundBlurStyle(this.isHalfScreen ? BlurStyle.COMPONENT_ULTRA_THICK : undefined)
             .borderRadius({
               topLeft: this.isHalfScreen ? HALF_CONTAINER_BORDER_SIZE : this.deviceBorderRadius,
               topRight: this.isHalfScreen ? HALF_CONTAINER_BORDER_SIZE : this.deviceBorderRadius,