Class ImageComponent
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
مكوّن الصورة
عنصر صورة يمكن إضافته إلى عناصر الشبكة
تتوفّر هذه الميزة لإضافات Google Workspace وتطبيقات Google Chat.
const ImageComponent = CardService.newImageComponent()
.setImageUrl('http://imageurl.ca')
.setAltText('YOUR ALT TEXT')
.setCropStyle(CardService.newImageCropStyle())
.setBorderStyle(CardService.newBorderStyle());
مستندات تفصيلية
setAltText(altText)
لضبط النص البديل للصورة
المعلمات
| الاسم | النوع | الوصف |
altText | String | alt_text المطلوب ضبطه للصورة |
الإرجاع
ImageComponent: هذا العنصر، لإنشاء سلسلة.
setBorderStyle(borderStyle)
لضبط نمط الحدود المطبَّق على الصورة.
المعلمات
| الاسم | النوع | الوصف |
borderStyle | BorderStyle | عنصر BorderStyle المطلوب تطبيقه |
الإرجاع
ImageComponent: هذا العنصر، لإنشاء سلسلة.
setCropStyle(imageCropStyle)
لضبط نمط الاقتصاص للصورة.
المعلمات
| الاسم | النوع | الوصف |
imageCropStyle | ImageCropStyle | عنصر ImageCropStyle المطلوب تطبيقه |
الإرجاع
ImageComponent: هذا العنصر، لإنشاء سلسلة.
setImageUrl(url)
لضبط عنوان URL للصورة
المعلمات
| الاسم | النوع | الوصف |
url | String | عنوان URL |
الإرجاع
ImageComponent: هذا العنصر، لإنشاء سلسلة.
إنّ محتوى هذه الصفحة مرخّص بموجب ترخيص Creative Commons Attribution 4.0 ما لم يُنصّ على خلاف ذلك، ونماذج الرموز مرخّصة بموجب ترخيص Apache 2.0. للاطّلاع على التفاصيل، يُرجى مراجعة سياسات موقع Google Developers. إنّ Java هي علامة تجارية مسجَّلة لشركة Oracle و/أو شركائها التابعين.
تاريخ التعديل الأخير: 2025-07-26 (حسب التوقيت العالمي المتفَّق عليه)
[null,null,["تاريخ التعديل الأخير: 2025-07-26 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\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."]]
