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.
Thành phần hình ảnh
Một thành phần hình ảnh có thể được thêm vào các mục trong lưới.
Có sẵn cho các tiện ích bổ sung của Google Workspace và ứng dụng Google Chat.
constImageComponent=CardService.newImageComponent().setImageUrl('http://imageurl.ca').setAltText('YOUR ALT TEXT').setCropStyle(CardService.newImageCropStyle()).setBorderStyle(CardService.newBorderStyle());
[[["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-26 UTC."],[[["\u003cp\u003eThe \u003ccode\u003eImageComponent\u003c/code\u003e allows you to add images to grid items within Google Workspace Add-ons and Google Chat apps.\u003c/p\u003e\n"],["\u003cp\u003eYou can customize the image with methods to set the alternative text, border style, crop style, and URL.\u003c/p\u003e\n"],["\u003cp\u003eAll customization methods (\u003ccode\u003esetAltText\u003c/code\u003e, \u003ccode\u003esetBorderStyle\u003c/code\u003e, \u003ccode\u003esetCropStyle\u003c/code\u003e, \u003ccode\u003esetImageUrl\u003c/code\u003e) return the \u003ccode\u003eImageComponent\u003c/code\u003e object for chaining multiple operations.\u003c/p\u003e\n"],["\u003cp\u003eAn \u003ccode\u003eImageComponent\u003c/code\u003e can be created using \u003ccode\u003eCardService.newImageComponent()\u003c/code\u003e, which provides methods for customization.\u003c/p\u003e\n"]]],[],null,["# Class ImageComponent\n\nImageComponent\n\nAn image component that can be added to grid items.\n\nAvailable for Google Workspace add-ons and Google Chat apps.\n\n```javascript\nconst ImageComponent = CardService.newImageComponent()\n .setImageUrl('http://imageurl.ca')\n .setAltText('YOUR ALT TEXT')\n .setCropStyle(CardService.newImageCropStyle())\n .setBorderStyle(CardService.newBorderStyle());\n``` \n\n### Methods\n\n| Method | Return type | Brief description |\n|---------------------------------------------------------------|---------------------|---------------------------------------------|\n| [setAltText(altText)](#setAltText(String)) | [ImageComponent](#) | Sets the alternative text of the image. |\n| [setBorderStyle(borderStyle)](#setBorderStyle(BorderStyle)) | [ImageComponent](#) | Sets the border style applied to the image. |\n| [setCropStyle(imageCropStyle)](#setCropStyle(ImageCropStyle)) | [ImageComponent](#) | Sets the crop style for the image. |\n| [setImageUrl(url)](#setImageUrl(String)) | [ImageComponent](#) | Sets the URL of the image. |\n\nDetailed documentation\n----------------------\n\n### `set``Alt``Text(altText)`\n\nSets the alternative text of the image.\n\n#### Parameters\n\n| Name | Type | Description |\n|-------------|----------|------------------------------------|\n| `alt``Text` | `String` | The alt_text to set for the image. |\n\n#### Return\n\n\n[ImageComponent](#) --- This object, for chaining.\n\n*** ** * ** ***\n\n### `set``Border``Style(borderStyle)`\n\nSets the border style applied to the image.\n\n#### Parameters\n\n| Name | Type | Description |\n|-----------------|-----------------------------------------------------------------|----------------------------------|\n| `border``Style` | [BorderStyle](/apps-script/reference/card-service/border-style) | The BorderStyle object to apply. |\n\n#### Return\n\n\n[ImageComponent](#) --- This object, for chaining.\n\n*** ** * ** ***\n\n### `set``Crop``Style(imageCropStyle)`\n\nSets the crop style for the image.\n\n#### Parameters\n\n| Name | Type | Description |\n|----------------------|------------------------------------------------------------------------|-------------------------------------|\n| `image``Crop``Style` | [ImageCropStyle](/apps-script/reference/card-service/image-crop-style) | The ImageCropStyle object to apply. |\n\n#### Return\n\n\n[ImageComponent](#) --- This object, for chaining.\n\n*** ** * ** ***\n\n### `set``Image``Url(url)`\n\nSets the URL of the image.\n\n#### Parameters\n\n| Name | Type | Description |\n|-------|----------|-------------|\n| `url` | `String` | The URL. |\n\n#### Return\n\n\n[ImageComponent](#) --- This object, for chaining."]]
