এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

একটি ধাপের জন্য একটি কনফিগারেশন কার্ড তৈরি করুন

এই নির্দেশিকাটি ব্যাখ্যা করে যে কীভাবে একটি কনফিগারেশন কার্ড তৈরি করতে হয় যা ব্যবহারকারীদের Google Workspace Studio-এর একটি ধাপের জন্য কাস্টমাইজ করতে এবং ইনপুট প্রদান করতে দেয়।

সাধারণভাবে, একটি কনফিগারেশন কার্ড তৈরি করতে, আপনাকে অন্য যেকোনো Google Workspace অ্যাড-অনের মতো একটি কার্ড ইন্টারফেস তৈরি করতে হবে। কনফিগারেশন কার্ড ইন্টারফেস তৈরিতে সহায়তার জন্য, নিম্নলিখিতগুলি দেখুন:

কার্ড বিল্ডার , একটি ইন্টারেক্টিভ টুল যা আপনাকে কার্ড তৈরি এবং সংজ্ঞায়িত করতে সাহায্য করে।
Google Workspace অ্যাড-অন API রেফারেন্স ডকুমেন্টেশনে কার্ড ।
কার্ড সার্ভিস , একটি অ্যাপস স্ক্রিপ্ট পরিষেবা যা স্ক্রিপ্টগুলিকে কার্ড কনফিগার এবং তৈরি করতে দেয়।
গুগল ওয়ার্কস্পেস অ্যাড-অন ডেভেলপার ডকুমেন্টেশনে কার্ড-ভিত্তিক ইন্টারফেস ।

কিছু কার্ড উইজেটে বিশেষ ওয়ার্কস্পেস স্টুডিও-নির্দিষ্ট কার্যকারিতা এবং বৈশিষ্ট্য রয়েছে, যা এই নির্দেশিকায় বিস্তারিতভাবে বর্ণনা করা হয়েছে।

একটি কনফিগারেশন কার্ড নির্ধারণ করুন

অ্যাপস স্ক্রিপ্ট ম্যানিফেস্ট এবং কোড উভয় ক্ষেত্রেই একটি কনফিগারেশন কার্ড সংজ্ঞায়িত করুন।

নিম্নলিখিত উদাহরণে দেখানো হয়েছে কিভাবে একটি কনফিগারেশন কার্ড তৈরি করতে হয় যা ব্যবহারকারীদের একটি Google Chat স্পেস নির্বাচন করতে বলে।

ম্যানিফেস্ট ফাইলটি সম্পাদনা করুন

ম্যানিফেস্ট ফাইলে, workflowElements সংজ্ঞায়িত করুন।

JSON সম্পর্কে

{
  "timeZone": "America/Los_Angeles",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "addOns": {
    "common": {
      "name": "Chat space selector",
      "logoUrl": "https://www.gstatic.com/images/branding/productlogos/gsuite_addons/v6/web-24dp/logo_gsuite_addons_color_1x_web_24dp.png",
      "useLocaleFromApp": true
    },
    "flows": {
      "workflowElements": [
        {
          "id": "actionElement",
          "state": "ACTIVE",
          "name": "Chat space selector",
          "description": "Lets the user select a space from Google  Chat",
          "workflowAction": {
            "inputs": [
              {
                "id": "chooseSpace",
                "description": "Choose a Chat space",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "STRING"
                }
              }
            ],
            "onConfigFunction": "onConfigSpacePicker",
            "onExecuteFunction": "onExecuteSpacePicker"
          }
        }
      ]
    }
  }
}

কোডটি সম্পাদনা করুন

অ্যাপ্লিকেশন কোডে, একটি কার্ড ফেরত দিন।

অ্যাপস স্ক্রিপ্ট

/**
 * Generates and displays a configuration card to choose a Chat space
 */
function onConfigSpacePicker() {

  const selectionInput = CardService.newSelectionInput()
    .setTitle("First Value")
    .setFieldName("chooseSpace")
    .setType(CardService.SelectionInputType.MULTI_SELECT)
    .setPlatformDataSource(
      CardService.newPlatformDataSource()
        .setHostAppDataSource(
          CardService.newHostAppDataSource()
            .setWorkflowDataSource(
              CardService.newWorkflowDataSource()
                .setIncludeVariables(true)
                .setType(CardService.WorkflowDataSourceType.SPACE)
            )
        )
    );

  const cardSection = CardService.newCardSection()
    .setHeader("Select Chat Space")
    .setId("section_1")
    .addWidget(selectionInput)

  var card = CardService.newCardBuilder()
    .addSection(cardSection)
    .build();

  return card;
}

function onExecuteSpacePicker(e) {
}

ইনপুট উইজেটের জন্য স্বয়ংসম্পূর্ণ সেট আপ করুন

ব্যবহারকারীদের বিকল্পগুলির তালিকা থেকে নির্বাচন করতে সাহায্য করার জন্য আপনি SelectionInput উইজেটের জন্য স্বয়ংক্রিয়ভাবে সম্পূর্ণ কনফিগার করতে পারেন। উদাহরণস্বরূপ, যদি কোনও ব্যবহারকারী মার্কিন যুক্তরাষ্ট্রের শহরগুলিকে পূর্ণ করে এমন একটি মেনুতে Atl টাইপ করা শুরু করেন, তাহলে ব্যবহারকারী টাইপ করা শেষ করার আগেই আপনার উপাদানটি Atlanta স্বয়ংক্রিয়ভাবে প্রস্তাব করতে পারে। আপনি ১০০টি পর্যন্ত আইটেম স্বয়ংক্রিয়ভাবে সম্পূর্ণ করতে পারেন।

স্বয়ংক্রিয়ভাবে সম্পূর্ণ করার পরামর্শ নিম্নলিখিত ডেটা উৎস থেকে আসতে পারে:

সার্ভার-সাইড অটোকম্পলিট: আপনার সংজ্ঞায়িত কোনও তৃতীয় পক্ষ বা বহিরাগত ডেটা উৎস থেকে পরামর্শগুলি পূরণ করা হয়।
Google Workspace ডেটা: Google Workspace ব্যবহারকারী বা Google Chat স্পেসের মতো Google Workspace উৎস থেকে পরামর্শগুলি পূরণ করা হয়।

সার্ভার-সাইড স্বয়ংসম্পূর্ণ

আপনি একটি SelectionInput উইজেট কনফিগার করতে পারেন যাতে একটি বহিরাগত ডেটা উৎস থেকে পরামর্শগুলি স্বয়ংক্রিয়ভাবে পূরণ করা যায়। উদাহরণস্বরূপ, আপনি ব্যবহারকারীদের একটি গ্রাহক সম্পর্ক ব্যবস্থাপনা (CRM) সিস্টেম থেকে বিক্রয় লিডের তালিকা থেকে নির্বাচন করতে সাহায্য করতে পারেন।

সার্ভার-সাইড অটোকম্পলিট বাস্তবায়ন করতে, আপনাকে যা করতে হবে:

ডেটা সোর্স নির্ধারণ করুন: SelectionInput উইজেটে, একটি DataSourceConfig যোগ করুন যা একটি RemoteDataSource নির্দিষ্ট করে। এই কনফিগারেশনটি একটি Apps Script ফাংশনকে নির্দেশ করে যা স্বয়ংক্রিয়ভাবে সম্পূর্ণ করার পরামর্শ নিয়ে আসে।
অটোকম্পলিট ফাংশনটি বাস্তবায়ন করুন: ব্যবহারকারী যখন ইনপুট ফিল্ডে টাইপ করেন তখন এই ফাংশনটি ট্রিগার হয়। ফাংশনটি ব্যবহারকারীর ইনপুটের উপর ভিত্তি করে আপনার বাহ্যিক ডেটা উৎসকে জিজ্ঞাসা করবে এবং পরামর্শের একটি তালিকা প্রদান করবে।

সার্ভার-সাইড অটোকম্পলিটের জন্য SelectionInput উইজেট কীভাবে কনফিগার করতে হয় তা নিচের উদাহরণে দেখানো হয়েছে:

অ্যাপস স্ক্রিপ্ট

// In your onConfig function:
var multiSelect1 =
  CardService.newSelectionInput()
    .setFieldName("value1")
    .setTitle("Server Autocomplete")
    .setType(CardService.SelectionInputType.MULTI_SELECT)
    .setMultiSelectMaxSelectedItems(3)
    .addDataSourceConfig(
      CardService.newDataSourceConfig()
        .setRemoteDataSource(
          CardService.newAction().setFunctionName('getAutocompleteResults')
        )
    )
    .addDataSourceConfig(
      CardService.newDataSourceConfig()
        .setPlatformDataSource(
          CardService.newPlatformDataSource()
            .setHostAppDataSource(
              CardService.newHostAppDataSource()
                .setWorkflowDataSource(
                  CardService.newWorkflowDataSource()
                    .setIncludeVariables(true)
                ))
        )
    );

// ... add widget to card ...

স্বয়ংক্রিয়ভাবে সম্পন্ন হওয়ার অনুরোধটি পরিচালনা করুন

setFunctionName (যেমন, getAutocompleteResults ) তে উল্লেখিত ফাংশনটি ব্যবহারকারী যখন ফিল্ডে টাইপ করে তখন একটি ইভেন্ট অবজেক্ট গ্রহণ করে। এই ফাংশনটি অবশ্যই:

event.workflow.elementUiAutocomplete.invokedFunction টি প্রত্যাশিত ফাংশন নামের সাথে মিলেছে কিনা তা পরীক্ষা করে দেখুন।
ব্যবহারকারীর ইনপুট event.workflow.elementUiAutocomplete.query থেকে পান।
কোয়েরি ব্যবহার করে বাহ্যিক ডেটা উৎস অনুসন্ধান করুন।
প্রয়োজনীয় ফরম্যাটে সর্বাধিক ১০০টি পরামর্শ ফেরত পাঠান।

নিম্নলিখিত উদাহরণে ব্যবহারকারীর প্রশ্নের উপর ভিত্তি করে পরামর্শ ফেরত দেওয়ার জন্য handleAutocompleteRequest() ফাংশনটি কীভাবে বাস্তবায়ন করতে হয় তা দেখানো হয়েছে:

অ্যাপস স্ক্রিপ্ট

function handleAutocompleteRequest(event) {
  var invokedFunction = event.workflow.elementUiAutocomplete.invokedFunction;
  var query = event.workflow.elementUiAutocomplete.query;

  if (invokedFunction != "getAutocompleteResults" || query == undefined || query == "") {
    return {};
  }

  // Query your data source to get results based on the query
  let autocompleteResponse = AddOnsResponseService.newUpdateWidget()
    .addSuggestion(
      query + " option 1",
      query + "_option1",
      false,
      "https://developers.google.com/workspace/add-ons/images/person-icon.png",
      "option 1 bottom text"
    )
    .addSuggestion(
      query + " option 2",
      query + "_option2",
      false,
      "https://developers.google.com/workspace/add-ons/images/person-icon.png",
      "option 2 bottom text"
    ).addSuggestion(
      query + " option 3",
      query + "_option3",
      false,
      "https://developers.google.com/workspace/add-ons/images/person-icon.png",
      "option 3 bottom text"
    );

  const modifyAction = AddOnsResponseService.newAction()
    .addModifyCard(
      AddOnsResponseService.newModifyCard()
        .setUpdateWidget(autocompleteResponse)
    );

  return AddOnsResponseService.newRenderActionBuilder()
    .setAction(modifyAction)
    .build();
}

// In your onConfig function, handle the autocomplete event
function onConfigAutocompleteTest(event) {
  // Handle autocomplete request
  if (event.workflow && event.workflow.elementUiAutocomplete) {
    return handleAutocompleteRequest(event);
  }

  // ... rest of your card building logic ...
}

Google Workspace ডেটা অটোমেটিক পূরণ করা

আপনি ব্যবহারকারীর Google Workspace পরিবেশের মধ্যে থাকা ডেটা থেকে অটোকম্পলিট পরামর্শগুলিও পূরণ করতে পারেন:

Google Workspace ব্যবহারকারী: একই Google Workspace প্রতিষ্ঠানের মধ্যে ব্যবহারকারীদের নিয়োগ করুন।
গুগল চ্যাট স্পেস: ব্যবহারকারী যে গুগল চ্যাট স্পেসের সদস্য, সেগুলি পূরণ করুন।

এটি কনফিগার করার জন্য, SelectionInput উইজেটে PlatformDataSource সেট করুন, WorkflowDataSourceType কে USER অথবা SPACE হিসেবে উল্লেখ করুন।

অ্যাপস স্ক্রিপ্ট

// User Autocomplete
var multiSelect2 =
  CardService.newSelectionInput()
    .setFieldName("value2")
    .setTitle("User Autocomplete")
    .setType(CardService.SelectionInputType.MULTI_SELECT)
    .setMultiSelectMaxSelectedItems(3)
    .setPlatformDataSource(
      CardService.newPlatformDataSource()
        .setHostAppDataSource(
          CardService.newHostAppDataSource()
            .setWorkflowDataSource(
              CardService.newWorkflowDataSource()
                .setIncludeVariables(true)
                .setType(CardService.WorkflowDataSourceType.USER)
            ))
    );

// Chat Space Autocomplete
var multiSelect3 =
  CardService.newSelectionInput()
    .setFieldName("value3")
    .setTitle("Chat Space Autocomplete")
    .setType(CardService.SelectionInputType.MULTI_SELECT)
    .setMultiSelectMaxSelectedItems(3)
    .setPlatformDataSource(
      CardService.newPlatformDataSource()
        .setHostAppDataSource(
          CardService.newHostAppDataSource()
            .setWorkflowDataSource(
              CardService.newWorkflowDataSource()
                .setIncludeVariables(true)
                .setType(CardService.WorkflowDataSourceType.SPACE)
            ))
    );

উদাহরণ: স্বয়ংক্রিয়ভাবে সম্পূর্ণ হওয়ার ধরণ একত্রিত করা

নিচের উদাহরণে একটি onConfig ফাংশন দেখানো হয়েছে যা তিনটি SelectionInput উইজেট সহ একটি কার্ড তৈরি করে, যা সার্ভার-সাইড, ব্যবহারকারী এবং স্পেস অটোকম্পলিট প্রদর্শন করে:

JSON সম্পর্কে

{
  "timeZone": "America/Los_Angeles",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "addOns": {
    "common": {
      "name": "Autocomplete Demo",
      "logoUrl": "https://www.gstatic.com/images/icons/material/system/1x/pets_black_48dp.png",
      "useLocaleFromApp": true
    },
    "flows": {
      "workflowElements": [
        {
          "id": "autocomplete_demo",
          "state": "ACTIVE",
          "name": "Autocomplete Demo",
          "description": "Provide autocompletion in input fields",
          "workflowAction": {
            "inputs": [
              {
                "id": "value1",
                "description": "A multi-select field with autocompletion",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "STRING"
                }
              }
            ],
            "onConfigFunction": "onConfigAutocomplete",
            "onExecuteFunction": "onExecuteAutocomplete"
          }
        }
      ]
    }
  }
}

অ্যাপস স্ক্রিপ্ট

function onConfigAutocompleteTest(event) {
  // Handle autocomplete request
  if (event.workflow && event.workflow.elementUiAutocomplete) {
    return handleAutocompleteRequest(event);
  }

  // Server-side autocomplete widget
  var multiSelect1 =
    CardService.newSelectionInput()
      .setFieldName("value1")
      .setTitle("Server Autocomplete")
      .setType(CardService.SelectionInputType.MULTI_SELECT)
      .setMultiSelectMaxSelectedItems(3)
      .addDataSourceConfig(
        CardService.newDataSourceConfig()
          .setRemoteDataSource(
            CardService.newAction().setFunctionName('getAutocompleteResults')
          )
      )
      .addDataSourceConfig(
        CardService.newDataSourceConfig()
          .setPlatformDataSource(
            CardService.newPlatformDataSource()
              .setHostAppDataSource(
                CardService.newHostAppDataSource()
                  .setWorkflowDataSource(
                    CardService.newWorkflowDataSource()
                      .setIncludeVariables(true)
                  ))
          )
      );

  // User autocomplete widget
  var multiSelect2 =
    CardService.newSelectionInput()
      .setFieldName("value2")
      .setTitle("User Autocomplete")
      .setType(CardService.SelectionInputType.MULTI_SELECT)
      .setMultiSelectMaxSelectedItems(3)
      .setPlatformDataSource(
        CardService.newPlatformDataSource()
          .setHostAppDataSource(
            CardService.newHostAppDataSource()
              .setWorkflowDataSource(
                CardService.newWorkflowDataSource()
                  .setIncludeVariables(true)
                  .setType(CardService.WorkflowDataSourceType.USER)
              ))
      );

  // Space autocomplete widget
  var multiSelect3 =
    CardService.newSelectionInput()
      .setFieldName("value3")
      .setTitle("Chat Space Autocomplete")
      .setType(CardService.SelectionInputType.MULTI_SELECT)
      .setMultiSelectMaxSelectedItems(3)
      .setPlatformDataSource(
        CardService.newPlatformDataSource()
          .setHostAppDataSource(
            CardService.newHostAppDataSource()
              .setWorkflowDataSource(
                CardService.newWorkflowDataSource()
                  .setIncludeVariables(true)
                  .setType(CardService.WorkflowDataSourceType.SPACE)
              ))
      );

  var sectionBuilder =
    CardService.newCardSection()
      .addWidget(multiSelect1)
      .addWidget(multiSelect2)
      .addWidget(multiSelect3);

  var card =
    CardService.newCardBuilder()
      .addSection(sectionBuilder)
      .build();
  return card;
}

function handleAutocompleteRequest(event) {
  var invokedFunction = event.workflow.elementUiAutocomplete.invokedFunction;
  var query = event.workflow.elementUiAutocomplete.query;

  if (invokedFunction != "getAutocompleteResults" || query == undefined || query == "") {
    return {};
  }

  // Query your data source to get results
  let autocompleteResponse = AddOnsResponseService.newUpdateWidget()
    .addSuggestion(
      query + " option 1",
      query + "_option1",
      false,
      "https://developers.google.com/workspace/add-ons/images/person-icon.png",
      "option 1 bottom text"
    )
    .addSuggestion(
      query + " option 2",
      query + "_option2",
      false,
      "https://developers.google.com/workspace/add-ons/images/person-icon.png",
      "option 2 bottom text"
    ).addSuggestion(
      query + " option 3",
      query + "_option3",
      false,
      "https://developers.google.com/workspace/add-ons/images/person-icon.png",
      "option 3 bottom text"
    );

  const modifyAction = AddOnsResponseService.newAction()
    .addModifyCard(
      AddOnsResponseService.newModifyCard()
        .setUpdateWidget(autocompleteResponse)
    );

  return AddOnsResponseService.newRenderActionBuilder()
    .setAction(modifyAction)
    .build();
}

ভেরিয়েবল পিকার বোতামগুলি কাস্টমাইজ করুন

আপনি বোতামের আকার এবং লেবেল সেট করে ভেরিয়েবল পিকার বোতামটি কাস্টমাইজ করতে পারেন।

বোতামের আকার

বোতামের আকার নির্ধারণ করতে, নিম্নলিখিত VariableButtonSize এনামগুলির একটি দিয়ে setVariableButtonSize() ব্যবহার করুন:

UNSPECIFIED : ডিফল্ট। পাশের প্যানেলে বোতামটি ছোট এবং অন্যান্য প্রসঙ্গে পূর্ণ আকারের।
COMPACT : বোতামটি শুধুমাত্র একটি যোগ চিহ্ন (+) প্রদর্শন করে।
FULL_SIZE : বোতামটি সম্পূর্ণ টেক্সট লেবেল প্রদর্শন করে।

বোতাম লেবেল

বোতামের টেক্সট সেট করতে, setVariableButtonLabel() ব্যবহার করুন।

উদাহরণ: ভেরিয়েবল পিকার কাস্টমাইজেশন

নিম্নলিখিত উদাহরণে দেখানো হয়েছে কিভাবে বিভিন্ন ভেরিয়েবল পিকার বোতামের আকার এবং একটি কাস্টম লেবেল সহ TextInput উইজেট কনফিগার করতে হয়।

চিত্র ১: ওয়েবে পরিবর্তনশীল পিকার বোতাম কাস্টমাইজেশন।
চিত্র ২: একটি অ্যাড-অন সাইড প্যানেলে পরিবর্তনশীল পিকার বোতাম কাস্টমাইজেশন।

ভেরিয়েবল পিকার বোতাম কাস্টমাইজ করার জন্য ম্যানিফেস্ট ফাইলটি এখানে:

JSON সম্পর্কে

{
  "timeZone": "America/Los_Angeles",
  "dependencies": {},
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "oauthScopes": [
    "https://www.googleapis.com/auth/script.locale"
  ],
  "addOns": {
    "common": {
      "name": "Variable button customization",
      "logoUrl": "https://www.gstatic.com/images/icons/material/system/1x/pets_black_48dp.png",
      "useLocaleFromApp": true
    },
    "flows": {
      "workflowElements": [
        {
          "id": "variable_picker_customization",
          "state": "ACTIVE",
          "name": "Variable Picker demo",
          "description": "List all possible variable picker customization options",
          "workflowAction": {
            "onConfigFunction": "onUpdateCardConfigFunction",
            "onExecuteFunction": "onUpdateCardExecuteFunction"
          }
        }
      ]
    }
  }
}

ভেরিয়েবল পিকার বোতাম কাস্টমাইজ করার কোডটি এখানে দেওয়া হল:

অ্যাপস স্ক্রিপ্ট

function onUpdateCardConfigFunction(event) {
  const textInput1 = CardService.newTextInput()
    .setFieldName("value1")
    .setTitle("Regular variable picker button")
    .setHostAppDataSource(
      CardService.newHostAppDataSource().setWorkflowDataSource(
        CardService.newWorkflowDataSource()
          .setIncludeVariables(true)
          .setVariableButtonSize(CardService.VariableButtonSize.UNSPECIFIED)
      )
    );

  const textInput2 = CardService.newTextInput()
    .setFieldName("value2")
    .setTitle("Size: Unspecified")
    .setHostAppDataSource(
      CardService.newHostAppDataSource().setWorkflowDataSource(
        CardService.newWorkflowDataSource()
          .setIncludeVariables(true)
          .setVariableButtonSize(CardService.VariableButtonSize.UNSPECIFIED)
      )
    );

  const textInput3 = CardService.newTextInput()
    .setFieldName("value3")
    .setTitle("Size: Full size")
    .setHostAppDataSource(
      CardService.newHostAppDataSource().setWorkflowDataSource(
        CardService.newWorkflowDataSource()
          .setIncludeVariables(true)
          .setVariableButtonSize(CardService.VariableButtonSize.FULL_SIZE)
      )
    );

  const textInput4 = CardService.newTextInput()
    .setFieldName("value4")
    .setTitle("Size: Compact")
    .setHostAppDataSource(
      CardService.newHostAppDataSource().setWorkflowDataSource(
        CardService.newWorkflowDataSource()
          .setIncludeVariables(true)
          .setVariableButtonSize(CardService.VariableButtonSize.COMPACT)
      )
    );

  const textInput5 = CardService.newTextInput()
    .setFieldName("value5")
    .setTitle("Custom button label")
    .setHostAppDataSource(
      CardService.newHostAppDataSource().setWorkflowDataSource(
        CardService.newWorkflowDataSource()
          .setIncludeVariables(true)
          .setVariableButtonLabel("New button label!")
      )
    );

  var cardSection = CardService.newCardSection()
    .addWidget(textInput1)
    .addWidget(textInput2)
    .addWidget(textInput3)
    .addWidget(textInput4)
    .addWidget(textInput5)
    .setId("section_1");

  var card = CardService.newCardBuilder().addSection(cardSection).build();

  return card;
}

function onUpdateCardExecuteFunction(event) {
}

ওয়ার্কস্পেস স্টুডিও-নির্দিষ্ট বৈশিষ্ট্য

কিছু কার্ড উইজেটে বিশেষ ওয়ার্কস্পেস স্টুডিও-নির্দিষ্ট কার্যকারিতা এবং বৈশিষ্ট্য রয়েছে, এখানে বিস্তারিত।

টেক্সটইনপুট এবং সিলেকশনইনপুট

TextInput এবং SelectionInput উইজেটগুলিতে এই ওয়ার্কস্পেস স্টুডিও-নির্দিষ্ট বৈশিষ্ট্যগুলি রয়েছে:

includeVariables : একটি বুলিয়ান প্রোপার্টি যা ব্যবহারকারীদের পূর্ববর্তী ধাপগুলি থেকে ভেরিয়েবল নির্বাচন করতে দেয়। পরবর্তী ধাপগুলিতে ভেরিয়েবল পিকার প্রদর্শনের জন্য, শুরুর ইভেন্ট এবং কমপক্ষে একটি সংশ্লিষ্ট আউটপুট ভেরিয়েবল উভয়কেই ভেরিয়েবলের সাথে ম্যাপ করতে হবে।
type : একটি গণনাকৃত মান যা পরামর্শগুলিকে স্বয়ংক্রিয়ভাবে সম্পূর্ণ করে। সমর্থিত মানগুলির মধ্যে রয়েছে:
- USER : ব্যবহারকারীর পরিচিতিতে থাকা ব্যক্তিদের জন্য স্বয়ংসম্পূর্ণ পরামর্শ প্রদান করে।
- SPACE : ব্যবহারকারী যে Google Chat স্পেসের সদস্য, তার জন্য স্বয়ংক্রিয়ভাবে সম্পূর্ণ করার পরামর্শ প্রদান করে।

যখন includeVariables এবং type উভয়ই সেট করা থাকে, তখন ইনপুট ক্ষেত্রটি তাদের অভিজ্ঞতাগুলিকে একত্রিত করে। ব্যবহারকারীরা ড্রপ-ডাউন মেনু থেকে মিলিত type একটি ভেরিয়েবল নির্বাচন করতে পারেন এবং এর জন্য স্বয়ংসম্পূর্ণ পরামর্শ দেখতে পারেন।

চিত্র ৩: একজন ব্যবহারকারী স্থান নির্বাচন করার সময় স্বয়ংসম্পূর্ণ পরামর্শ পর্যালোচনা করেন।
চিত্র ৪: একজন ব্যবহারকারী ➕ভেরিয়েবল ড্রপ-ডাউন থেকে পূর্ববর্তী ধাপের আউটপুট ভেরিয়েবল নির্বাচন করেন।

ওভারফ্লো মেনু সহ শুধুমাত্র একটি আউটপুট ভেরিয়েবল নির্বাচন করুন

আপনি একটি SelectionInput উইজেট কনফিগার করতে পারেন যাতে ব্যবহারকারীরা একটি ওভারফ্লো মেনু ব্যবহার করে পূর্ববর্তী ধাপ থেকে একটি একক আউটপুট ভেরিয়েবল নির্বাচন করতে পারেন।

যখন আপনি SelectionInputType OVERFLOW_MENU তে সেট করেন, তখন উইজেটটি একটি ডেডিকেটেড ভেরিয়েবল পিকার হিসেবে কাজ করে। TextInput এর সাথে includeVariables ব্যবহার করার বিপরীতে, যা ভেরিয়েবলের মানগুলিকে স্ট্রিংয়ে রূপান্তর করে, OVERFLOW_MENU নির্বাচিত ভেরিয়েবলের মূল ডেটা টাইপ সংরক্ষণ করে।

অ্যাপস স্ক্রিপ্ট

const selectionInput = CardService.newSelectionInput()
  .setFieldName("variable_picker_1")
  .setTitle("Variable Picker")
  .setType(
    CardService.SelectionInputType.OVERFLOW_MENU
  );

ব্যবহারকারীদের টেক্সট এবং আউটপুট ভেরিয়েবল একত্রিত করতে দিন

setInputMode() ব্যবহার করে ব্যবহারকারীরা টেক্সট এবং আউটপুট ভেরিয়েবলের সাথে কীভাবে ইন্টারঅ্যাক্ট করে তা নিয়ন্ত্রণ করতে আপনি TextInput উইজেটগুলি কনফিগার করতে পারেন।

RICH_TEXT : ব্যবহারকারীদের টেক্সট এবং আউটপুট ভেরিয়েবল একত্রিত করার অনুমতি দেয়। ফলাফল হল একটি একক সংযুক্ত স্ট্রিং।
PLAIN_TEXT : ইনপুট সীমাবদ্ধ করে। ব্যবহারকারীরা টেক্সট টাইপ করতে পারেন অথবা একটি একক আউটপুট ভেরিয়েবল নির্বাচন করতে পারেন। একটি ভেরিয়েবল নির্বাচন করলে বিদ্যমান যেকোনো টেক্সট প্রতিস্থাপন করা হয়। ম্যানিফেস্টে সংজ্ঞায়িত নির্দিষ্ট ডেটা টাইপ প্রয়োগ করতে এই মোডটি ব্যবহার করুন।

নিচের ছবিতে দুটি TextInput উইজেট দেখানো হয়েছে। প্রথমটি RICH_TEXT হিসেবে কনফিগার করা হয়েছে এবং এতে টেক্সট এবং একটি আউটপুট ভেরিয়েবল রয়েছে। দ্বিতীয়টি PLAIN_TEXT হিসেবে কনফিগার করা হয়েছে এবং শুধুমাত্র একটি আউটপুট ভেরিয়েবলের অনুমতি দেয়।

চিত্র ৫: টেক্সট ইনপুট উইজেটগুলি RICH_TEXT এবং PLAIN_TEXT হিসাবে কনফিগার করা হয়েছে।

আমরা আপনাকে সমস্ত TextInput উইজেটের জন্য স্পষ্টভাবে ইনপুট মোড সেট করার পরামর্শ দিচ্ছি।

বিভিন্ন ইনপুট মোড সহ TextInput উইজেট কনফিগার করার জন্য ম্যানিফেস্ট ফাইলটি এখানে দেওয়া হল:

JSON সম্পর্কে

{
  "timeZone": "America/Toronto",
  "dependencies": {},
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "addOns": {
    "common": {
      "name": "Text and output variable demo",
      "logoUrl": "https://www.gstatic.com/images/icons/material/system/1x/pets_black_48dp.png",
      "useLocaleFromApp": true
    },
    "flows": {
      "workflowElements": [
        {
          "id": "richTextDemo",
          "state": "ACTIVE",
          "name": "Rich Text Demo",
          "description": "Show the difference between rich text and plain text TextInput widgets",
          "workflowAction": {
            "inputs": [
              {
                "id": "value1",
                "description": "First user input",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "STRING"
                }
              },
              {
                "id": "value2",
                "description": "Second user input",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "STRING"
                }
              }
            ],
            "onConfigFunction": "onConfiguration",
            "onExecuteFunction": "onExecution"
          }
        }
      ]
    }
  }
}

বিভিন্ন ইনপুট মোড সহ TextInput উইজেট কনফিগার করার কোড এখানে দেওয়া হল:

অ্যাপস স্ক্রিপ্ট

function onConfiguration() {
  const input1 = CardService.newTextInput()
    .setFieldName("value1")
    .setId("value1")
    .setTitle("Rich Text")
    .setHostAppDataSource(
      CardService.newHostAppDataSource()
        .setWorkflowDataSource(
          CardService.newWorkflowDataSource()
            .setIncludeVariables(true)
        )
    )
    // Set input mode to RICH_TEXT to allow mixed text and variables.
    .setInputMode(CardService.TextInputMode.RICH_TEXT);

  const input2 = CardService.newTextInput()
    .setFieldName("value2")
    .setId("value2")
    .setTitle("Plain text")
    .setHostAppDataSource(
      CardService.newHostAppDataSource()
        .setWorkflowDataSource(
          CardService.newWorkflowDataSource()
            .setIncludeVariables(true)
        )
    )
    // Set input mode to PLAIN_TEXT to enforce single variable selection.
    .setInputMode(CardService.TextInputMode.PLAIN_TEXT);

  const section = CardService.newCardSection()
    .addWidget(input1)
    .addWidget(input2);

  const card = CardService.newCardBuilder()
    .addSection(section)
    .build();

  return card;
}

function onExecution(e) {
}

কার্ড বিবেচনা এবং সীমাবদ্ধতা

ওয়ার্কস্পেস স্টুডিও সম্প্রসারিত অ্যাড-অনগুলিতে popCard() , pushCard() , এবং updateCard() এর মতো কার্ড নেভিগেশন সমর্থিত নয়।
যখন SelectionInput একটি ভেরিয়েবল পিকারে ব্যবহার করা হয়, তখন উইজেটগুলি কেবল "type": "MULTI_SELECT" । কনফিগারেশন কার্ডের অন্য কোথাও, SelectionInput SelectionType এর সমস্ত মান সমর্থন করে।

একটি কনফিগারেশন কার্ড নির্ধারণ করুন

ম্যানিফেস্ট ফাইলটি সম্পাদনা করুন

JSON সম্পর্কে

কোডটি সম্পাদনা করুন

অ্যাপস স্ক্রিপ্ট

ইনপুট উইজেটের জন্য স্বয়ংসম্পূর্ণ সেট আপ করুন

সার্ভার-সাইড স্বয়ংসম্পূর্ণ

অ্যাপস স্ক্রিপ্ট

স্বয়ংক্রিয়ভাবে সম্পন্ন হওয়ার অনুরোধটি পরিচালনা করুন

অ্যাপস স্ক্রিপ্ট

Google Workspace ডেটা অটোমেটিক পূরণ করা

অ্যাপস স্ক্রিপ্ট

উদাহরণ: স্বয়ংক্রিয়ভাবে সম্পূর্ণ হওয়ার ধরণ একত্রিত করা

JSON সম্পর্কে

অ্যাপস স্ক্রিপ্ট

ভেরিয়েবল পিকার বোতামগুলি কাস্টমাইজ করুন

বোতামের আকার

বোতাম লেবেল

উদাহরণ: ভেরিয়েবল পিকার কাস্টমাইজেশন

JSON সম্পর্কে

অ্যাপস স্ক্রিপ্ট

ওয়ার্কস্পেস স্টুডিও-নির্দিষ্ট বৈশিষ্ট্য

টেক্সটইনপুট এবং সিলেকশনইনপুট

ওভারফ্লো মেনু সহ শুধুমাত্র একটি আউটপুট ভেরিয়েবল নির্বাচন করুন

অ্যাপস স্ক্রিপ্ট

ব্যবহারকারীদের টেক্সট এবং আউটপুট ভেরিয়েবল একত্রিত করতে দিন

JSON সম্পর্কে

অ্যাপস স্ক্রিপ্ট

কার্ড বিবেচনা এবং সীমাবদ্ধতা

সম্পর্কিত বিষয়