Button

Nút văn bản, biểu tượng hoặc văn bản và biểu tượng mà người dùng có thể nhấp vào. Để xem ví dụ về các ứng dụng Google Chat, hãy xem phần Thêm nút.

Để đặt hình ảnh làm nút có thể nhấp, hãy chỉ định Image (không phải ImageComponent) và đặt hành động onClick.

Dành cho các ứng dụng Google Chat và tiện ích bổ sung của Google Workspace.

Biểu diễn dưới dạng JSON
{
  "text": string,
  "icon": {
    object (Icon)
  },
  "color": {
    object (Color)
  },
  "onClick": {
    object (OnClick)
  },
  "disabled": boolean,
  "altText": string,
  "type": enum (Type)
}
Trường
text

string

Văn bản xuất hiện bên trong nút.

icon

object (Icon)

Biểu tượng xuất hiện bên trong nút. Nếu bạn đặt cả icon và text, thì biểu tượng sẽ xuất hiện trước văn bản.

color

object (Color)

Không bắt buộc. Màu của nút. Nếu được đặt, nút type sẽ được đặt thành FILLED và màu của các trường text và icon sẽ được đặt thành màu tương phản để dễ đọc. Ví dụ: nếu màu nút được đặt thành màu xanh dương, thì mọi văn bản hoặc biểu tượng trong nút sẽ được đặt thành màu trắng.

Để đặt màu nút, hãy chỉ định một giá trị cho các trường red, green và blue. Giá trị này phải là số thực từ 0 đến 1 dựa trên giá trị màu RGB, trong đó 0 (0/255) thể hiện không có màu và 1 (255/255) thể hiện cường độ tối đa của màu.

Ví dụ: đoạn mã sau đây đặt màu đỏ ở cường độ tối đa:

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
}

Trường alpha không dùng được cho màu nút. Nếu được chỉ định, trường này sẽ bị bỏ qua.

onClick

object (OnClick)

Bắt buộc. Hành động cần thực hiện khi người dùng nhấp vào nút, chẳng hạn như mở một siêu liên kết hoặc chạy một hàm tuỳ chỉnh.

disabled

boolean

Nếu true, nút sẽ hiển thị ở trạng thái không hoạt động và không phản hồi thao tác của người dùng.

altText

string

Văn bản thay thế được dùng cho tính năng hỗ trợ tiếp cận.

Đặt văn bản mô tả cho người dùng biết chức năng của nút. Ví dụ: nếu một nút mở một siêu liên kết, bạn có thể viết: "Mở một thẻ trình duyệt mới và chuyển đến tài liệu dành cho nhà phát triển Google Chat tại https://developers.google.com/workspace/chat".

type

enum (Type)

Không bắt buộc. Loại nút. Nếu bạn không đặt, loại nút sẽ mặc định là OUTLINED. Nếu bạn đặt trường color, thì loại nút sẽ buộc phải là FILLED và mọi giá trị được đặt cho trường này đều bị bỏ qua.

Loại

Không bắt buộc. type của nút. Nếu bạn đặt trường color, thì type sẽ buộc phải là FILLED.

Có thể dùng cho các ứng dụng Google Chat và không thể dùng cho các tiện ích bổ sung của Google Workspace.

Enum
TYPE_UNSPECIFIED Đừng sử dụng. Không xác định.
OUTLINED Nút có đường viền là nút nhấn mạnh ở mức trung bình. Các nút này thường chứa những thao tác quan trọng nhưng không phải là thao tác chính trong ứng dụng Chat hoặc tiện ích bổ sung.
FILLED Nút có màu nền có vùng chứa màu đồng nhất. Nút này có tác động trực quan mạnh nhất và được đề xuất cho hành động quan trọng và chính trong ứng dụng Chat hoặc tiện ích bổ sung.
FILLED_TONAL Nút có màu nền là một lựa chọn thay thế trung gian giữa nút có màu nền và nút có đường viền. Các nút này hữu ích trong những bối cảnh mà nút có mức độ ưu tiên thấp hơn cần được nhấn mạnh hơn một chút so với nút có đường viền.
BORDERLESS Nút không có vùng chứa vô hình ở trạng thái mặc định. Nút này thường được dùng cho các hành động có mức độ ưu tiên thấp nhất, đặc biệt là khi trình bày nhiều lựa chọn.