لغو نمادهای داخلی

Blockly دارای سه نوع آیکون داخلی است: نظرات، هشدارها و mutators.

نمادهای نظر قابل لغو هستند. این به این معنی است که می‌توانید به Blockly بگویید وقتی متدهایی مانند myBlock.setCommentText() را فراخوانی می‌کنید، کلاس آیکون نظرات شما را نمونه‌سازی کند. برای مثال اگر می‌خواهید حباب بازشوی نظر متفاوت به نظر برسد، ممکن است بخواهید این کار را انجام دهید.

آیکون‌های هشدار و جهش‌پذیر قابل لغو نیستند.

نماد نظر

برای لغو نماد نظر، باید یک نماد سفارشی ایجاد کنید که رابط 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));
}

برای اطلاعات بیشتر در مورد سریال سازی نمادها به ذخیره و بارگیری نمادها مراجعه کنید.

ثبت نام

در نهایت، باید نماد خود را ثبت کنید تا Blockly بتواند آن را نمونه برداری کند. حتما از نوع IconTypes.COMMENT استفاده کنید.

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