البطاقة
واجهة بطاقة يتم عرضها في رسالة Google Chat أو إضافة Google Workspace
تتيح البطاقات تنسيقًا محددًا وعناصر واجهة مستخدم تفاعلية مثل الأزرار والوسائط التفاعلية المتقدمة مثل الصور. استخدِم البطاقات لتقديم معلومات مفصّلة وجمع معلومات من المستخدمين وتوجيه المستخدمين لاتّخاذ الخطوة التالية.
يمكنك تصميم البطاقات ومعاينتها باستخدام أداة إنشاء البطاقات.
فتح "أداة إنشاء البطاقات"
لمعرفة كيفية إنشاء البطاقات، يمكنك الاطّلاع على المستندات التالية:
- بالنسبة إلى تطبيقات Google Chat، يمكنك الاطّلاع على المقالة تصميم مكوّنات البطاقة أو مربّع الحوار.
- بالنسبة إلى إضافات Google Workspace، يُرجى الاطّلاع على الواجهات المستندة إلى البطاقات.
مثال: رسالة بطاقة لتطبيق Google Chat
لإنشاء نموذج لرسالة البطاقة في Google Chat، يمكنك استخدام ملف JSON التالي:
{
"cardsV2": [
{
"cardId": "unique-card-id",
"card": {
"header": {
"title": "Sasha",
"subtitle": "Software Engineer",
"imageUrl":
"https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
"imageType": "CIRCLE",
"imageAltText": "Avatar for Sasha"
},
"sections": [
{
"header": "Contact Info",
"collapsible": true,
"uncollapsibleWidgetsCount": 1,
"widgets": [
{
"decoratedText": {
"startIcon": {
"knownIcon": "EMAIL"
},
"text": "sasha@example.com"
}
},
{
"decoratedText": {
"startIcon": {
"knownIcon": "PERSON"
},
"text": "<font color=\"#80e27e\">Online</font>"
}
},
{
"decoratedText": {
"startIcon": {
"knownIcon": "PHONE"
},
"text": "+1 (555) 555-1234"
}
},
{
"buttonList": {
"buttons": [
{
"text": "Share",
"onClick": {
"openLink": {
"url": "https://example.com/share"
}
}
},
{
"text": "Edit",
"onClick": {
"action": {
"function": "goToView",
"parameters": [
{
"key": "viewType",
"value": "EDIT"
}
]
}
}
}
]
}
}
]
}
]
}
}
]
}
تمثيل JSON |
---|
{ "header": { object ( |
الحقول | |
---|---|
header
|
عنوان البطاقة. يحتوي العنوان عادةً على صورة بادئة وعنوان. تظهر العناوين دائمًا أعلى البطاقة. |
sections[]
|
تحتوي على مجموعة من التطبيقات المصغّرة. لكل قسم عنوان اختياري خاص به. يتم فصل الأقسام مرئيًا باستخدام مُقسّم خط. للحصول على مثال عن تطبيقات Google Chat، راجِع المقالة تحديد قسم من بطاقة. |
sectionDividerStyle
|
نمط الفاصل بين الأقسام. |
cardActions[]
|
إجراءات البطاقة تتم إضافة الإجراءات إلى قائمة شريط أدوات البطاقة.
على سبيل المثال، ينشئ ملف JSON التالي قائمة إجراءات خاصة بالبطاقة تتضمّن الخيارَين
|
name
|
اسم البطاقة يتم استخدامه كمعرّف بطاقة أثناء التنقّل بين البطاقة.
|
fixedFooter
|
التذييل الثابت الذي يظهر أسفل هذه البطاقة.
يؤدي ضبط قيمة
|
displayStyle
|
في إضافات Google Workspace، يتم ضبط خصائص عرض
|
peekCardHeader
|
عند عرض محتوى سياقي، يعمل عنوان بطاقة النظرة كعنصر نائب حتى يتمكّن المستخدِم من الانتقال للأمام بين بطاقات الصفحة الرئيسية والبطاقات السياقية.
|
CardHeader
يمثّل عنوان بطاقة. للاطّلاع على مثال عن تطبيقات Google Chat، راجِع مقالة إضافة عنوان.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{
"title": string,
"subtitle": string,
"imageType": enum (
|
الحقول | |
---|---|
title
|
مطلوبة. هو عنوان عنوان البطاقة. ارتفاع ثابت للرأس: إذا تم تحديد كل من العنوان والعنوان الفرعي، يشغل كل منهما سطرًا واحدًا. إذا تم تحديد العنوان فقط، سيَشغل كلا السطرين. |
subtitle
|
العنوان الفرعي لرأس البطاقة. وتظهر في سطر منفصل أسفل |
imageType
|
الشكل المستخدم لاقتصاص الصورة.
|
imageUrl
|
عنوان URL الذي يستخدم HTTPS للصورة في عنوان البطاقة. |
imageAltText
|
تمثّل هذه السمة النص البديل لهذه الصورة المستخدَم لتسهيل الاستخدام. |
ImageType
الشكل المستخدم لاقتصاص الصورة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
SQUARE
|
القيمة التلقائية. يتم تطبيق قناع مربّع على الصورة. على سبيل المثال، تصبح صورة بتنسيق 4×3 3×3. |
CIRCLE
|
يتم تطبيق قناع دائري على الصورة. على سبيل المثال، تصبح صورة بحجم 4×3 دائرة بقطر 3. |
القسم
يحتوي القسم على مجموعة من التطبيقات المصغّرة المعروضة عموديًا بالترتيب الذي تم تحديدها به.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{
"header": string,
"widgets": [
{
object (
|
الحقول | |
---|---|
header
|
النص الذي يظهر في أعلى القسم يدعم النص البسيط بتنسيق HTML. لمزيد من المعلومات حول تنسيق النص، يُرجى الاطّلاع على القسم تنسيق النص في تطبيقات Google Chat وتنسيق النص في إضافات Google Workspace. |
widgets[]
|
كل التطبيقات المصغّرة في القسم يجب أن تحتوي على تطبيق مصغّر واحد على الأقل. |
collapsible
|
تشير هذه السمة إلى ما إذا كان هذا القسم قابلاً للتصغير. تُخفي الأقسام القابلة للتصغير بعض التطبيقات المصغّرة أو جميعها، ولكن يمكن للمستخدمين توسيع القسم لإظهار التطبيقات المصغّرة المخفية من خلال النقر على عرض المزيد. ويمكن للمستخدمين إخفاء التطبيقات المصغّرة مرة أخرى من خلال النقر على عرض عناصر أقل.
لتحديد التطبيقات المصغّرة المخفية، حدِّد |
uncollapsibleWidgetsCount
|
عدد التطبيقات المصغّرة غير القابلة للتصغير التي تظل مرئية حتى عند تصغير أحد الأقسام
على سبيل المثال، عندما يحتوي أحد الأقسام على خمس تطبيقات مصغّرة ويكون
|
تطبيق مصغّر
تتألّف كل بطاقة من تطبيقات مصغّرة.
الأداة هي كائن مركب يمكن أن يمثل أحد النصوص والصور والأزرار وأنواع أخرى من الكائنات.
تمثيل JSON |
---|
{ "horizontalAlignment": enum ( |
الحقول | |
---|---|
horizontalAlignment
|
تحدِّد هذه السياسة ما إذا كانت التطبيقات المصغّرة تتم محاذاتها إلى يسار العمود أو يمينه أو في منتصفه. |
حقل الاتحاد
data . يمكن أن تحتوي الأداة على عنصر واحد فقط من العناصر التالية. يمكنك استخدام حقول تطبيقات مصغّرة متعددة لعرض المزيد من العناصر.
يمكن أن تكون السمة data واحدًا فقط مما يلي:
|
|
textParagraph
|
لعرض فقرة نصية يدعم النص البسيط بتنسيق HTML. لمزيد من المعلومات حول تنسيق النص، يُرجى الاطّلاع على القسم تنسيق النص في تطبيقات Google Chat وتنسيق النص في إضافات Google Workspace. على سبيل المثال، ينشئ ملف JSON التالي نصًا غامقًا:
|
image
|
تعرِض صورة. على سبيل المثال، ينشئ ملف JSON التالي صورة بنص بديل:
|
decoratedText
|
يعرض عنصرًا نصيًا مزخرفًا. على سبيل المثال، ينشئ ملف JSON التالي أداة نصية مزخرفة تعرض عنوان البريد الإلكتروني:
|
buttonList
|
قائمة بالأزرار. على سبيل المثال، ينشئ ملف JSON التالي زرَّين. الأول هو زر نص أزرق والثاني عبارة عن زر صورة يفتح رابطًا:
|
textInput
|
تعرض مربّع نص يمكن للمستخدمين الكتابة فيه. على سبيل المثال، تُنشئ ملف JSON التالي إدخالاً نصيًا لعنوان بريد إلكتروني:
كمثال آخر، ينشئ JSON التالي إدخالاً نصيًا للغة برمجة مع اقتراحات ثابتة:
|
selectionInput
|
يعرض عنصر تحكّم في التحديد يتيح للمستخدمين اختيار عناصر. يمكن أن تكون عناصر التحكّم في التحديد مربّعات اختيار أو أزرار اختيار أو مفاتيح تحكّم أو قوائم منسدلة. على سبيل المثال، ينشئ ملف JSON التالي قائمة منسدلة تتيح للمستخدمين اختيار الحجم:
|
dateTimePicker
|
يعرض أداة تتيح للمستخدمين إدخال تاريخ أو وقت أو تاريخ ووقت. على سبيل المثال، ينشئ ملف JSON التالي أداة اختيار الوقت والتاريخ لجدولة موعد:
|
divider
|
يتم عرض مُقسّم خط أفقي بين التطبيقات المصغّرة. على سبيل المثال، ينشئ JSON التالي مُقسّمًا:
|
grid
|
لعرض شبكة تحتوي على مجموعة من العناصر. تدعم الشبكة أي عدد من الأعمدة والعناصر. يتم تحديد عدد الصفوف من خلال الحدود القصوى لعناصر الأرقام مقسومًا على عدد الأعمدة. تحتوي شبكة تحتوي على 10 عناصر وعمودين على 5 صفوف. تحتوي شبكة تحتوي على 11 عنصرًا وعمودين على 6 صفوف.
على سبيل المثال، ينشئ ملف JSON التالي شبكة من عمودَين مع عنصر واحد:
|
columns
|
تعرض ما يصل إلى عمودَين.
لتضمين أكثر من عمودَين أو لاستخدام صفوف، استخدِم
تطبيق على سبيل المثال، يُنشئ ملف JSON التالي عمودَين يحتوي كل منهما على فقرات نصية:
|
TextParagraph
فقرة نصية تدعم التنسيق. للحصول على مثال في تطبيقات Google Chat، راجِع المقالة إضافة فقرة من نص منسَّق. لمزيد من المعلومات حول تنسيق النص، يُرجى الاطّلاع على القسم تنسيق النص في تطبيقات Google Chat وتنسيق النص في إضافات Google Workspace.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "text": string } |
الحقول | |
---|---|
text
|
النص الذي يظهر في التطبيق المصغّر |
صورة
تمثّل هذه السمة صورة يتم تحديدها من خلال عنوان URL ويمكن أن تتضمّن الإجراء onClick
. للحصول على مثال، راجِع إضافة صورة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{
"imageUrl": string,
"onClick": {
object (
|
الحقول | |
---|---|
imageUrl
|
تمثّل هذه السمة عنوان URL الذي يستخدم HTTPS الذي يستضيف الصورة. مثال:
|
onClick
|
عندما ينقر المستخدم على الصورة، يؤدي النقر إلى تنفيذ هذا الإجراء. |
altText
|
تمثّل هذه السمة النص البديل لهذه الصورة المستخدَم لتسهيل الاستخدام. |
OnClick
يمثل كيفية الاستجابة عندما ينقر المستخدمون على عنصر تفاعلي في بطاقة، مثل زر.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ // Union field |
الحقول | |
---|---|
حقل الاتحاد
يمكن أن تكون السمة |
|
action
|
وفي حال تحديدها، سيتم تنفيذ إجراء بواسطة
|
openLink
|
في حال تحديد هذا الخيار، سيؤدي هذا
|
openDynamicLinkAction
|
تؤدي الإضافة إلى تشغيل هذا الإجراء عندما يحتاج الإجراء إلى فتح رابط. يختلف هذا الإجراء عن
|
card
|
يتم دفع بطاقة جديدة إلى حزمة البطاقات بعد النقر عليها إذا تم تحديدها.
|
الإجراء
يشير ذلك المصطلح إلى إجراء يصف السلوك عند إرسال النموذج. على سبيل المثال، يمكنك استدعاء نص برمجي لبرمجة التطبيقات من أجل معالجة النموذج. في حال تشغيل الإجراء، يتم إرسال قيم النموذج إلى الخادم.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "function": string, "parameters": [ { object ( |
الحقول | |
---|---|
function
|
دالة مخصّصة للاستدعاء عند النقر على العنصر الذي يحتوي على العنصر أو تفعيله بأي طريقة أخرى. على سبيل المثال، الاستخدام، راجِع قراءة بيانات النموذج. |
parameters[]
|
قائمة مَعلمات الإجراءات |
loadIndicator
|
تحدّد هذه العلامة مؤشر التحميل الذي يعرضه الإجراء أثناء تنفيذ الإجراء. |
persistValues
|
يشير إلى ما إذا كانت قيم النموذج تستمر بعد الإجراء. القيمة التلقائية هي
في حال
في حال |
interaction
|
اختياريّ. مطلوبة عند فتح مربع حوار. الإجراءات التي يجب اتّخاذها استجابةً لتفاعل مع أحد المستخدِمين، مثلاً عندما ينقر المستخدِم على زرّ في رسالة بطاقة
وفي حال عدم تحديد ذلك، يستجيب التطبيق من خلال تنفيذ
من خلال تحديد
|
ActionParameter
قائمة مَعلمات السلسلة المطلوب توفيرها عند استدعاء طريقة الإجراء. على سبيل المثال، ضع في اعتبارك ثلاثة أزرار تأجيل: تأجيل الآن، أو تأجيل يوم واحد، أو تأجيل الأسبوع التالي. يمكنك استخدام
action method = snooze()
، مع ضبط نوع التأجيل ووقت التأجيل في قائمة مَعلمات السلسلة.
لمزيد من المعلومات، يمكنك الاطّلاع على
CommonEventObject
.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "key": string, "value": string } |
الحقول | |
---|---|
key
|
اسم مَعلمة النص البرمجي للإجراء. |
value
|
قيمة المَعلمة. |
LoadIndicator
تحدّد هذه العلامة مؤشر التحميل الذي يعرضه الإجراء أثناء تنفيذ الإجراء.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
SPINNER
|
تعرض مؤشرًا دوّارًا للإشارة إلى أنّ المحتوى قيد التحميل |
NONE
|
ولا يتم عرض أي بيانات. |
التفاعل
اختياريّ. مطلوبة عند فتح مربع حوار.
الإجراءات التي يجب اتّخاذها استجابةً لتفاعل مع أحد المستخدِمين، مثلاً عندما ينقر المستخدِم على زرّ في رسالة بطاقة
وفي حال عدم تحديد ذلك، يستجيب التطبيق من خلال تنفيذ action
، مثل فتح رابط أو تشغيل وظيفة، كالعادة.
من خلال تحديد interaction
، يمكن للتطبيق أن يستجيب بطرق تفاعلية خاصة. على سبيل المثال، من خلال ضبط interaction
على OPEN_DIALOG
، يمكن للتطبيق فتح مربع حوار.
عند تحديدها، لا يتم عرض مؤشر تحميل. إذا تم تحديد إحدى الإضافات، تتم إزالة البطاقة بالكامل ولن يتم عرض أي شيء في البرنامج.
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
عمليات التعداد | |
---|---|
INTERACTION_UNSPECIFIED
|
القيمة التلقائية. يعمل action كالعادة.
|
OPEN_DIALOG
|
يتم فتح مربّع حوار، وهو واجهة مستندة إلى بطاقة على شكل نافذة تستخدمها تطبيقات Chat للتفاعل مع المستخدمين. لا تتوفّر هذه الميزة إلا في تطبيقات Chat استجابةً للنقرات على الأزرار على رسائل البطاقات. إذا تم تحديد إحدى الإضافات، تتم إزالة البطاقة بالكامل ولن يتم عرض أي شيء في البرنامج.
|
OpenLink
ويمثِّل حدث onClick
يفتح رابطًا تشعّبيًا.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "url": string, "openAs": enum ( |
الحقول | |
---|---|
url
|
عنوان URL المطلوب فتحه. |
openAs
|
كيفية فتح رابط.
|
onClose
|
ما إذا كان العميل ينسى رابطًا بعد فتحه أو يراقبه حتى تغلق النافذة.
|
OpenAs
عندما يفتح إجراء OnClick
رابطًا، يمكن للعميل إما فتحه في نافذة بالحجم الكامل (إذا كان هذا هو الإطار الذي يستخدمه البرنامج) أو تراكب (مثل نافذة منبثقة). يعتمد التنفيذ على إمكانات النظام الأساسي للعميل، وقد يتم تجاهل القيمة المحدّدة إذا لم يكن العميل يتيحها.
تتوافق السمة FULL_SIZE
مع جميع البرامج.
متاحة لإضافات Google Workspace ولا تتوفّر لتطبيقات Google Chat.
عمليات التعداد | |
---|---|
FULL_SIZE
|
يتم فتح الرابط كنافذة بالحجم الكامل (إذا كان هذا هو الإطار الذي يستخدمه العميل). |
OVERLAY
|
يفتح الرابط كتراكب، مثل نافذة منبثقة. |
OnClose
ما يفعله العميل عندما يتم إغلاق رابط يتم فتحه من خلال إجراء
OnClick
.
يعتمد التنفيذ على إمكانات النظام الأساسي للعميل. على سبيل المثال، قد يفتح متصفّح ويب رابطًا في نافذة منبثقة باستخدام معالج
OnClose
.
إذا تم ضبط معالِجَي
OnOpen
وOnClose
،
ولا يمكن للنظام الأساسي للعميل إتاحة استخدام القيمتَين،
تكون الأولوية لـ
OnClose
.
متاحة لإضافات Google Workspace ولا تتوفّر لتطبيقات Google Chat.
عمليات التعداد | |
---|---|
NOTHING
|
القيمة التلقائية. تتعذّر إعادة تحميل البطاقة، وبالتالي لا يحدث شيء. |
RELOAD
|
إعادة تحميل البطاقة بعد إغلاق النافذة الفرعية
وإذا تم استخدامها مع
|
DecoratedText
تطبيق مصغّر يعرض نصًا مع زخرفة اختيارية، مثل تصنيف أعلى النص أو أسفله أو رمز أمام النص أو أداة اختيار أو زر بعد النص للاطّلاع على مثال في تطبيقات Google Chat، يمكنك الاطّلاع على مقالة عرض نص مع نص مزخرف.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "icon": { object ( |
الحقول | |
---|---|
icon
|
تم إيقافها لصالح
|
startIcon
|
الرمز المعروض أمام النص |
topLabel
|
النص الذي يظهر أعلى
|
text
|
مطلوبة. تمثّل هذه السمة النص الأساسي. دعم التنسيق البسيط. لمزيد من المعلومات حول تنسيق النص، يُرجى الاطّلاع على القسم تنسيق النص في تطبيقات Google Chat وتنسيق النص في إضافات Google Workspace. |
wrapText
|
إعداد التفاف النص. إذا تم
ينطبق هذا الإعداد فقط على |
bottomLabel
|
النص الذي يظهر أسفل |
onClick
|
يتم تشغيل هذا الإجراء عندما ينقر المستخدمون على
|
حقل الاتحاد
control . زر أو مفتاح أو مربّع اختيار أو صورة تظهر على الجانب الأيسر من النص في
تطبيق decoratedText المصغّر.
يمكن أن تكون السمة control واحدًا فقط مما يلي:
|
|
button
|
زر يمكن للمستخدم النقر عليه لتشغيل إجراء ما. |
switchControl
|
تطبيق مصغّر للتبديل يمكن للمستخدم النقر عليه لتغيير حالته وتفعيل أحد الإجراءات |
endIcon
|
رمز يظهر بعد النص |
الرمز
رمز معروض في تطبيق مصغّر على بطاقة للاطّلاع على مثال عن تطبيقات Google Chat، راجِع إضافة رمز.
وتتيح استخدام رموز مدمجة ومخصّصة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "altText": string, "imageType": enum ( |
الحقول | |
---|---|
altText
|
اختياريّ. تمثّل هذه السمة وصف الرمز المستخدَم لتسهيل الاستخدام. وفي حال عدم تحديدها، يتم توفير القيمة التلقائية
وفي حال ضبط الرمز في |
imageType
|
نمط الاقتصاص المطبّق على الصورة في بعض الحالات، يؤدي تطبيق
اقتصاص |
حقل الاتحاد
icons . الرمز المعروض في التطبيق المصغّر على البطاقة
يمكن أن تكون السمة icons واحدًا فقط مما يلي:
|
|
knownIcon
|
عرض أحد الرموز المضمّنة التي توفّرها Google Workspace
على سبيل المثال، لعرض رمز الطائرة، حدِّد للحصول على قائمة كاملة بالرموز المتوافقة، يمكنك الاطّلاع على الرموز المضمَّنة. |
iconUrl
|
عرض رمز مخصّص مستضاف على عنوان URL يستخدم HTTPS مثال:
وتتضمّن أنواع الملفات المسموح بها |
materialIcon
|
اعرض أحد رموز Material من Google. على سبيل المثال، لعرض رمز مربّع الاختيار، استخدِم
|
MaterialIcon
رمز Google Material الذي يتضمّن أكثر من 2500 خيار
على سبيل المثال، لعرض رمز مربّع اختيار مع وزن ودرجة مخصّصَين، اكتب ما يلي:
{
"name": "check_box",
"fill": true,
"weight": 300,
"grade": -25
}
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
تمثيل JSON |
---|
{ "name": string, "fill": boolean, "weight": integer, "grade": integer } |
الحقول | |
---|---|
name
|
تمثّل هذه السمة اسم الرمز المحدّد في رمز Material من Google، مثل |
fill
|
ما إذا كان يتم عرض الرمز على أنّه معبأ أم لا. وتكون القيمة التلقائية "خطأ". لمعاينة إعدادات الرموز المختلفة، انتقِل إلى رموز الخطوط من Google وعدِّل الإعدادات ضمن تخصيص. |
weight
|
كثافة الحد الخارجي للرمز. اختَر من بين {100, 200, 300, 400, 500, 600, 700}. في حال عدم توفر القيمة، تكون القيمة التلقائية 400. وفي حال تحديد أي قيمة أخرى، سيتم استخدام القيمة التلقائية. لمعاينة إعدادات الرموز المختلفة، انتقِل إلى رموز الخطوط من Google وعدِّل الإعدادات ضمن تخصيص. |
grade
|
يؤثر الوزن والدرجة في سُمك الرمز. تعد التعديلات التي يتم إجراؤها على الدرجة أكثر دقة من تعديلات الوزن ولها تأثير بسيط على حجم الرمز. اختر من بين {-25, 0, 200}. في حال عدم توفّر هذه القيمة، تكون القيمة التلقائية 0. وفي حال تحديد أي قيمة أخرى، سيتم استخدام القيمة التلقائية. لمعاينة إعدادات الرموز المختلفة، انتقِل إلى رموز الخطوط من Google وعدِّل الإعدادات ضمن تخصيص. |
زرّ
نص أو أيقونة أو زر نص وأيقونة يمكن للمستخدمين النقر فوقه. للاطّلاع على مثال عن تطبيقات Google Chat، راجِع إضافة زر.
لجعل صورة زرّ قابلاً للنقر، حدِّد
(وليس
Image
) واضبط
إجراء
ImageComponent
onClick
.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "text": string, "icon": { object ( |
الحقول | |
---|---|
text
|
النص المعروض داخل الزر. |
icon
|
صورة الرمز إذا تم ضبط كل من |
color
|
في حال ضبط هذه السياسة، تتم تعبئة الزرّ بلون خلفية ثابت ويتغير لون الخط للحفاظ على التباين مع لون الخلفية. على سبيل المثال، يؤدي ضبط خلفية زرقاء على الأرجح إلى ظهور نص باللون الأبيض. في حال ترك هذه السياسة بدون ضبط، تكون خلفية الصورة بيضاء ويكون لون الخط أزرق.
بالنسبة إلى اللون الأحمر والأخضر والأزرق، تكون قيمة كل حقل
رقم
يمكنك اختياريًا ضبط
بالنسبة إلى على سبيل المثال، يمثل اللون التالي لونًا أحمر نصف شفاف:
|
onClick
|
مطلوبة. الإجراء الذي يتم تنفيذه عندما ينقر المستخدم على الزر، مثل فتح رابط تشعّبي أو تشغيل وظيفة مخصّصة. |
disabled
|
إذا
|
altText
|
تمثّل هذه السمة النص البديل المستخدَم لتسهيل الاستخدام. قم بتعيين نص وصفي يتيح للمستخدمين معرفة وظيفة الزر. على سبيل المثال، إذا كان أحد الأزرار يفتح رابطًا تشعّبيًا، يمكنك كتابة: "يتم فتح علامة تبويب جديدة في المتصفح والانتقال إلى مستندات مطوّري برامج Google Chat على https://developers.google.com/workspace/chat". |
اللون
يمثل لونًا في مساحة لون RGBA. تم تصميم هذا التمثيل لسهولة التحويل إلى تمثيلات الألوان ومنها بلغات مختلفة بدلاً من الضغط. على سبيل المثال، يمكن تقديم حقول هذا التمثيل بشكل بسيط إلى الدالة الإنشائية java.awt.Color
في Java، ويمكن أيضًا توفيره بشكل بسيط لطريقة +colorWithRed:green:blue:alpha
في UIColor على iOS. بقليل من العمل، يمكن تنسيقه بسهولة على شكل سلسلة CSS rgba()
في JavaScript.
لا تحتوي هذه الصفحة المرجعية على معلومات عن مساحة اللون المطلقة التي يجب استخدامها لتفسير قيمة نموذج أحمر أخضر أزرق، على سبيل المثال، sRGB وAdobe RGB وDCI-P3 وBT.2020. بشكل افتراضي، يجب أن تفترض التطبيقات مساحة اللون sRGB.
عند الحاجة إلى تحديد مساواة الألوان، يجب تطبيق لونَين على مبدأ التساوي، ما لم يرِد خلاف ذلك، إذا كانت قيم كل من اللونَين الأحمر والأخضر والأزرق والألفا مختلفة على الأكثر بنسبة
1e-5
.
مثال (Java):
import com.google.type.Color;
// ...
public static java.awt.Color fromProto(Color protocolor) {
float alpha = protocolor.hasAlpha()
? protocolor.getAlpha().getValue()
: 1.0;
return new java.awt.Color(
protocolor.getRed(),
protocolor.getGreen(),
protocolor.getBlue(),
alpha);
}
public static Color toProto(java.awt.Color color) {
float red = (float) color.getRed();
float green = (float) color.getGreen();
float blue = (float) color.getBlue();
float denominator = 255.0;
Color.Builder resultBuilder =
Color
.newBuilder()
.setRed(red / denominator)
.setGreen(green / denominator)
.setBlue(blue / denominator);
int alpha = color.getAlpha();
if (alpha != 255) {
result.setAlpha(
FloatValue
.newBuilder()
.setValue(((float) alpha) / denominator)
.build());
}
return resultBuilder.build();
}
// ...
مثال (iOS / Obj-C):
// ...
static UIColor* fromProto(Color* protocolor) {
float red = [protocolor red];
float green = [protocolor green];
float blue = [protocolor blue];
FloatValue* alpha_wrapper = [protocolor alpha];
float alpha = 1.0;
if (alpha_wrapper != nil) {
alpha = [alpha_wrapper value];
}
return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
}
static Color* toProto(UIColor* color) {
CGFloat red, green, blue, alpha;
if (![color getRed:&red green:&green blue:&blue alpha:&alpha]) {
return nil;
}
Color* result = [[Color alloc] init];
[result setRed:red];
[result setGreen:green];
[result setBlue:blue];
if (alpha <= 0.9999) {
[result setAlpha:floatWrapperWithValue(alpha)];
}
[result autorelease];
return result;
}
// ...
مثال (JavaScript):
// ...
var protoToCssColor = function(rgb_color) {
var redFrac = rgb_color.red || 0.0;
var greenFrac = rgb_color.green || 0.0;
var blueFrac = rgb_color.blue || 0.0;
var red = Math.floor(redFrac * 255);
var green = Math.floor(greenFrac * 255);
var blue = Math.floor(blueFrac * 255);
if (!('alpha' in rgb_color)) {
return rgbToCssColor(red, green, blue);
}
var alphaFrac = rgb_color.alpha.value || 0.0;
var rgbParams = [red, green, blue].join(',');
return ['rgba(', rgbParams, ',', alphaFrac, ')'].join('');
};
var rgbToCssColor = function(red, green, blue) {
var rgbNumber = new Number((red << 16) | (green << 8) | blue);
var hexString = rgbNumber.toString(16);
var missingZeros = 6 - hexString.length;
var resultBuilder = ['#'];
for (var i = 0; i < missingZeros; i++) {
resultBuilder.push('0');
}
resultBuilder.push(hexString);
return resultBuilder.join('');
};
// ...
تمثيل JSON |
---|
{ "red": number, "green": number, "blue": number, "alpha": number } |
الحقول | |
---|---|
red
|
مقدار اللون الأحمر في اللون كقيمة في الفاصل الزمني [0، 1]. |
green
|
مقدار اللون الأخضر في اللون كقيمة في الفاصل الزمني [0، 1]. |
blue
|
مقدار اللون الأزرق في اللون كقيمة في الفاصل الزمني [0، 1]. |
alpha
|
جزء هذا اللون الذي يجب تطبيقه على البكسل. بمعنى، يتم تحديد لون البكسل النهائي من خلال المعادلة:
هذا يعني أن القيمة 1.0 تتجاوب مع اللون الخالص، في حين أن القيمة 0.0 تتجاوب مع لون شفاف تمامًا. ويستخدم هذا الأمر رسالة برنامج تضمين بدلاً من قيمة عددية عائمة بسيطة، بحيث يمكن التمييز بين القيمة الافتراضية والقيمة التي يتم تركها بدون ضبط. في حال حذفه، يتم عرض كائن اللون هذا كلون ثابت (كما لو تم تحديد قيمة ألفا بشكل صريح للقيمة 1.0). |
SwitchControl
إما مفتاح تبديل بنمط التبديل أو مربّع اختيار داخل
تطبيق decoratedText
المصغّر.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
ولا تتوفّر هذه الميزة إلا في
تطبيق decoratedText
المصغّر.
تمثيل JSON |
---|
{ "name": string, "value": string, "selected": boolean, "onChangeAction": { object ( |
الحقول | |
---|---|
name
|
الاسم الذي يتم من خلاله تحديد تطبيق مفتاح التبديل في حدث إدخال النموذج. للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
value
|
القيمة التي أدخلها المستخدم، يتم عرضها كجزء من حدث إدخال نموذج للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
selected
|
عند
|
onChangeAction
|
الإجراء الذي يتم تنفيذه عند تغيير حالة التبديل، مثل الوظيفة المطلوب تشغيلها. |
controlType
|
كيفية ظهور مفتاح التبديل في واجهة المستخدم
|
ControlType
كيفية ظهور مفتاح التبديل في واجهة المستخدم
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
SWITCH
|
مفتاح تبديل بنمط التبديل |
CHECKBOX
|
تم إيقافها لصالح
CHECK_BOX .
|
CHECK_BOX
|
مربّع اختيار |
ButtonList
قائمة بالأزرار الموضوعة أفقيًا. للاطّلاع على مثال عن تطبيقات Google Chat، راجِع إضافة زر.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{
"buttons": [
{
object (
|
الحقول | |
---|---|
buttons[]
|
مجموعة من الأزرار. |
TextInput
حقل يمكن للمستخدمين إدخال نص فيه. دعم الاقتراحات والإجراءات القابلة للتغيير للحصول على مثال عن تطبيقات Google Chat، راجِع المقالة إضافة حقل يمكن للمستخدم إدخال نص فيه.
تتلقّى تطبيقات Chat قيمة النص الذي تم إدخاله ويمكنها معالجتها أثناء أحداث إدخال النموذج. للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج.
عندما تحتاج إلى جمع بيانات غير محدّدة أو مجردة من المستخدمين، استخدِم إدخالاً نصيًا. لجمع بيانات محدّدة أو عددية من المستخدمين، استخدِم
التطبيق المصغّر SelectionInput
.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "name": string, "label": string, "hintText": string, "value": string, "type": enum ( |
الحقول | |
---|---|
name
|
الاسم الذي يتم من خلاله تحديد إدخال النص في حدث إدخال نموذج. للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
label
|
النص الذي يظهر أعلى حقل إدخال النص في واجهة المستخدم
حدِّد نصًا يساعد المستخدم في إدخال المعلومات التي يحتاجها تطبيقك. على سبيل المثال، إذا كنت تسأل عن اسم أحد الأشخاص ولكنّك تحتاج إلى اسم العائلة على وجه التحديد، اكتب
تكون هذه السمة مطلوبة في حال عدم تحديد
السمة |
hintText
|
نص يظهر أسفل حقل إدخال النص يهدف إلى مساعدة المستخدمين من خلال مطالبتهم بإدخال قيمة معيّنة ويظهر هذا النص دائمًا.
تكون هذه السمة مطلوبة في حال عدم تحديد
السمة |
value
|
القيمة التي أدخلها المستخدم، يتم عرضها كجزء من حدث إدخال نموذج للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
type
|
طريقة ظهور حقل إدخال نص في واجهة المستخدِم على سبيل المثال، ما إذا كان الحقل فرديًا أو متعدّد الأسطر. |
onChangeAction
|
ما يجب فعله عند حدوث تغيير في حقل إدخال النص. على سبيل المثال، المستخدم يضيف إلى الحقل أو يحذف نصًا. تشمل أمثلة الإجراءات التي يجب اتّخاذها تشغيل وظيفة مخصّصة أو فتح مربّع حوار في Google Chat. |
initialSuggestions
|
القيم المقترَحة التي يمكن للمستخدمين إدخالها وتظهر هذه القيم عندما ينقر المستخدمون داخل حقل إدخال النص. أثناء كتابة المستخدمين، تتم فلترة القيم المقترَحة بشكل ديناميكي لتتطابق مع ما كتبه المستخدمون.
على سبيل المثال، قد يقترح حقل إدخال نصي للغة البرمجة Java وJavaScript وPython وC++. عندما يبدأ المستخدمون في كتابة
تساعد القيم المقترَحة في توجيه المستخدمين لإدخال قيم يمكن لتطبيقك فهمها. عند الإشارة إلى JavaScript، قد يُدخل بعض المستخدمين
عند تحديدها، يتم ضبط السمة
|
autoCompleteAction
|
اختياريّ. يمكنك تحديد الإجراء الذي يجب اتخاذه عندما يقدّم حقل إدخال النص اقتراحات للمستخدمين الذين يتفاعلون معه.
وفي حال عدم تحديد نوع الاقتراحات، يتم ضبط الاقتراحات من خلال
إذا تم تحديدها، يتخذ التطبيق الإجراء المحدّد هنا، مثل تشغيل دالة مخصّصة.
|
placeholderText
|
نص يظهر في حقل إدخال النص عندما يكون الحقل فارغًا. استخدِم هذا النص لطلب إدخال قيمة من المستخدمين. مثلاً:
|
النوع
طريقة ظهور حقل إدخال نص في واجهة المستخدِم على سبيل المثال، ما إذا كان حقل إدخال سطرًا واحدًا أو إدخالاً متعدد الأسطر. إذا تم تحديد initialSuggestions
، يتم ضبط type
دائمًا على SINGLE_LINE
، حتى إذا تم ضبطها على MULTIPLE_LINE
.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
SINGLE_LINE
|
ارتفاع حقل إدخال النص ثابت بمقدار سطر واحد. |
MULTIPLE_LINE
|
ارتفاع حقل إدخال النص ثابت من عدة أسطر. |
RenderActions
هو مجموعة من تعليمات العرض التي تطلب من بطاقة تنفيذ إجراء ما أو تطلب من تطبيق المضيف أو تطبيق Chat تنفيذ إجراء خاص بالتطبيق.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
الحقول | |
---|---|
action |
الإجراء
الحقول | |
---|---|
navigations[] |
دفع البطاقات المعروضة أو تعديلها |
اقتراحات
القيم المقترَحة التي يمكن للمستخدمين إدخالها وتظهر هذه القيم عندما ينقر المستخدمون داخل حقل إدخال النص. أثناء كتابة المستخدمين، تتم فلترة القيم المقترَحة بشكل ديناميكي لتتطابق مع ما كتبه المستخدمون.
على سبيل المثال، قد يقترح حقل إدخال نصي للغة البرمجة Java وJavaScript وPython وC++. عندما يبدأ المستخدمون في كتابة Jav
، ستظهر قائمة بفلاتر الاقتراحات لعرض Java
وJavaScript
.
تساعد القيم المقترَحة في توجيه المستخدمين لإدخال قيم يمكن لتطبيقك فهمها. عند الإشارة إلى JavaScript، قد يُدخل بعض المستخدمين
javascript
بينما يُدخل البعض الآخر
java script
. يمكن أن يؤدي اقتراح السمة JavaScript
إلى توحيد طريقة تفاعل المستخدمين مع تطبيقك.
عند تحديدها، يتم ضبط السمة TextInput.type
دائمًا على SINGLE_LINE
، حتى إذا كانت مضبوطة على MULTIPLE_LINE
.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{
"items": [
{
object (
|
الحقول | |
---|---|
items[]
|
قائمة بالاقتراحات المستخدَمة لاقتراحات الإكمال التلقائي في حقول الإدخال النصي |
SuggestionItem
تمثّل هذه السمة قيمة مقترَحة يمكن للمستخدمين إدخالها في حقل إدخال نص.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ // Union field |
الحقول | |
---|---|
حقل الاتحاد
يمكن أن تكون السمة |
|
text
|
قيمة إدخال مقترح في حقل إدخال نص. يعادل ذلك ما يدخله المستخدمون بأنفسهم. |
SelectionInput
أداة تُنشئ عنصرًا أو أكثر من عناصر واجهة المستخدم التي يمكن للمستخدمين اختيارها. على سبيل المثال، قائمة منسدلة أو مربّعات اختيار. يمكنك استخدام هذا التطبيق المصغّر لجمع بيانات يمكن توقّعها أو تعدادها. للاطّلاع على مثال عن تطبيقات Google Chat، راجِع مقالة إضافة عناصر واجهة مستخدم قابلة للاختيار.
يمكن لتطبيقات Chat معالجة قيمة العناصر التي يختارها المستخدمون أو يُدخلونها. للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج.
لجمع بيانات غير محدّدة أو مجرّدة من المستخدمين، استخدِم
التطبيق المصغّر
TextInput
.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "name": string, "label": string, "type": enum ( |
الحقول | |
---|---|
name
|
الاسم الذي يحدِّد إدخال الاختيار في حدث إدخال النموذج. للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
label
|
النص الذي يظهر أعلى حقل إدخال الاختيار في واجهة المستخدم. حدِّد نصًا يساعد المستخدم في إدخال المعلومات التي يحتاجها تطبيقك. على سبيل المثال، إذا يختار المستخدمون مدى الحاجة الملحّة لطلب عمل من قائمة منسدلة، فقد يكون التصنيف "الإلحاح" أو "اختيار الاستعجال". |
type
|
نوع العناصر التي يتم عرضها للمستخدمين في تطبيق
|
items[]
|
تمثّل هذه السمة مصفوفة من العناصر القابلة للاختيار. على سبيل المثال، مصفوفة من أزرار الاختيار أو مربّعات الاختيار. تتيح استخدام ما يصل إلى 100 عنصر. |
onChangeAction
|
في حال تم تحديد الخيار، يتم إرسال النموذج عند تغيير الاختيار. وإذا لم يتم تحديدها، يجب تحديد زر منفصل لإرسال النموذج. للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
multiSelectMaxSelectedItems
|
بالنسبة إلى قوائم الاختيار المتعدد، الحد الأقصى لعدد العناصر التي يمكن للمستخدم اختيارها. الحد الأدنى للقيمة هو سلعة واحدة. وفي حال عدم تحديد قيمة، سيتم ضبط القيمة التلقائية على 3 عناصر. |
multiSelectMinQueryLength
|
بالنسبة إلى قوائم الاختيار المتعدد، يتم إكمال عدد الأحرف النصية التي يُدخلها المستخدم قبل أن يطلب التطبيق الإكمال التلقائي ويعرض العناصر المقترحة في القائمة. في حال عدم تحديد قيمة، سيتم ضبط القيمة التلقائية على 0 لمصادر البيانات الثابتة و3 أحرف لمصادر البيانات الخارجية. |
حقل الاتحاد
|
|
externalDataSource
|
مصدر بيانات خارجي، مثل قاعدة بيانات ارتباطية. |
platformDataSource
|
مصدر بيانات من Google Workspace |
SelectionType
تمثّل هذه السمة تنسيق السلع التي يمكن للمستخدمين اختيارها. تدعم الخيارات المختلفة أنواعًا مختلفة من التفاعلات. على سبيل المثال، يمكن للمستخدمين تحديد مربعات اختيار متعددة، ولكن يمكنهم فقط تحديد عنصر واحد من القائمة المنسدلة.
يتيح كل إدخال تحديد نوعًا واحدًا من الاختيار. على سبيل المثال، لا يمكن الجمع بين مربّعات الاختيار ومفاتيح التبديل.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
CHECK_BOX
|
مجموعة من مربعات الاختيار. يمكن للمستخدمين وضع علامة في مربّع اختيار واحد أو أكثر. |
RADIO_BUTTON
|
مجموعة من أزرار الاختيار. ويمكن للمستخدمين اختيار زر اختيار واحد. |
SWITCH
|
مجموعة من مفاتيح التحكّم. يمكن للمستخدمين تفعيل مفتاح تحكّم واحد أو أكثر. |
DROPDOWN
|
قائمة منسدلة يمكن للمستخدمين اختيار عنصر واحد من القائمة. |
MULTI_SELECT
|
قائمة تحديد متعدد للبيانات الثابتة أو الديناميكية. من شريط القوائم، يختار المستخدمون عنصرًا واحدًا أو أكثر. يمكن للمستخدمين أيضًا إدخال قيم لتعبئة البيانات الديناميكية. على سبيل المثال، يمكن للمستخدمين البدء في كتابة اسم مساحة Google Chat وتقترح الأداة المساحة تلقائيًا. لتعبئة العناصر في قائمة اختيار متعدّد، يمكنك استخدام أحد أنواع مصادر البيانات التالية:
للحصول على أمثلة حول طريقة تطبيق قوائم الاختيار المتعدّد، راجِع إضافة قائمة اختيار متعدّد.
|
SelectionItem
يشير ذلك المصطلح إلى عنصر يمكن للمستخدمين اختياره في إدخالات الاختيار، مثل مربّع الاختيار أو مفتاح التحكّم.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "text": string, "value": string, "selected": boolean, "startIconUri": string, "bottomText": string } |
الحقول | |
---|---|
text
|
النص الذي يحدد العنصر أو يصفه للمستخدمين. |
value
|
القيمة المرتبطة بهذا العنصر. على العميل استخدام هذه القيمة كقيمة إدخال نموذج. للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
selected
|
ما إذا كان قد تم اختيار العنصر تلقائيًا إذا كان إدخال التحديد يقبل قيمة واحدة فقط (مثل أزرار الاختيار أو قائمة منسدلة)، اضبط هذا الحقل لعنصر واحد فقط. |
startIconUri
|
بالنسبة إلى قوائم الاختيار المتعدد، يكون عنوان URL للرمز المعروض بجانب حقل
|
bottomText
|
بالنسبة إلى قوائم الاختيار المتعدد، هو وصف نصي أو تصنيف يتم عرضه أسفل حقل
|
PlatformDataSource
بالنسبة إلى التطبيق المصغّر
الذي يستخدم قائمة اختيار متعدّدة، وهو مصدر بيانات من Google Workspace. يُستخدَم لتعبئة العناصر في قائمة تحديد متعدد.
SelectionInput
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
تمثيل JSON |
---|
{ // Union field |
الحقول | |
---|---|
حقل الاتحاد
data_source . مصدر البيانات.
يمكن أن تكون السمة data_source واحدًا فقط مما يلي:
|
|
commonDataSource
|
مصدر بيانات تتم مشاركته من خلال جميع تطبيقات Google Workspace، مثل المستخدمين في مؤسسة Google Workspace. |
hostAppDataSource
|
مصدر بيانات فريد لتطبيق مضيف في Google Workspace، مثل المساحات في Google Chat. |
CommonDataSource
مصدر بيانات تتم مشاركته بين جميع تطبيقات Google Workspace.
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
عمليات التعداد | |
---|---|
UNKNOWN
|
القيمة التلقائية. يُرجى عدم استخدامها. |
USER
|
مستخدمي Google Workspace. يمكن للمستخدم الاطّلاع على المستخدمين واختيارهم من مؤسسته في Google Workspace فقط. |
HostAppDataSourceMarkup
بالنسبة إلى التطبيق المصغّر "
" الذي يستخدم قائمة اختيار متعدّدة، وهو مصدر بيانات من تطبيق Google Workspace. يملأ مصدر البيانات عناصر التحديد لقائمة التحديد المتعدد.
SelectionInput
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
تمثيل JSON |
---|
{ // Union field |
الحقول | |
---|---|
حقل الاتحاد
data_source . تطبيق Google Workspace الذي يملأ العناصر في قائمة خيارات متعدّدة
يمكن أن تكون السمة data_source واحدًا فقط مما يلي:
|
|
chatDataSource
|
مصدر بيانات من Google Chat |
ChatClientDataSourceMarkup
بالنسبة إلى تطبيق
المصغّر الذي يستخدم قائمة اختيار متعدّدة، وهو مصدر بيانات من Google Chat. يملأ مصدر البيانات عناصر التحديد لقائمة التحديد المتعدد. على سبيل المثال، يمكن للمستخدم اختيار مساحات Google Chat التي ينتمي إليها.
SelectionInput
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
تمثيل JSON |
---|
{ // Union field |
الحقول | |
---|---|
حقل الاتحاد
source . مصدر بيانات Google Chat
يمكن أن تكون السمة source واحدًا فقط مما يلي:
|
|
spaceDataSource
|
مساحات Google Chat التي يكون المستخدم عضوًا فيها |
SpaceDataSource
مصدر بيانات يملأ مساحات Google Chat كعناصر اختيار لقائمة اختيارات متعدّدة. تتم تعبئة المساحات التي ينتمي إليها المستخدم فقط.
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
تمثيل JSON |
---|
{ "defaultToCurrentSpace": boolean } |
الحقول | |
---|---|
defaultToCurrentSpace
|
في حال ضبط هذه السياسة على
|
DateTimePicker
تسمح للمستخدمين بإدخال تاريخ أو وقت، أو إدخال تاريخ ووقت معًا. للحصول على مثال في تطبيقات Google Chat، راجِع مقالة السماح للمستخدم باختيار تاريخ ووقت.
يمكن للمستخدمين إدخال نص أو استخدام أداة الاختيار لاختيار التواريخ والأوقات. إذا أدخل المستخدمون تاريخًا أو وقتًا غير صالح، ستعرض أداة الاختيار خطأ يطلب من المستخدمين إدخال المعلومات بشكل صحيح.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "name": string, "label": string, "type": enum ( |
الحقول | |
---|---|
name
|
الاسم الذي يتم به تحديد
للحصول على تفاصيل عن استخدام إدخالات النموذج، يُرجى الاطّلاع على تلقّي بيانات النموذج. |
label
|
النص الذي يطلب من المستخدمين إدخال تاريخ أو وقت أو تاريخ ووقت. على سبيل المثال، إذا كان المستخدمون يحددون موعدًا، استخدِم تصنيفًا مثل |
type
|
ما إذا كان التطبيق المصغّر يسمح بإدخال تاريخ أو وقت أو تاريخ ووقت |
valueMsEpoch
|
القيمة التلقائية المعروضة في التطبيق المصغّر بالمللي ثانية منذ وقت حقبة يونكس.
حدِّد القيمة استنادًا إلى نوع أداة الاختيار (
|
timezoneOffsetDate
|
الرقم الذي يمثّل معادلة المنطقة الزمنية من التوقيت العالمي المنسَّق (UTC) بالدقائق. وفي حال ضبطها، يتم عرض
|
onChangeAction
|
يتم تشغيله عندما ينقر المستخدم على
حفظ
أو
محو
من واجهة
|
DateTimePickerType
تمثّل هذه السمة تنسيق التاريخ والوقت في تطبيق
DateTimePicker
المصغّر. تُحدِّد ما إذا كان يمكن للمستخدمين إدخال تاريخ أو وقت أو كلٍّ من التاريخ والوقت.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
DATE_AND_TIME
|
يُدخِل المستخدمون التاريخ والوقت. |
DATE_ONLY
|
يُدخل المستخدمون تاريخًا. |
TIME_ONLY
|
يُدخل المستخدمون وقتًا. |
فاصل
لا يشتمل هذا النوع على أي حقول.
يتم عرض مُقسّم بين التطبيقات المصغّرة كخط أفقي. للاطّلاع على مثال عن تطبيقات Google Chat، راجِع إضافة فاصل أفقي بين التطبيقات المصغّرة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
على سبيل المثال، ينشئ JSON التالي مُقسّمًا:
"divider": {}
معرّف الإصدار العالمي (GRid)
لعرض شبكة تحتوي على مجموعة من العناصر. يمكن أن تتضمن العناصر نصًا أو صورًا فقط. بالنسبة إلى الأعمدة المتجاوبة أو لتضمين أكثر من النصوص أو الصور، استخدِم
. للاطّلاع على مثال عن تطبيقات Google Chat، يمكنك مراجعة القسم عرض شبكة تحتوي على مجموعة من العناصر.
Columns
تدعم الشبكة أي عدد من الأعمدة والعناصر. يُحدَّد عدد الصفوف على العناصر مقسومًا على الأعمدة. تحتوي شبكة تحتوي على 10 عناصر وعمودين على 5 صفوف. تحتوي شبكة تحتوي على 11 عنصرًا وعمودين على 6 صفوف.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
على سبيل المثال، ينشئ ملف JSON التالي شبكة من عمودَين مع عنصر واحد:
"grid": {
"title": "A fine collection of items",
"columnCount": 2,
"borderStyle": {
"type": "STROKE",
"cornerRadius": 4
},
"items": [
{
"image": {
"imageUri": "https://www.example.com/image.png",
"cropStyle": {
"type": "SQUARE"
},
"borderStyle": {
"type": "STROKE"
}
},
"title": "An item",
"textAlignment": "CENTER"
}
],
"onClick": {
"openLink": {
"url": "https://www.example.com"
}
}
}
تمثيل JSON |
---|
{ "title": string, "items": [ { object ( |
الحقول | |
---|---|
title
|
النص الذي يتم عرضه في عنوان الشبكة. |
items[]
|
العناصر التي سيتم عرضها في الشبكة. |
borderStyle
|
نمط الحد المراد تطبيقه على كل عنصر في الشبكة. |
columnCount
|
عدد الأعمدة المطلوب عرضها في الشبكة. ويتم استخدام قيمة تلقائية إذا لم يتم تحديد هذا الحقل، وتختلف هذه القيمة التلقائية حسب المكان الذي تظهر فيه الشبكة (مربع الحوار مقابل مصاحب). |
onClick
|
وتتم إعادة استخدام عملية معاودة الاتصال هذه من قِبل كل عنصر فردي في الشبكة، ولكن مع إضافة معرّف السلعة والفهرس في قائمة السلع التي تتم إضافتها إلى مَعلمات طلب الاتصال. |
GridItem
تمثل عنصرًا في تخطيط الشبكة. ويمكن أن تحتوي العناصر على نص أو صورة أو نص وصورة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "id": string, "image": { object ( |
الحقول | |
---|---|
id
|
معرّف يحدده المستخدم لعنصر الشبكة هذا. ويتم عرض هذا المعرّف في معلمات معاودة الاتصال
|
image
|
الصورة التي يتم عرضها في عنصر الشبكة. |
title
|
عنوان عنصر الشبكة. |
subtitle
|
العنوان الفرعي لعنصر الشبكة. |
layout
|
التخطيط المراد استخدامه لعنصر الشبكة. |
ImageComponent
يمثل صورة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "imageUri": string, "altText": string, "cropStyle": { object ( |
الحقول | |
---|---|
imageUri
|
عنوان URL للصورة |
altText
|
تصنيف تسهيل الاستخدام للصورة |
cropStyle
|
نمط الاقتصاص المراد تطبيقه على الصورة. |
borderStyle
|
نمط الحد المراد تطبيقه على الصورة. |
ImageCropStyle
يمثل نمط الاقتصاص المطبّق على صورة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
على سبيل المثال، إليك كيفية تطبيق نسبة عرض إلى ارتفاع تبلغ 16:9:
cropStyle {
"type": "RECTANGLE_CUSTOM",
"aspectRatio": 16/9
}
تمثيل JSON |
---|
{
"type": enum (
|
الحقول | |
---|---|
type
|
نوع الاقتصاص |
aspectRatio
|
نسبة العرض إلى الارتفاع المطلوب استخدامها إذا كان نوع الاقتصاص هو على سبيل المثال، إليك كيفية تطبيق نسبة عرض إلى ارتفاع تبلغ 16:9:
|
ImageCropType
يمثل نمط الاقتصاص المطبّق على صورة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
IMAGE_CROP_TYPE_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
SQUARE
|
القيمة التلقائية. لتطبيق اقتصاص مربّع. |
CIRCLE
|
لتطبيق اقتصاص دائري. |
RECTANGLE_CUSTOM
|
يتم اقتصاصها كمستطيل بنسبة عرض إلى ارتفاع مخصّصة. اضبط نسبة العرض إلى الارتفاع المخصّصة باستخدام
aspectRatio .
|
RECTANGLE_4_3
|
يتم اقتصاصها كمستطيل بنسبة عرض إلى ارتفاع تبلغ 4:3. |
BorderStyle
خيارات النمط لحدود البطاقة أو التطبيق المصغّر، بما في ذلك نوع الحد ولونه
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
تمثيل JSON |
---|
{ "type": enum ( |
الحقول | |
---|---|
type
|
نوع الحد |
strokeColor
|
الألوان المطلوب استخدامها عندما يكون النوع
|
cornerRadius
|
نصف قطر الزاوية للحدود. |
BorderType
يمثل أنواع الحدود المطبّقة على التطبيقات المصغّرة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
BORDER_TYPE_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
NO_BORDER
|
القيمة التلقائية. بلا حدود |
STROKE
|
مخطط. |
GridItemLayout
تمثل خيارات التنسيق المختلفة المتاحة لعنصر شبكة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
GRID_ITEM_LAYOUT_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
TEXT_BELOW
|
يتم عرض العنوان والعنوان الفرعي أسفل صورة عنصر الشبكة. |
TEXT_ABOVE
|
يظهر العنوان والعنوان الفرعي أعلى صورة عنصر الشبكة. |
الأعمدة
يعرض تطبيق Columns
المصغّر ما يصل إلى عمودَين في بطاقة أو مربّع حوار. يمكنك إضافة أدوات إلى كل عمود؛ تظهر التطبيقات المصغّرة بالترتيب الذي يتم تحديدها. للحصول على مثال عن تطبيقات Google Chat، راجِع المقالة
عرض البطاقات ومربّعات الحوار في الأعمدة.
يتم تحديد ارتفاع كل عمود من خلال العمود الأطول. على سبيل المثال، إذا كان العمود الأول أطول من العمود الثاني، يكون ارتفاع العمود الأول لكلا العمودين. ولأن كل عمود يمكن أن يحتوي على عدد مختلف من التطبيقات المصغّرة، لا يمكنك تحديد الصفوف أو محاذاة التطبيقات المصغّرة بين الأعمدة.
الأعمدة معروضة جنبًا إلى جنب. ويمكنك تخصيص عرض كل عمود باستخدام
الحقل HorizontalSizeStyle
. إذا كان عرض شاشة المستخدم ضيقًا جدًا، يلتف العمود الثاني أسفل العمود الأول:
- على الويب، يلتف العمود الثاني إذا كان عرض الشاشة أقل من أو يساوي 480 بكسل.
- على أجهزة iOS، يلتف العمود الثاني إذا كان عرض الشاشة أقل من أو يساوي 300 نقطة.
- على أجهزة Android، يلتف العمود الثاني إذا كان عرض الشاشة أقل من أو يساوي 320 وحدة بكسل مستقلة الكثافة.
لتضمين أكثر من عمودَين أو لاستخدام صفوف، استخدِم
تطبيق
المصغّر.
Grid
متاحة لتطبيقات Google Chat وإضافات Google Workspace. الأعمدة الخاصة بإضافات Google Workspace في "معاينة المطوِّر".
تمثيل JSON |
---|
{
"columnItems": [
{
object (
|
الحقول | |
---|---|
columnItems[]
|
صفيف من الأعمدة. ويمكنك تضمين ما يصل إلى عمودَين في بطاقة أو مربّع حوار. |
العمود
عمود.
متاحة لتطبيقات Google Chat وإضافات Google Workspace. الأعمدة الخاصة بإضافات Google Workspace في "معاينة المطوِّر".
تمثيل JSON |
---|
{ "horizontalSizeStyle": enum ( |
الحقول | |
---|---|
horizontalSizeStyle
|
تحدِّد هذه السمة آلية ملء العمود لعرض البطاقة. |
horizontalAlignment
|
تحدِّد هذه السياسة ما إذا كانت التطبيقات المصغّرة تتم محاذاتها إلى يسار العمود أو يمينه أو في منتصفه. |
verticalAlignment
|
تحدِّد ما إذا كانت التطبيقات المصغّرة تتم محاذاتها إلى أعلى العمود أو أسفله أو في وسطه. |
widgets[]
|
مصفوفة من التطبيقات المصغّرة المضمّنة في عمود تظهر التطبيقات المصغّرة بالترتيب الذي تم تحديدها به. |
HorizontalSizeStyle
تحدِّد هذه السمة آلية ملء العمود لعرض البطاقة. ويعتمد عرض كل عمود على كلٍّ من
HorizontalSizeStyle
وعرض التطبيقات المصغّرة ضمن العمود.
متاحة لتطبيقات Google Chat وإضافات Google Workspace. الأعمدة الخاصة بإضافات Google Workspace في "معاينة المطوِّر".
عمليات التعداد | |
---|---|
HORIZONTAL_SIZE_STYLE_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
FILL_AVAILABLE_SPACE
|
القيمة التلقائية. يملأ العمود المساحة المتاحة بما يصل إلى 70% من عرض البطاقة. في حال ضبط كلا العمودَين على
FILL_AVAILABLE_SPACE ، يملأ كل عمود% 50 من المساحة.
|
FILL_MINIMUM_SPACE
|
يملأ العمود أقل مساحة ممكنة ولا تزيد عن 30% من عرض البطاقة. |
HorizontalAlignment
تحدِّد هذه السياسة ما إذا كانت التطبيقات المصغّرة تتم محاذاتها إلى يسار العمود أو يمينه أو في منتصفه.
متاحة لتطبيقات Google Chat ولا تتوفّر في "إضافات Google Workspace".
عمليات التعداد | |
---|---|
HORIZONTAL_ALIGNMENT_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
START
|
القيمة التلقائية. محاذاة التطبيقات المصغّرة مع موضع بداية العمود بالنسبة إلى التخطيطات من اليسار إلى اليمين، تتم محاذاة إلى اليسار. بالنسبة إلى التخطيطات من اليمين إلى اليسار، تتم محاذاة إلى اليمين. |
CENTER
|
لمحاذاة التطبيقات المصغّرة مع منتصف العمود. |
END
|
محاذاة التطبيقات المصغّرة مع موضع نهاية العمود بالنسبة إلى التنسيقات من اليسار إلى اليمين، تتم محاذاة التطبيقات المصغّرة إلى اليمين. بالنسبة إلى التنسيقات من اليمين إلى اليسار، تتم محاذاة التطبيقات المصغّرة إلى اليسار. |
VerticalAlignment
تحدِّد ما إذا كانت التطبيقات المصغّرة تتم محاذاتها إلى أعلى العمود أو أسفله أو في وسطه.
متاحة لتطبيقات Google Chat وإضافات Google Workspace. الأعمدة الخاصة بإضافات Google Workspace في "معاينة المطوِّر".
عمليات التعداد | |
---|---|
VERTICAL_ALIGNMENT_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
CENTER
|
القيمة التلقائية. لمحاذاة التطبيقات المصغّرة إلى منتصف العمود. |
TOP
|
لمحاذاة التطبيقات المصغّرة إلى أعلى العمود. |
BOTTOM
|
لمحاذاة التطبيقات المصغّرة إلى أسفل العمود. |
التطبيقات المصغَّرة
التطبيقات المصغّرة المتوافقة التي يمكنك تضمينها في عمود
متاحة لتطبيقات Google Chat وإضافات Google Workspace. الأعمدة الخاصة بإضافات Google Workspace في "معاينة المطوِّر".
تمثيل JSON |
---|
{ // Union field |
الحقول | |
---|---|
حقل الاتحاد
يمكن أن تكون السمة |
|
textParagraph
|
التطبيق المصغّر |
image
|
التطبيق المصغّر |
decoratedText
|
التطبيق المصغّر |
buttonList
|
التطبيق المصغّر |
textInput
|
التطبيق المصغّر |
selectionInput
|
التطبيق المصغّر |
dateTimePicker
|
التطبيق المصغّر |
DividerStyle
نمط الفاصل في بطاقة. تُستخدم حاليًا فقط للفواصل بين أقسام البطاقة.
متاحة لتطبيقات Google Chat وإضافات Google Workspace.
عمليات التعداد | |
---|---|
DIVIDER_STYLE_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
SOLID_DIVIDER
|
الخيار التلقائي. اعرض فاصلاً ثابتًا بين الأقسام. |
NO_DIVIDER
|
وفي حال ضبطها، لن يتم عرض أي مُقسّم بين الأقسام. |
CardAction
إجراء البطاقة هو الإجراء المرتبط بالبطاقة. على سبيل المثال، قد تتضمّن بطاقة الفاتورة إجراءات مثل حذف الفاتورة أو الفاتورة عبر البريد الإلكتروني أو فتح الفاتورة في متصفّح.
متاحة لإضافات Google Workspace ولا تتوفّر لتطبيقات Google Chat.
تمثيل JSON |
---|
{
"actionLabel": string,
"onClick": {
object (
|
الحقول | |
---|---|
actionLabel
|
التصنيف الذي يظهر كعنصر في قائمة الإجراءات. |
onClick
|
الإجراء
|
DisplayStyle
تحدِّد إضافات Google Workspace كيفية عرض البطاقة.
متاحة لإضافات Google Workspace ولا تتوفّر لتطبيقات Google Chat.
عمليات التعداد | |
---|---|
DISPLAY_STYLE_UNSPECIFIED
|
يُرجى عدم استخدامها. غير محدد |
PEEK
|
يظهر عنوان البطاقة في أسفل الشريط الجانبي، ويغطي جزئيًا البطاقة العلوية الحالية من الحزمة. يؤدي النقر على العنوان إلى إظهار البطاقة في حزمة البطاقات. وفي حال عدم احتواء البطاقة على عنوان، يتم استخدام عنوان تم إنشاؤه بدلاً من ذلك. |
REPLACE
|
القيمة التلقائية. يتم عرض هذه البطاقة من خلال استبدال عرض البطاقة العلوية في حزمة البطاقات. |