Blockly-এ একজন রেন্ডারার উচ্চতা, প্যাডিং, সীমানা বেধ এবং সংযোগের আকৃতি সহ ব্লকের আকৃতি নিয়ন্ত্রণ করে।
কাস্টম রেন্ডারার
আপনি যদি ব্লকের আকার কাস্টমাইজ করতে চান তবে আপনাকে একটি কাস্টম রেন্ডারার তৈরি করতে হবে। আপনি কোডল্যাব সম্পূর্ণ করে বা রেফারেন্স ডকুমেন্টেশন পড়ে এই প্রক্রিয়া সম্পর্কে আরও জানতে পারেন। Blockly-এর যেকোনও বিল্ট-ইন রেন্ডারার কীভাবে কাজ করে তা বোঝার জন্য কোড পড়া সহায়ক হতে পারে।
একটি কাস্টম রেন্ডারার তৈরি করতে, আপনার প্রয়োজন হবে:
- একটি নতুন রেন্ডারার সংজ্ঞায়িত করুন। আপনি যেখান থেকে শুরু করতে চান তার উপর নির্ভর করে আপনি বেস রেন্ডারার ক্লাস বা বিদ্যমান রেন্ডারারগুলির যেকোনো একটিকে সাবক্লাস করতে পারেন।
- আপনি যে অংশগুলি পরিবর্তন করতে চান তা ওভাররাইড করুন।
- উদাহরণস্বরূপ, ব্লকগুলিতে আরও প্যাডিং যোগ করতে, আপনি একটি
ConstantProvider
সাবক্লাস করতে পারেন (আবার, হয় বেস বা বিদ্যমান কোনো রেন্ডারার), এবং প্রাসঙ্গিক ধ্রুবকটিকে ওভাররাইড করতে পারেন। অন্যান্য সমস্ত মান আপনার নির্বাচিত বেস ক্লাস হিসাবে একই থাকবে। - আপনার কাস্টম
Renderer
সাবক্লাসে, আপনাকে নতুনConstantProvider
ক্লাস হুক আপ করতে হবে। বেস ক্লাসের পরিবর্তে আপনার কাস্টমConstantProvider
একটি নতুন উদাহরণ দিতেmakeConstants_
ফাংশনটি ওভাররাইড করুন। -
PathObject
বাDrawer
মতো অন্যান্য ক্লাস ওভাররাইড করার সময় একই প্রক্রিয়া অনুসরণ করুন।
- উদাহরণস্বরূপ, ব্লকগুলিতে আরও প্যাডিং যোগ করতে, আপনি একটি
আপনার রেন্ডারার নিবন্ধন করুন:
Blockly.blockRendering.register('custom_renderer', CustomRenderer);
আপনার অ্যাপ্লিকেশনে আপনার রেন্ডারার ব্যবহার করুন:
Blockly.inject('blocklyDiv', { renderer: 'custom_renderer' });
অন্তর্নির্মিত রেন্ডারার
ব্লকলি বেশ কিছু প্রাক-নির্মিত রেন্ডারার প্রদান করে। আপনি এগুলিকে যেমন-ই ব্যবহার করতে পারেন বা কাস্টম রেন্ডারারের ভিত্তি হিসাবে ব্যবহার করতে পারেন৷
- গেরাস (ডিফল্ট)
- থ্রাসোস (গেরাসের উপর আরো আধুনিক গ্রহণ)
- জেলোস (আঁচড়ের মতো)
- মিনিমালিস্ট (বেস রেন্ডারার ক্লাস)
এই রেন্ডারারগুলির মধ্যে একটি ব্যবহার করতে, ইনজেকশন বিকল্পগুলিতে নামটি পাস করুন:
Blockly.inject('blocklyDiv', {
renderer: 'thrasos'
});
তাদের সাবক্লাস করতে, উপযুক্ত শ্রেণী(গুলি) প্রসারিত করুন:
class CustomRenderer extends Blockly.geras.Renderer {}
class CustomConstantProvider extends Blockly.geras.ConstantProvider {}