Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Componente de imagen
Es un componente de imagen que se puede agregar a los elementos de la cuadrícula.
Disponible para complementos de Google Workspace y apps de Google Chat.
constImageComponent=CardService.newImageComponent().setImageUrl('http://imageurl.ca').setAltText('YOUR ALT TEXT').setCropStyle(CardService.newImageCropStyle()).setBorderStyle(CardService.newBorderStyle());
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 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."]]