Nút Truyền sẽ mở ra một hộp thoại để kết nối, kiểm soát và ngắt kết nối khỏi Bộ thu web.
Xem phần Biểu tượng truyền để tải mẫu nút Truyền xuống.
Lưu ý rằng nút Truyền không dành riêng cho Google Cast; nút này có thể được dùng để đại diện cho cả Bộ thu web và bộ thu không phải trên web (như tai nghe Bluetooth). Bộ thu web sẽ luôn xuất hiện trong hộp thoại Truyền và tuyệt đối không xuất hiện trong hộp thoại, trình đơn hoặc chế độ điều khiển khác.
Giới thiệu tính năng Truyền cho người dùng
Việc ra mắt nút Truyền giúp người dùng hiện tại biết rằng ứng dụng của người gửi hiện hỗ trợ tính năng Truyền, đồng thời cũng giúp ích cho những người dùng mới sử dụng Google Cast.
Bắt buộc
A Hiển thị màn hình giới thiệu về tính năng Truyền vào lần đầu tiên có Trình thu nhận web. Đối với người gửi iOS, hãy hiển thị màn hình giới thiệu về tính năng Truyền vào lần đầu tiên nút Truyền xuất hiện.
B Làm nổi bật nút Truyền bằng cách khoanh tròn nút
C Giải thích cách hoạt động của nút Truyền (ví dụ:
hiển thị thông báo như "Chạm để truyền video đến TV")
Android
Giới thiệu về nội dung truyền
![Giới thiệu về nội dung truyền](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/prompting1_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
iOS
Giới thiệu về nội dung truyền
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/prompting1_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Chrome
Giới thiệu về nội dung truyền
![Giới thiệu về nội dung truyền](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/prompting1_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![Truyền màn hình chính](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Khả năng sử dụng nút Truyền
Bắt buộc
A Nút Truyền phải hiển thị được trên mọi màn hình có nội dung phát được và đặt ở một vị trí nhất quán trong khi duyệt web hoặc phát nội dung. Chuỗi này cũng sẽ xuất hiện trong tiêu đề của Chrome để kiểm soát chung.
B Trong Chrome, nút Truyền có thể bị ẩn khi không có Bộ thu web. Đối với người gửi trên Android và iOS, nút Truyền phải luôn hiển thị khi thiết bị dùng Wi-Fi. Vì vậy, có thể có sự trợ giúp thích hợp nếu người dùng đã tắt quyền truy cập mạng cục bộ và do đó, không phát hiện được thiết bị (xem phần Quyền và tính năng khám phá trên iOS để biết thêm chi tiết).
C Trong các ứng dụng dành cho thiết bị di động, nút Truyền phải nằm ở bên phải.
D Trong Chrome, nút Truyền phải nằm ở bên phải trong
các chế độ điều khiển nội dung nghe nhìn (ví dụ: xem video được nhúng). Nếu các nút điều khiển nội dung nghe nhìn có nút toàn màn hình, hãy đặt nút Truyền ở bên trái nút đó.
Lưu ý
Google Cast sử dụng mô hình đa nhiệm, cho phép người dùng duyệt qua ứng dụng của người gửi và các ứng dụng khác trong khi truyền. Nút Truyền phải hiển thị trên mọi màn hình có nội dung có thể phát để người dùng không phải tìm kiếm vị trí để tạm dừng hoặc dừng nội dung đang phát trên TV.
Android
Đã ngắt kết nối người gửi
![Đã ngắt kết nối người gửi](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states-1-122023.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
iOS
Đã ngắt kết nối người gửi
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-available1_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Chrome
Đã ngắt kết nối người gửi
![Đã ngắt kết nối người gửi](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-available1_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Trạng thái của nút Truyền
Bắt buộc
A Đã ngắt kết nối: Khi có Bộ thu web, nút Truyền sẽ xuất hiện
B Kết nối: Khi Bộ thu web đang kết nối, nút Truyền sẽ tạo hiệu ứng chuyển động cho các sóng trong biểu tượng theo mức tăng dần (để biết chi tiết, hãy xem ghi chú bên dưới)
C Đã kết nối: Khi ứng dụng này được kết nối với Bộ thu web được truyền, nút Truyền của ứng dụng sẽ xuất hiện với hình dạng khung màu đậm
Các phương pháp hay nhất
Đối với mỗi trạng thái của nút, hãy sử dụng màu phù hợp với kiểu của các thành phần khác trên giao diện người dùng trong ứng dụng. Bạn không bắt buộc phải sử dụng màu đánh dấu riêng biệt (chẳng hạn như màu vàng) cho trạng thái BẬT / Đã kết nối.
Ghi chú
- Biểu tượng Truyền hiển thị trên Chrome, Android và iOS để cấp quyền truy cập vào tiện ích Truyền bất kể có các Thiết bị truyền hay không.
- Trạng thái Kết nối (ảnh động) xuất hiện khi kết nối với API Truyền mất nhiều thời gian hơn dự kiến (SDK của Android và Chrome sẽ tự động tạo ảnh động cho biểu tượng Truyền). Sau khi kết nối, ứng dụng Web receiver sẽ chạy.
- Trạng thái BẬT / Đã kết nối của biểu tượng Truyền đã được cập nhật, đồng thời hiện sử dụng màu nền liền mạch trong khung biểu tượng. Các mẫu biểu tượng và biểu tượng Truyền có sẵn tại đây.
Android
Người gửi, nội dung truyền đã bị ngắt kết nối
![Người gửi, nội dung truyền đã bị ngắt kết nối](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states-1-122023.png?authuser=5&hl=vi)
Truyền màn hình chính
![Truyền màn hình chính](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, Đang kết nối tính năng truyền
![Người gửi, Đang kết nối tính năng truyền](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states-2-122023.png?authuser=5&hl=vi)
Truyền màn hình chính
![Truyền màn hình chính](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, tính năng Truyền đã kết nối
![Người gửi, tính năng Truyền đã kết nối](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states-3-122023.png?authuser=5&hl=vi)
Đang tải ứng dụng Bộ nhận web
![Đang tải ứng dụng Bộ nhận web](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1.png?authuser=5&hl=vi)
Người gửi, tính năng Truyền đã kết nối
![Người gửi, tính năng Truyền đã kết nối](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states-3-122023.png?authuser=5&hl=vi)
Ứng dụng Bộ thu trên web đã tải / ở trạng thái rảnh
![Ứng dụng Bộ thu trên web đã tải / ở trạng thái rảnh](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-idle1.png?authuser=5&hl=vi)
iOS
Người gửi, tính năng Truyền không khả dụng
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states1_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, nội dung truyền đã bị ngắt kết nối
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states2_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, Đang kết nối tính năng truyền
![Người gửi, Đang kết nối tính năng truyền](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states3_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, tính năng Truyền đã kết nối
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states4_a.png?authuser=5&hl=vi)
Đang tải ứng dụng Bộ nhận web
![Đang tải ứng dụng Bộ nhận web](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1.png?authuser=5&hl=vi)
Người gửi, tính năng Truyền đã kết nối
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states4_a.png?authuser=5&hl=vi)
Ứng dụng Bộ thu trên web đã tải / ở trạng thái rảnh
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-idle1.png?authuser=5&hl=vi)
Chrome
Người gửi, tính năng Truyền không khả dụng
![Người gửi, tính năng Truyền không khả dụng](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states1_a.png?authuser=5&hl=vi)
Biểu tượng Truyền xuất hiện trong Chrome để cấp quyền truy cập vào tiện ích Truyền bất kể trạng thái kết nối.
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, nội dung truyền đã bị ngắt kết nối
![Người gửi, nội dung truyền đã bị ngắt kết nối](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states2_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, Đang kết nối tính năng truyền
![Người gửi, Đang kết nối tính năng truyền](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states3_a.png?authuser=5&hl=vi)
Truyền màn hình chính
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=5&hl=vi)
Người gửi, tính năng Truyền đã kết nối
![Người gửi, tính năng Truyền đã kết nối](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states4_a.png?authuser=5&hl=vi)
Đang tải ứng dụng Bộ nhận web
![Đang tải ứng dụng Bộ nhận web](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1.png?authuser=5&hl=vi)
Người gửi, tính năng Truyền đã kết nối
![Người gửi, tính năng Truyền đã kết nối](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states4_a.png?authuser=5&hl=vi)
Ứng dụng Bộ thu trên web đã tải / ở trạng thái rảnh
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-idle1.png?authuser=5&hl=vi)
Những hình ảnh dùng trong hướng dẫn thiết kế này là do Butter Foundation, được chia sẻ theo bản quyền hoặc giấy phép Creative Commons.
- Giấc mơ của voi: (c) bản quyền 2006, Tổ chức Blender / Viện nghệ thuật Truyền thông Hà Lan/ www.elephantsdream.org
- Sintel: (c) bản quyền Blender Foundation | www.sintel.org
- Nước mắt thép: (CC) Blender Foundation | mango.bfragment.org
- Big Buck Bunny: (c) bản quyền 2008, Blender Foundation / www.bigbuckbunny.org