ব্লকের অ্যানাটমি, ব্লকের অ্যানাটমি

এই নথিটি একটি ব্লকের বিভিন্ন অংশ অন্বেষণ করে।

সংযোগ

সংযোগগুলি সংজ্ঞায়িত করে যেখানে ব্লকগুলি সংযোগ করতে পারে এবং তারা কোন ধরণের ব্লকগুলির সাথে সংযোগ করতে পারে৷

মূল শব্দ: সংযোগ শব্দটি সাধারণত দুটি জিনিসের মধ্যে সম্পর্ককে বোঝায়। ব্লকলিতে, এর অর্থ সাধারণত সংযোগকারী , যেমন একটি প্লাগ বা সকেট। এইভাবে, আপনি যখন দুটি ব্লক সংযুক্ত করেন, আপনি তাদের সংযোগগুলিকে একত্রে ফিট করেন।

চার ধরনের সংযোগ আছে:

সংযোগের ধরন	ছবি
আউটপুট সংযোগ
ইনপুট সংযোগ
পূর্ববর্তী সংযোগ
পরবর্তী সংযোগ

আউটপুট সংযোগ এবং ইনপুট সংযোগগুলি একসাথে সংযোগ করতে পারে এবং পরবর্তী সংযোগ এবং পূর্ববর্তী সংযোগগুলি একসাথে সংযুক্ত হতে পারে। আপনি সংযোগ চেকগুলির সাথে সংযোগগুলিকে আরও সীমাবদ্ধ করতে পারেন৷

আপনি একটি কাস্টম রেন্ডারার ব্যবহার করে সংযোগের আকারগুলি কাস্টমাইজ করতে পারেন৷

শীর্ষ-স্তরের সংযোগ

ব্লকের তিনটি সংযোগ রয়েছে যার ব্যবহার ঐচ্ছিক।

একটি ব্লকের একটি একক আউটপুট সংযোগ থাকতে পারে, যা একটি ব্লকের অগ্রবর্তী প্রান্তে একটি পুরুষ জিগস সংযোগকারী হিসাবে উপস্থাপিত হয়। একটি আউটপুট সংযোগ একটি ব্লকের মান (অভিব্যক্তি) অন্য ব্লকে প্রেরণ করে। একটি আউটপুট সংযোগ সহ একটি ব্লককে একটি মান ব্লক বলা হয়।

একটি ব্লকের উপরে একটি পূর্ববর্তী সংযোগ থাকতে পারে (একটি খাঁজ হিসাবে উপস্থাপিত) এবং তার নীচে একটি পরবর্তী সংযোগ (একটি ট্যাব হিসাবে উপস্থাপিত)। এগুলি বিবৃতিগুলির একটি ক্রম উপস্থাপন করে ব্লকগুলিকে উল্লম্বভাবে স্ট্যাক করার অনুমতি দেয়। একটি আউটপুট সংযোগ ছাড়া একটি ব্লক একটি স্টেটমেন্ট ব্লক বলা হয় এবং সাধারণত পূর্ববর্তী এবং পরবর্তী উভয় সংযোগ থাকে।

আরও তথ্যের জন্য, শীর্ষ-স্তরের সংযোগগুলি দেখুন।

ক্ষেত্র

ক্ষেত্রগুলি একটি ব্লকের মধ্যে বেশিরভাগ UI উপাদানগুলিকে সংজ্ঞায়িত করে৷ এর মধ্যে রয়েছে স্ট্রিং লেবেল, ড্রপডাউন, চেকবক্স, ছবি এবং আক্ষরিক তথ্য যেমন স্ট্রিং এবং সংখ্যার জন্য ইনপুট। উদাহরণস্বরূপ, এই লুপ ব্লক লেবেল ক্ষেত্র, একটি ড্রপডাউন ক্ষেত্র এবং সংখ্যা ক্ষেত্র ব্যবহার করে।

ব্লকলি টেক্সট ইনপুট, কালার পিকার এবং ছবি সহ বেশ কিছু বিল্ট-ইন ফিল্ড প্রদান করে। আপনি আপনার নিজস্ব ক্ষেত্র তৈরি করতে পারেন।

আরও তথ্যের জন্য, ক্ষেত্রগুলি দেখুন।

ইনপুট

ইনপুট হল ক্ষেত্র এবং সংযোগের জন্য পাত্র। একটি ব্লক ইটের মতো এক বা একাধিক সারিতে তার ইনপুট রেন্ডার করে তৈরি করা হয়।

কী টার্ম: ব্লকলিতে ইনপুট শব্দের অনেকগুলো অর্থ রয়েছে। এটির সবচেয়ে সাধারণ অর্থ এখানে বর্ণনা করা হয়েছে: ক্ষেত্র এবং সংযোগের জন্য একটি ধারক। কম সাধারণভাবে, এর অর্থ একটি মান প্রবেশ করানো বা প্রবেশ করা হয়েছে এমন একটি মান বোঝায়।

চারটি ভিন্ন ধরনের ইনপুট রয়েছে, যার সবকটিতেই ক্ষেত্র থাকতে পারে (লেবেল সহ) এবং দুটিতে একটি একক সংযোগ রয়েছে। আপনি কাস্টম ইনপুটও তৈরি করতে পারেন, যা কাস্টম রেন্ডারিং সমর্থন করে।

ইনপুট প্রকার	সংযোগের ধরন	ছবি
ডামি ইনপুট	কোনোটিই নয়
সারির শেষ ইনপুট	কোনোটিই নয়
মান ইনপুট	ইনপুট সংযোগ
বিবৃতি ইনপুট	পরবর্তী সংযোগ

আমরা এই ইনপুটগুলিকে কয়েকটি উদাহরণের মাধ্যমে উপস্থাপন করব। একটি ব্লক তৈরি করা ইনপুট, সংযোগ এবং ক্ষেত্রগুলি সংজ্ঞায়িত করার বিষয়ে তথ্যের জন্য, JSON-এ ব্লক স্ট্রাকচার এবং JavaScript-এ ব্লক স্ট্রাকচার দেখুন।

ডামি ইনপুট

একটি ডামি ইনপুট হল ক্ষেত্রগুলির জন্য একটি ধারক -- এটির কোনো সংযোগ নেই৷ উদাহরণস্বরূপ, নিম্নলিখিত নম্বর ব্লকে একটি একক ডামি ইনপুট রয়েছে যাতে একটি একক নম্বর ক্ষেত্র রয়েছে।

একটি আরও জটিল উদাহরণ হিসাবে, একটি ব্লক বিবেচনা করুন যা একসাথে দুটি সংখ্যা যোগ করে। এটি তিনটি ক্ষেত্র (নম্বর, লেবেল, নম্বর) সহ একটি একক ডামি ইনপুট থেকে তৈরি করা যেতে পারে:

বা তিনটি ডামি ইনপুট, প্রতিটি একটি একক ক্ষেত্র সহ:

সারির শেষ ইনপুট

ব্লকলি হিউরিস্টিকস ব্যবহার করে সিদ্ধান্ত নিতে যে সমস্ত ইনপুট একক সারিতে রেন্ডার করা যায় নাকি প্রতিটি ইনপুটকে নিজস্ব সারিতে রেন্ডার করা যায়। আপনি যদি নিশ্চিত হতে চান যে একটি ইনপুট একটি নতুন সারি শুরু করে, তাহলে পূর্ববর্তী ইনপুট হিসাবে একটি শেষ-অফ-সারি ইনপুট ব্যবহার করুন।

ডামি ইনপুটগুলির মতো, সারির শেষের ইনপুটগুলিতে ক্ষেত্র থাকতে পারে তবে কোনও সংযোগ নেই। উদাহরণস্বরূপ, এখানে দুটি ক্ষেত্র সহ একটি শেষ-অফ-সারির ইনপুট এবং একটি ক্ষেত্র সহ একটি ডামি ইনপুট থেকে নির্মিত সংযোজন ব্লক রয়েছে। সারির শেষ ইনপুট ডামি ইনপুটকে একটি নতুন সারিতে রেন্ডার করতে বাধ্য করে।

মান ইনপুট

ক্ষেত্রগুলি তারা যা গ্রহণ করতে পারে তাতে সীমিত। উদাহরণস্বরূপ, সংখ্যা ক্ষেত্র শুধুমাত্র সংখ্যা গ্রহণ করে। কিন্তু যদি আপনি দুটি ভেরিয়েবল একসাথে যোগ করতে চান? অথবা একটি ভিন্ন গণনার ফলাফলের সাথে একটি পদ্ধতি কলের ফলাফল যোগ করুন? এই সমস্যাটি সমাধান করতে, ক্ষেত্রের পরিবর্তে ইনপুট সংযোগ ব্যবহার করুন। এটি ব্যবহারকারীদের ইনপুট মান হিসাবে মান ব্লক ব্যবহার করার অনুমতি দেয়।

একটি মান ইনপুটে শূন্য বা তার বেশি ক্ষেত্র থাকে এবং একটি ইনপুট সংযোগে শেষ হয়। নিম্নলিখিত ব্লকটি ইনপুট সংযোগের সাথে সংযোজন ব্লকের নম্বর ক্ষেত্রগুলিকে প্রতিস্থাপন করে। এটি দুটি মান ইনপুট থেকে তৈরি করা হয়েছে -- প্রথমটিতে কোনো ক্ষেত্র নেই এবং দ্বিতীয়টিতে একটি লেবেল ক্ষেত্র রয়েছে। উভয়ই ইনপুট সংযোগে শেষ হয়।

বিবৃতি ইনপুট

শেষ ধরনের ইনপুট হল একটি স্টেটমেন্ট ইনপুট , যাতে শূন্য বা তার বেশি ক্ষেত্র থাকে এবং পরবর্তী সংযোগ দিয়ে শেষ হয়। পরবর্তী সংযোগ আপনাকে আপনার ব্লকের ভিতরে স্টেটমেন্ট ব্লকের একটি স্ট্যাক নেস্ট করতে দেয়। উদাহরণস্বরূপ, নিম্নলিখিত পুনরাবৃত্তি ব্লক বিবেচনা করুন. এই ব্লকের দ্বিতীয় সারিতে একটি একক লেবেল ক্ষেত্র এবং একটি পরবর্তী সংযোগ সহ একটি বিবৃতি ইনপুট রয়েছে।

স্টেটমেন্ট ইনপুট সবসময় তাদের নিজস্ব সারিতে রেন্ডার করা হয়। আপনি নিম্নলিখিত if-then-else ব্লকে এটি দেখতে পাবেন, যার প্রথম সারিতে একটি মান ইনপুট রয়েছে এবং পরবর্তী দুটি সারিতে বিবৃতি ইনপুট রয়েছে।

ইনলাইন বনাম বাহ্যিক ইনপুট

ইনপুট ইনলাইন বা বাহ্যিকভাবে রেন্ডার করা যেতে পারে। এটি নিয়ন্ত্রণ করে যে মান ইনপুটগুলির সংযোগকারীগুলি ব্লকের ভিতরে (ইনলাইন) বা বাইরের প্রান্তে (বাহ্যিক) রেন্ডার করা হয়েছে, সেইসাথে ইনপুটগুলি একই বা ভিন্ন সারিতে রেন্ডার করা হয়েছে কিনা।

যখন আপনি একটি কাস্টম ব্লক তৈরি করেন, তখন আপনি নির্দিষ্ট করতে পারেন কোনটি ব্যবহার করবেন বা ব্লকলিকে আপনার জন্য সিদ্ধান্ত নিতে দিন। আরও তথ্যের জন্য, ইনলাইন বনাম বাহ্যিক ইনপুট দেখুন।

খেলতে যাও!

ইনপুট, ক্ষেত্র এবং সংযোগ সম্পর্কে জানার সর্বোত্তম উপায় হল ব্লকলি ডেভেলপার টুলে ব্লক তৈরি করা এবং inputs ড্রপডাউন ( automatic , external , inline ) এর জন্য বিভিন্ন সেটিংস বেছে নেওয়া।

আইকন

ইনপুট, সংযোগ এবং ক্ষেত্র ছাড়াও, ব্লকগুলিতে এক বা একাধিক আইকন থাকতে পারে। এগুলির বিভিন্ন ব্যবহার রয়েছে, যেমন সতর্কতা প্রদর্শন করা, ব্লক-স্তরের মন্তব্যগুলি প্রবেশ করানো বা মিউটেটর UI প্রদর্শন করা। উদাহরণস্বরূপ, এখানে একটি মন্তব্য আইকন এবং এর সংশ্লিষ্ট সম্পাদক সহ একটি ব্লক রয়েছে৷

আরও তথ্যের জন্য, আইকন দেখুন।

ব্লক এবং জাভাস্ক্রিপ্ট অবজেক্ট

ব্লক, ইনপুট, সংযোগ, ক্ষেত্র এবং আইকন সব জাভাস্ক্রিপ্ট অবজেক্ট।

ব্লকলি উপাদান	বেস ক্লাস	উপশ্রেণী
ব্লক	Block	BlockSvg
ইনপুট	Input	DummyInput
		EndRowInput
		ValueInput
		StatementInput
		কাস্টম ইনপুট
সংযোগ	Connection	RenderedConnection
মাঠ	Field	FieldTextInput
		FieldNumber
		FieldLabel
		কাস্টম ক্ষেত্র
		ইত্যাদি
আইকন	Icon	CommentIcon
		MutatorIcon
		WarningIcon
		কাস্টম আইকন

একটি ব্লকের বস্তুগুলি একটি গাছের আকৃতির বস্তু গঠন করে। একটি ব্লকের গ্রাফিকাল উপস্থাপনা কীভাবে এই গাছের সাথে মিলে যায় তা বোঝা সহায়ক যখন আপনি ব্লকগুলিকে প্রোগ্রামগতভাবে ম্যানিপুলেট করার জন্য কোড লেখেন। উদাহরণস্বরূপ, একটি controls_for ব্লক:

জাভাস্ক্রিপ্ট অবজেক্টের নিম্নলিখিত গাছের সাথে মিলে যায়।

// <Object> means an instance of an Object.
{                                   // Block
  nextConnection: <Connection>,     // ConnectionType NEXT_STATEMENT
  outputConnection: null,
  previousConnection: <Connection>, // ConnectionType PREVIOUS_STATEMENT
  inputList: [                      // Array of Inputs in block
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [                   // Array of fields in Input
        <FieldLabel>,               // 'count with'
        <FieldVariable>,            // i
        <FieldLabel>,               // 'from'
      ],
    },
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [
        <FieldLabel>,               // 'to'
      ],
    },
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [
        <FieldLabel>,               // 'by'
      ],
    },
    {                               // StatementInput
      connection: <Connection>,     // ConnectionType NEXT_STATEMENT
      fieldRow: [
        <FieldLabel>,               // 'do'
      ],
    },
  ]
}