বিল্ট-ইন আইকন ওভাররাইড করুন

ব্লকলিতে তিন ধরণের বিল্ট-ইন আইকন রয়েছে: মন্তব্য, সতর্কতা এবং মিউটেটার।

মন্তব্য আইকন ওভাররাইডেবল হয়. এর মানে হল আপনি যখন myBlock.setCommentText() এর মত পদ্ধতিতে কল করেন তখন আপনি Blockly কে আপনার নিজস্ব মন্তব্য আইকন ক্লাস ইনস্ট্যান্টিয়েট করতে বলতে পারেন। আপনি এটি করতে চাইতে পারেন যদি, উদাহরণস্বরূপ, আপনি মন্তব্যের পপ-আপ বুদবুদটিকে অন্যরকম দেখতে চান৷

সতর্কতা এবং মিউটেটর আইকনগুলি ওভাররাইডযোগ্য নয়৷

মন্তব্য আইকন

মন্তব্য আইকনটিকে ওভাররাইড করতে, আপনাকে একটি কাস্টম আইকন তৈরি করতে হবে যা ICommentIcon ইন্টারফেস প্রয়োগ করে এবং তারপরে এটি নিবন্ধন করুন৷

মৌলিক বাস্তবায়ন

মন্তব্য-নির্দিষ্ট যুক্তি যোগ করার আগে, আপনার কাস্টম আইকনের মৌলিক বাস্তবায়ন সম্পূর্ণ করুন।

টাইপ

getType পদ্ধতিতে অবশ্যই মন্তব্য আইকন IconType ফেরত দিতে হবে।

class MyCommentIcon extends Blockly.icons.Icon {
  getType() {
    return Blockly.icons.IconType.COMMENT;
  }
}

পাঠ্য

ICommentIcon ইন্টারফেসের জন্য মন্তব্যে পাঠ্য থাকা প্রয়োজন। getText পদ্ধতিটি অবশ্যই মন্তব্যের পাঠ্যটি ফিরিয়ে দেবে। setText পদ্ধতিতে অবশ্যই মন্তব্যের পাঠ্য সেট করতে হবে এবং যেকোনো ভিজ্যুয়াল আপডেট করতে হবে।

getText() {
  return this.text;
}

setText(text) {
  this.text = text;
  this.myRenderMethod();
}

বুদবুদ

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

bubbleIsVisible() {
  return this.bubbleVisible;
}

setBubbleVisible(visible: boolean) {
  this.bubbleVisible = visible;
}

বুদবুদ সম্পর্কে আরও তথ্যের জন্য, পপ-আপ বুদবুদ ব্যবহার করা দেখুন।

ICommentIcon ইন্টারফেসের জন্য একটি getBubbleSize পদ্ধতিরও প্রয়োজন যা একটি আকার প্রদান করে এবং একটি setBubbleSize যা এটি সেট করে। আপনার আইকনে প্রযুক্তিগতভাবে একটি বুদবুদ না থাকলেও সংরক্ষণের অবস্থার আগের একই যুক্তি এখানেও প্রযোজ্য।

getBubbleSize() {
  return this.bubbleSize;
}

setBubbleSize(size) {
  this.bubbleSize = size;
  this.myRenderMethod();
}

সংরক্ষণ করুন এবং লোড করুন

আপনার কাস্টম মন্তব্য আইকন অবশ্যই ISerializable ইন্টারফেস বাস্তবায়ন করবে। রাষ্ট্রের উচিত CommentState ইন্টারফেসের সাথে সঙ্গতিপূর্ণ।

saveState() {
  return {
    text: this.text,
    pinned: this.bubbleVisible,
    height: this.bubbleSize.height,
    width: this.bubbleSize.width,
  }
}

loadState(state) {
  this.setText(state.text);
  this.setBubbleVisible(state.pinned);
  this.setBubbleSize(new Blockly.utils.Size(state.width, state.height));
}

আইকন সিরিয়ালাইজেশন সম্পর্কে আরও তথ্যের জন্য আইকন সংরক্ষণ এবং লোড দেখুন।

নিবন্ধন

অবশেষে, আপনাকে আপনার আইকনটি নিবন্ধন করতে হবে যাতে ব্লকলি এটিকে তাত্ক্ষণিক করতে পারে। IconTypes.COMMENT প্রকার ব্যবহার করতে ভুলবেন না।

Blockly.icons.registry.register(Blockly.icons.IconType.COMMENT, myCommentIcon);