Tab Điều Hướng
Thanh điều hướng dưới là cách chính để thành viên di chuyển trong ứng dụng. Bạn có thể hiển thị tối đa 5 tab, sắp xếp lại, đổi tên nhãn và chọn biểu tượng.
Vào Cài đặt → Ứng Dụng Di Động → Design để truy cập trình chỉnh sửa Navigation Bar.
Tab Khả Dụng
Có 9 tab được định sẵn. Mỗi tab có ID cố định không thể đổi tên nội bộ, nhưng bạn có thể thay đổi nhãn hiển thị.
| ID Tab | Nhãn Mặc Định | Biểu Tượng Mặc Định | Hiển Thị Mặc Định |
|---|---|---|---|
feed | Feed | Newspaper | Có |
spaces | Spaces | LayoutGrid | Có |
notifications | Alerts | Bell | Có |
me | Me | User | Có |
events | Events | Calendar | Không |
courses | Courses | GraduationCap | Không |
wallet | Wallet | QrCode | Không |
directory | Directory | Users | Không |
jobs | Jobs | Briefcase | Không |
4 tab đầu tiên (Feed, Spaces, Alerts, Me) hiển thị theo mặc định. 5 tab còn lại bị ẩn cho đến khi bạn bật chúng.
Ràng Buộc
- Tối đa 5 tab hiển thị — nút bật/tắt hiển thị bị vô hiệu hóa khi đã có 5 tab đang hiển thị.
- Một tab chính — tab chính là màn hình đích mặc định khi ứng dụng mở. Nếu bạn ẩn tab chính hiện tại, chỉ định tab chính sẽ tự động bị xóa.
- Tab Feed, Spaces, Notifications và Me luôn khả dụng (không thể xóa khỏi hệ thống), nhưng bạn có thể ẩn chúng khỏi thanh điều hướng dưới.
Cấu Hình Từng Tab
Mỗi hàng trong trình chỉnh sửa Navigation Bar có các điều khiển sau:
| Điều khiển | Mô tả |
|---|---|
| Xem trước biểu tượng | Thu nhỏ trực tiếp của biểu tượng được chọn |
| Trường nhãn | Văn bản hiển thị bên dưới biểu tượng; tối đa 50 ký tự |
| Bộ chọn biểu tượng | Chọn từ 15 biểu tượng Lucide (xem bảng bên dưới) |
| Header Style | Kiểm soát giao diện header khi tab này đang hoạt động |
| Sắp xếp lại (lên/xuống) | Đổi vị trí tab này với tab liền kề |
| Bật/tắt hiển thị | Hiện hoặc ẩn tab này trong thanh điều hướng dưới |
| Đặt làm chính (ngôi sao) | Đặt tab này làm màn hình đích mặc định |
Biểu Tượng Khả Dụng
| Biểu tượng | Tên |
|---|---|
| Newspaper | Newspaper |
| LayoutGrid | LayoutGrid |
| Bell | Bell |
| User | User |
| Calendar | Calendar |
| GraduationCap | GraduationCap |
| QrCode | QrCode |
| Users | Users |
| Briefcase | Briefcase |
| Home | Home |
| Heart | Heart |
| MessageCircle | MessageCircle |
| Search | Search |
| Settings | Settings |
| ShoppingBag | ShoppingBag |
Kiểu Header
| Giá trị | Mô tả |
|---|---|
home | Header kiểu trang chủ (dùng cho Feed theo mặc định) |
avatar-notification | Hiển thị ảnh đại diện thành viên và biểu tượng thông báo |
community-logo | Hiển thị logo cộng đồng trong header |
page-title | Hiển thị nhãn tab làm tiêu đề trang |
none | Không có header (dùng cho tab Me theo mặc định) |
Mô phỏng điện thoại ở bên trái cập nhật ngay lập tức khi bạn thay đổi — không cần lưu để xem trước.
Sắp Xếp Lại Tab
- Trong trình chỉnh sửa Navigation Bar, tìm tab bạn muốn di chuy ển.
- Nhấn mũi tên lên hoặc xuống để đổi vị trí với tab liền kề.
- Mô phỏng phản ánh thứ tự mới ngay lập tức.
Ánh Xạ Không Gian (Tab Directory và Jobs)
Khi tab Directory hoặc Jobs hiển thị, bạn có thể kiểm soát không gian nào chúng tải.
| Tab | Tùy chọn dropdown | Mặc định |
|---|---|---|
| Directory | Chọn một không gian directory | Tự động phát hiện (không gian directory đầu tiên) |
| Jobs | Chọn một không gian jobs | Tất cả công việc (trên các không gian) |
Nếu không có không gian directory nào tồn tại, dropdown hiển thị: "No directory spaces found. Create one in Space settings first."
Ánh xạ không gian được lưu như một phần của cấu hình ứng dụng di động đầy đủ.
Bật/Tắt Hiển Thị Route
Ngoài thanh điều hướng dưới, bạn có thể kiểm soát liệu các tính năng tùy chọn có thể truy cập trong ứng dụng hay không. Các nút bật/tắt này nằm trong tab Settings (không phải tab Design).
| Tính năng | Mặc định | Ghi chú |
|---|---|---|
| Events | BẬT | Ẩn tab và route Events |
| Courses | BẬT | Ẩn tab và route Courses |
| Directory | BẬT | Ẩn tab và route Directory |
| Job Board | BẬT | Ẩn tab và route Job Board |
| News | BẬT | Ẩn tab và route News |
Feed, Spaces, Notifications và Profile luôn hiển thị — không có nút bật/tắt cho chúng.
Ẩn một tính năng qua bật/tắt hiển thị route khác với việc ẩn tab điều hướng dưới. Để một tính năng hoàn toàn không thể truy cập, hãy tắt nút bật/tắt hiển thị route của nó.
Bước Tiếp Theo
- Thông Báo Đẩy — Đặt tùy chọn thông báo mặc định theo từng danh mục
- Xem Trước và Xuất Bản — Xem trước bố cục điều hướng trong PWA Simulator