configAppView

Cập nhật lần cuối: 23/5/2025

Bắt đầu hỗ trợ ở phiên bản:

• SDK: 2.25.0
• Android: 23.02.01.r2
• IOS: 23.02.01.r2

import { configAppView } from "zmp-sdk/apis";

API tuỳ chỉnh các thành phần giao diện chính trên Mini App, bao gồm:

• Status bar
• Action bar
• Bottom Navigation (Android) / Safe Area Inset Bottom (iOS)

Với api configAppView, bạn có thể ẩn/ hiện, tuỳ chỉnh màu sắc, kiểu hiển thị của các thành phần mặc định trên Mini App. Xem hình ảnh mô tả bên dưới để hiểu rõ các thành phần có thể tuỳ chỉnh trên Mini App của bạn.

Ví dụ

Thay đổi tiêu đề action bar:

configAppView({
  actionBar: {
    title: "Giỏ hàng",
  },
});

Để có được giao diện toàn màn hình:

configAppView({
  hideAndroidBottomNavigationBar: true,
  hideIOSSafeAreaBottom: true,
  statusBarType: "transparent", // hoặc "hidden"
  actionBar: {
    hide: true,
  },
});

Xem hướng dẫn xử lý lỗi và bảng mô tả chi tiết mã lỗi tại đây.

Tham số

Truyền tham số vào API dưới dạng object chứa các thuộc tính:

Name	Type	Default	Description
actionBar.hide	boolean		Ẩn action bar.
actionBar.leftButton	"back" | "none"	"back"	Tuỳ chỉnh nút điều hướng bên trái action bar. Mặc định hiển thị nút back. Truyền none để ẩn nút.
actionBar.textAlign	"left" | "center"	"left"	Tuỳ chỉnh vị trí tiêu đề hiển thị trên action bar.
actionBar.title	string		Tiêu đề hiển thị trên action bar.
headerColor	string		Mã màu, có giá trị hợp lệ là màu thập lục phân, ví dụ #000000.
headerTextColor	"white" | "black"		Màu của text và icon trên thanh action bar và status bar.
hideAndroidBottomNavigationBar	boolean	false	Ẩn thanh navigation bar trên Android.
hideIOSSafeAreaBottom	boolean	false	Ẩn thanh safe area inset bottom trên iOS.
statusBarType	"normal" | "hidden" | "transparent"	"normal"	Kiểu hiển thị của status bar.