Tabs

Tabs chia một phần màn hình thành các bảng nội dung có thể chuyển đổi — người dùng nhấn vào tiêu đề tab và bảng bên dưới cập nhật tương ứng.

Tabs element selected on the canvas with the +Add tab control visible

Thêm, xóa và chọn tab

Mỗi tab gồm hai phần

  • Tab header — nhãn có thể nhấn (Tab 1, Tab 2, v.v.).
  • Tab content — một container cho mỗi tab. Bất cứ thứ gì bạn đặt trong container nội dung sẽ hiển thị khi tab đó được chọn.

Nhấn Add tab để thêm tab mới. Mỗi tab mới sẽ có một container nội dung tương ứng.

Để đặt một tab cụ thể là active khi màn hình xuất hiện lần đầu, bật Selected by default.

Tùy chỉnh giao diện tab

Templates

Tab templates

Flow Builder cung cấp ba template tab có sẵn:

  • Segment control — bộ chuyển đổi hình viên thuốc với góc bo tròn quanh tab đang được chọn.
  • Button Tabs — các tab được tạo kiểu như nút bấm riêng biệt.
  • Underline — nhãn văn bản có gạch chân đánh dấu tab đang được chọn.

Trạng thái tab

Mỗi tab riêng lẻ có bộ chuyển đổi trạng thái (Default / Selected) để tùy chỉnh trạng thái đang active và không active riêng biệt — kiểu chữ, màu sắc, nền và viền theo từng trạng thái.

Selectable group

Tabs là một selectable group chọn một — đúng một tab được active tại một thời điểm. Quản lý nhóm từ bảng Screen settings, trong mục Selectable groups.

Nhóm cung cấp hai biến:

  • tabs.selectedOptionId — ID của tab đang được chọn. Dùng trong các điều kiện.
  • tabs.selectedOptionTitle — nhãn của tab đang được chọn. Dùng trong văn bản động.

Thay tabs bằng Group ID tùy chỉnh của bạn nếu bạn đã đổi tên nhóm.

Xem Selectable elements and groups để có cái nhìn toàn diện hơn.