Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Bộ thu nội dung đa phương tiện được tạo kiểu (SMR) cho phép ứng dụng gửi của bạn phát nội dung đa phương tiện trên
thiết bị Truyền mà không cần tạo ứng dụng bộ thu tuỳ chỉnh của riêng bạn. Bạn có thể
tuỳ chỉnh bảng phối màu và thương hiệu SMR bằng cách cung cấp tệp CSS của riêng bạn
trong khi đăng ký.
Đăng ký
Để sử dụng SMR cho ứng dụng của bạn, hãy chọn tùy chọn Bộ thu nội dung đa phương tiện được tạo kiểu
khi bạn thêm một ứng dụng mới trong
Bảng điều khiển dành cho nhà phát triển SDK Google Cast.
Hãy xem phần Đăng ký để biết thêm thông tin. Lựa chọn này
bao gồm liên kết để Xem trước biểu định kiểu mặc định cũng như trường mà
bạn nhập URL vào biểu định kiểu của mình. Bạn có thể sử dụng kiểu mặc định hoặc
hãy cung cấp URL loại HTTPS cho tệp CSS của bạn. Bạn có thể sử dụng máy chủ của riêng mình để lưu trữ
CSS. Sau khi cung cấp URL cho tệp CSS của mình, bạn có thể nhấp vào Xem trước
để xem kiểu của bạn sẽ trông như thế nào trên receiver.
Nội dung nghe nhìn được hỗ trợ
Tất cả các receiver đều hỗ trợ các loại nội dung nghe nhìn, như mô tả trong
Phương tiện được hỗ trợ.
SMR hỗ trợ video, âm thanh và hình ảnh do một người gửi kiểm soát
bằng cách sử dụng kênh truyền thông SDK Truyền. SMR hoàn toàn tuân thủ
Nguyên tắc về trải nghiệm người dùng khi phát nội dung nghe nhìn trên thiết bị truyền.
Trình thu nhận nội dung đa phương tiện được tạo kiểu sử dụng các lớp CSS sau:
.background: Nền cho dịch vụ nhận.
.logo: Biểu trưng hiển thị khi bộ nhận chạy. Lớp này cũng
được sử dụng khi receiver ở trạng thái rảnh và không có lớp .splash
đã khai báo.
.progressBar: Thanh tiến trình để phát nội dung nghe nhìn.
.splash: Màn hình hiển thị khi receiver ở trạng thái rảnh. Nếu trường hợp này
lớp không được khai báo, thì dịch vụ nhận sẽ mặc định là .logo hoặc tên ứng dụng.
.watermark: Hình mờ xuất hiện khi nội dung nghe nhìn đang phát.
Sau đây là một số hình minh hoạ cách sử dụng các lớp này.
Video
Lưu ý: Ảnh bìa hình ảnh video có kích thước 96x143 pixel và tài nguyên hình ảnh đầu tiên
liên kết với siêu dữ liệu đa phương tiện được chọn để hiển thị. Hình ảnh được chia tỷ lệ thành
phù hợp với kích thước dự kiến.
Âm thanh
Lưu ý: Ảnh bìa đĩa nhạc âm thanh có kích thước 384x384 pixel và tài nguyên hình ảnh đầu tiên
liên kết với siêu dữ liệu đa phương tiện được chọn để hiển thị. Hình ảnh được chia tỷ lệ thành
phù hợp với kích thước dự kiến.
Hình ảnh từ Big Buck Bunny: (c) bản quyền 2008,
Binder Foundation / www.bigbuckbunny.org
Hình ảnh từ Sintel: (c) bản quyền của Binder Foundation / www.sintel.org
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2025-07-25 UTC."],[[["\u003cp\u003eThe Styled Media Receiver (SMR) lets you play media on Cast devices without building a custom receiver application, offering branding customization through a CSS file.\u003c/p\u003e\n"],["\u003cp\u003eRegister your application in the Google Cast SDK Developer Console, selecting "Styled Media Receiver" and providing a link to your CSS for customization.\u003c/p\u003e\n"],["\u003cp\u003eThe SMR supports various media types (video, audio, images) and adheres to Cast UX guidelines, controlled by your sender application using the Cast SDK media channel.\u003c/p\u003e\n"],["\u003cp\u003eCustomize the appearance of the receiver using CSS classes for background, logo, progress bar, splash screen, and watermark, with provided examples for styling.\u003c/p\u003e\n"]]],["The Styled Media Receiver (SMR) enables media playback on Cast devices without a custom receiver app. During registration in the Google Cast SDK Developer Console, you can select SMR and customize its appearance. This involves providing a CSS file URL or using default styles. The SMR supports video, audio, and images, utilizing CSS classes like `.background`, `.logo`, `.progressBar`, `.splash`, and `.watermark` for styling. You can adjust the SMR display when launching, playing media, or on idle state using the appropriate CSS class.\n"],null,["# Styled Media Receiver\n\nThe Styled Media Receiver (SMR) allows your sender application to play media on\na Cast device without creating your own custom receiver application. You can\ncustomize the SMR color scheme and branding by providing your own CSS file\nduring registration.\n\nRegistration\n------------\n\nTo use the SMR for your application select the **Styled Media Receiver** option\nwhen you add a new application in the\n[Google Cast SDK Developer Console](https://cast.google.com/publish).\nSee [Registration](/cast/docs/registration) for more information. This option\nincludes a link to **Preview** the default style sheet as well as a field where\nyou enter the URL to your style sheet. You can either use the default styles or\nprovide the HTTPS URL to your CSS file. You can use your own server to host the\nCSS file. Once you provide the URL to your CSS file, you can click **Preview**\nto see how your styles will look on the receiver.\n| **Note:** If you register a Styled Media Receiver, but just use the default styles, the receiver displays your application name when the receiver is loading or in the idle state.\n\nSupported media\n---------------\n\nAll receivers support the media types, as described in\n[Supported Media](/cast/docs/media).\n\nThe SMR supports video, audio and images and is controlled from a sender\napplication using the Cast SDK media channel. The SMR fully complies with the\n[UX Guidelines](/cast/docs/ux_guidelines) for media playback on a Cast device.\n\nType fonts\n----------\n\nSee [Pre-installed fonts](/cast/docs/receiver_apps#fonts) for a list of\nfonts pre-installed with the receiver.\n\nCSS\n---\n\nThe Styled Media Receiver uses the following CSS classes:\n\n- **.background**: The background for the receiver.\n- **.logo**: The logo shown when the receiver is launching. This class is also used when the receiver is in the idle state and no .splash class is declared.\n- **.progressBar**: The progress bar for media playback.\n- **.splash**: The screen shown when the receiver is in an idle state. If this class is not declared, the receiver will default to .logo or the app name.\n- **.watermark**: A watermark shown when the media is playing.\n\nHere is an example CSS file that uses these classes: \n\n```gas\n.background {\n background: center no-repeat url(background.png);\n}\n\n.logo {\n background-image: url(logo.png);\n}\n\n.progressBar {\n background-color: rgb(238, 255, 65);\n}\n\n.splash {\n background-image: url(splash.png);\n}\n\n.watermark {\n background-image: url(watermark.png);\n background-size: 57px 57px;\n}\n```\n\nFollowing are some illustrations of these classes in use.\n\n#### Video\n\n**Note**: The video image art is 96x143 pixels and the first image resource\nassociated with the media metadata is selected for display. Images are scaled to\nfit the expected dimensions.\n\n#### Audio\n\n**Note**: The audio album art is 384x384 pixels and the first image resource\nassociated with the media metadata is selected for display. Images are scaled to\nfit the expected dimensions.\n\n\nImages from Big Buck Bunny: (c) copyright 2008,\nBlender Foundation / www.bigbuckbunny.org\n\nImage from Sintel: (c) copyright Blender Foundation / www.sintel.org"]]
