ভেরিয়েবল

ভেরিয়েবল একটি গুরুত্বপূর্ণ প্রোগ্রামিং ধারণা। ব্লক্লি পাইথন এবং জাভাস্ক্রিপ্টের মতো ডাইনামিক্যালি টাইপড ল্যাঙ্গুয়েজ সমর্থন করে এবং সামান্য অতিরিক্ত পরিশ্রমে জাভা বা সি-এর মতো স্ট্রংলি টাইপড ল্যাঙ্গুয়েজ (বা স্ট্যাটিক টাইপড ল্যাঙ্গুয়েজ) সমর্থন করার জন্য তথ্য যোগ করা যায়।

ডাইনামিক বনাম স্ট্যাটিক টাইপড ল্যাঙ্গুয়েজ সম্পর্কে আরও তথ্যের জন্য, “Introduction to Data Types: Static, Dynamic, Strong & Weak ” দেখুন।

ব্লকলি ভ্যারিয়েবল ফিল্ড সরবরাহ করে, যেগুলো হলো ডাইনামিক ড্রপডাউন বক্স এবং এগুলোতে ব্যবহারকারীর দেওয়া ভ্যারিয়েবলের নামগুলো প্রদর্শিত হয়। নিচে এর একটি উদাহরণ দেওয়া হলো।

একটি পরিবর্তনশীল ক্ষেত্র যেখানে একটি ভেরিয়েবল বাছাই করতে, বর্তমান ভেরিয়েবলের নাম পরিবর্তন করতে, অথবা বর্তমান ভেরিয়েবলটি মুছে ফেলতে একটি ড্রপডাউন রয়েছে।

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

একটি ভেরিয়েবলের টাইপ এবং এর ব্লকগুলো, যেমন গেটার ও সেটার, নির্দিষ্ট করুন ।
আপনার ভেরিয়েবল টাইপ এবং ব্লকগুলো ব্যবহার করার জন্য টুলবক্সটি কনফিগার করুন ।
ভেরিয়েবল এবং তাদের ব্লকগুলোর জন্য জেনারেটর সংজ্ঞায়িত করুন ।

টাইপবিহীন ভেরিয়েবল ব্লক

একটি ভেরিয়েবল অ্যাক্সেস এবং ম্যানিপুলেট করার জন্য সবচেয়ে মৌলিক ব্লকগুলো হলো গেটার এবং সেটার ব্লক। চলুন Blockly-এর দেওয়া গেটার এবং সেটার ব্লকগুলো সম্পর্কে জেনে নেওয়া যাক।

JSON

// Block for variable getter.
{
  "type": "variables_get",
  "message0": "%1",
  "args0": [
    {    // Beginning of the field variable dropdown
      "type": "field_variable",
      "name": "VAR",    // Static name of the field
      "variable": "%{BKY_VARIABLES_DEFAULT_NAME}"    // Given at runtime
    }    // End of the field variable dropdown
  ],
  "output": null,    // Null means the return value can be of any type
  ...
},

// Block for variable setter.
{
  "type": "variables_set",
  "message0": "%{BKY_VARIABLES_SET}",
  "args0": [
    {
      "type": "field_variable",
      "name": "VAR",
      "variable": "%{BKY_VARIABLES_DEFAULT_NAME}"
    },
    {
      "type": "input_value",    // This expects an input of any type
      "name": "VALUE"
    }
  ],
  ...
}

জাভাস্ক্রিপ্ট

// Block for variable getter.
Blockly.Blocks['variables_get'] = {
  init: function() {
    this.appendDummyInput()
      .appendField(new Blockly.FieldVariable("VAR_NAME"), "FIELD_NAME");
    this.setOutput(true, null);
    ...
  }
};

// Block for variable setter.
Blockly.Blocks['variables_set'] = {
  init: function() {
    this.appendValueInput("NAME")
        .setCheck(null)
        .appendField("set")
        .appendField(new Blockly.FieldVariable("VAR_NAME"), "FIELD_NAME")
        .appendField("to");
    this.setOutput(true, null);
    ...
  }
};

এর ফলে নিম্নলিখিত দুটি ব্লক তৈরি হয়:

`foo` ভেরিয়েবলের জন্য গেটার এবং সেটার ব্লক।

একটি গুরুত্বপূর্ণ বিষয় হলো, ভ্যারিয়েবল গেটারের 'আউটপুট' null সেট করার মাধ্যমে রিটার্ন ভ্যালুটি যেকোনো ধরনের হতে পারে। আরও লক্ষ্য করুন যে, ভ্যারিয়েবল সেটারের ইনপুটে কোনো চেকের উল্লেখ থাকে না। ফলে, ভ্যারিয়েবলটিকে যেকোনো ধরনের ভ্যালুতে সেট করা যায়।

টাইপ করা ভেরিয়েবল ব্লক

আপনি টাইপ চেকিং নিশ্চিত করে এমন গেটার এবং সেটার যোগ করতে পারেন। উদাহরণস্বরূপ, যদি আপনি "Panda" টাইপের একটি ভেরিয়েবল তৈরি করে থাকেন, তাহলে নিম্নলিখিত সংজ্ঞাগুলো উপযুক্ত টাইপসহ একটি গেটার এবং সেটার তৈরি করবে।

JSON

// Block for Panda variable getter.
{
  "type": "variables_get_panda",
  "message0": "%1",
  "args0": [
    {
      "type": "field_variable",
      "name": "VAR",
      "variable": "%{BKY_VARIABLES_DEFAULT_NAME}",
      "variableTypes": ["Panda"],    // Specifies what types to put in the dropdown
      "defaultType": "Panda"
    }
  ],
  "output": "Panda",    // Returns a value of "Panda"
  ...
},

 // Block for Panda variable setter.
{
  "type": "variables_set_panda",
  "message0": "%{BKY_VARIABLES_SET}",
  "args0": [
    {
      "type": "field_variable",
      "name": "VAR",
      "variable": "%{BKY_VARIABLES_DEFAULT_NAME}",
      "variableTypes": ["Panda"],
      "defaultType": "Panda"
    },
    {
      "type": "input_value",
      "name": "VALUE",
      "check": "Panda"    // Checks that the input value is of type "Panda"
    }
  ],
  "previousStatement": null,
  "nextStatement": null,
  ...
}

জাভাস্ক্রিপ্ট

// Block for Panda variable getter.
Blockly.Blocks['variables_get_panda'] = {
  init: function() {
    this.appendDummyInput()
      .appendField(new Blockly.FieldVariable(
          "VAR_NAME", ['Panda'], 'Panda'), "FIELD_NAME");
    this.setOutput(true, 'Panda');
    ...
  }
};

// Block for Panda variable setter.
Blockly.Blocks['variables_set_panda'] = {
  init: function() {
    this.appendValueInput("NAME")
        .setCheck('Panda')
        .appendField("set")
        .appendField(new Blockly.FieldVariable(
            "VAR_NAME", null, ['Panda'], 'Panda'), "FIELD_NAME")
        .appendField("to");
        this.setPreviousStatement(true, null);
        this.setNextStatement(true, null);
    ...
  }
};

এটি দুই ধরনের ব্লক তৈরি করে, একটি গেটার এবং একটি সেটার। এদের ড্রপডাউনগুলো শুধুমাত্র "Panda" টাইপের ভ্যারিয়েবল প্রদর্শন করে। এদের ইনপুট এবং আউটপুটগুলো শুধুমাত্র "Panda" টাইপের কানেকশন গ্রহণ করে। ফিল্ডটির defaultType অবশ্যই variableTypes অ্যারের মানগুলোর মধ্যে একটিতে সেট করতে হবে। variableTypes অ্যারে দেওয়ার সময় defaultType সেট না করলে একটি এরর প্রদর্শিত হবে।

ডিফল্টরূপে, ব্যবহারকারীকে কোন ধরনের ভেরিয়েবল ব্যবহার করা হচ্ছে তা জানানোর জন্য কোনো দৃশ্যমান নির্দেশক থাকে না। ভেরিয়েবলের ধরন আলাদা করার একটি সহজ উপায় হলো রঙ ব্যবহার করা।

টুলবক্সে ভেরিয়েবল যোগ করুন

এই নতুন ধরনের ভেরিয়েবল আপনার ব্যবহারকারীদের জন্য উপযোগী করে তুলতে, আপনাকে নতুন ভেরিয়েবলগুলো তৈরি ও ব্যবহার করার একটি উপায় যোগ করতে হবে।

ভেরিয়েবলের জন্য একটি নতুন ডাইনামিক ক্যাটাগরি তৈরি করুন, যদি আপনার আগে থেকে এমন কোনো ক্যাটাগরি না থাকে।

"Variables" নামে একটি খোলা ক্যাটাগরি, যেখানে একটি "Create variable" বাটন রয়েছে।

আপনার নতুন গেটার এবং সেটারগুলোকে ক্যাটাগরিতে যোগ করুন।

`foo` এবং `bar` ভেরিয়েবল তৈরি করার পরের একই ক্যাটাগরি। এতে একটি "ভেরিয়েবল তৈরি করুন" বাটন, ভেরিয়েবলের মান নির্ধারণ ও পরিবর্তন করার ব্লক এবং গেটার ব্লক রয়েছে।

ভেরিয়েবল তৈরি করার বাটন

এরপর, আপনার ব্যবহারকারীর ভেরিয়েবল তৈরি করার একটি উপায় প্রয়োজন। এর সবচেয়ে সহজ উপায় হলো একটি 'ভেরিয়েবল তৈরি করুন' বাটন ব্যবহার করা।

বাটনটি তৈরি করার সময়, কলব্যাক কলটি করুন।

Blockly.Variables.createVariableButtonHandler(button.getTargetWorkspace(), null, 'panda');

এবং একটি "Panda" টাইপের ভেরিয়েবল তৈরি হবে!

ব্যবহারকারীদের একাধিক ধরণের ভেরিয়েবল তৈরি করার সুযোগ দেওয়ার সবচেয়ে সহজ উপায় হলো প্রতিটি ধরণের জন্য একটি করে 'তৈরি করুন' বোতাম রাখা (যেমন: স্ট্রিং ভেরিয়েবল তৈরি করুন, সংখ্যা ভেরিয়েবল তৈরি করুন, পান্ডা ভেরিয়েবল তৈরি করুন)।

আপনার যদি দুই বা তিনটির বেশি ভেরিয়েবল টাইপ থাকে, তাহলে খুব দ্রুতই বাটনের সংখ্যা অনেক বেড়ে যেতে পারে। সেক্ষেত্রে, একটি পপআপ দেখানোর জন্য @blockly/plugin-typed-variable-modal ব্যবহার করার কথা ভাবতে পারেন, যেখান থেকে ব্যবহারকারীরা তাদের পছন্দের ভেরিয়েবল টাইপ বেছে নিতে পারবেন।

জেনারেটর সংজ্ঞায়িত করুন

অবশেষে, আপনার নতুন ভেরিয়েবল ব্লকগুলোর জন্য ব্লক-কোড জেনারেটর সংজ্ঞায়িত করতে হবে। এছাড়াও, সব ধরনের ভেরিয়েবল পেতে আপনি Workspace.getVariableMap().getAllVariables() ব্যবহার করে অথবা একটি নির্দিষ্ট ধরনের ভেরিয়েবল পেতে Workspace.getVariableMap().getVariablesOfType() ব্যবহার করে সরাসরি ভেরিয়েবলের তালিকা অ্যাক্সেস করতে পারেন।