سفارشی سازی پیشرفته

Blockly به شما امکان می دهد با جایگزین کردن کلاس های Blockly مربوطه، عملکرد خاصی را سفارشی کنید.

کلاس های قابل تعویض

کلاس های Blockly زیر را می توان جایگزین کرد:

کلاس بلوکی رابط نام نوع رجیستری
Blockly.dragging.Dragger Blockly.IDragger blockDragger
Blockly.ConnectionChecker Blockly.IConnectionChecker connectionChecker
Blockly.InsertionMarkerPreviewer Blockly.IConnectionPreviewer connectionPreviewer
Blockly.HorizontalFlyout Blockly.IFlyout flyoutsHorizontalToolbox
Blockly.VerticalFlyout Blockly.IFlyout flyoutsVerticalToolbox
Blockly.MetricsManager Blockly.IMetricsManager metricsManager
Blockly.Toolbox Blockly.IToolbox toolbox
Blockly.VariableMap Blockly.IVariableMap variableMap
Blockly.VariableModel Blockly.IVariableModel --

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

یک کلاس جایگزین ایجاد کنید

برای ایجاد یک کلاس جایگزین، توابع را در رابط مربوطه پیاده سازی کنید. شما می توانید همه این توابع را در یک کلاس جدید پیاده سازی کنید یا کلاس Blockly را گسترش دهید و فقط توابعی را که می خواهید تغییر دهید لغو کنید. تنها شرط این است که شما (یا کلاس پایه) همه توابع را در اینترفیس پیاده سازی کنید و به هر الزامی که در نظرات این رابط توضیح داده شده است پایبند باشید.

برای نشان دادن اینکه یک واسط خاص را به جستجوگر نوع نشان می‌دهید، کلاس خود را با تگ JSDoc @implements {InterfaceName} (در جاوا اسکریپت) یا کلمه کلیدی implements (در TypeScript) حاشیه‌نویسی کنید.

به Blockly در مورد کلاس جایگزینی خود بگویید

دو راه برای اطلاع رسانی به Blockly در مورد کلاس جایگزین وجود دارد: آن را به عنوان کلاس پیش فرض در نوع خود ثبت کنید (ترجیحا) یا با استفاده از گزینه پیکربندی plugins آن را تزریق کنید.

کلاس جایگزین خود را به عنوان پیش فرض ثبت کنید

روش ترجیحی برای اطلاع رسانی به Blockly در مورد کلاس جایگزین، ثبت آن به عنوان پیش فرض برای نوع آن است. برای انجام این کار، Blockly.registry.register را با استفاده از نام Blockly.registry.DEFAULT فراخوانی کنید و پارامتر opt_allowOverrides را روی true تنظیم کنید.

Blockly.registry.register(
  Blockly.registry.Type.VARIABLE_MODEL,
  Blockly.registry.DEFAULT,
  CustomVariableModel,
  true,
);

کلاس جایگزین خود را تزریق کنید

همچنین می توانید کلاس های جایگزین را با استفاده از گزینه پیکربندی plugins تزریق کنید. این یک شی است که از نام های نوع رجیستری به عنوان نام دارایی و کلاس های جایگزین یا نام های ثبت شده به عنوان مقادیر دارایی استفاده می کند.

(علی‌رغم نام ویژگی plugins ، کلاس شما نیازی به بسته‌بندی و توزیع از طریق npm مانند افزونه‌های مورد استفاده برای گسترش Blockly ندارد.)

یا کلاس جایگزین خود را به Blockly.inject منتقل کنید:

Blockly.inject('blocklyDiv', {
  plugins: {
    'metricsManager': CustomMetricsManagerClass
  }
}

یا کلاس خود را با استفاده از Blockly.registry.register ثبت کنید و نام ثبت شده را به Blockly.inject ارسال کنید. اگر گزینه های پیکربندی خود را به صورت JSON خالص ذخیره کنید، این کار مفید است.

Blockly.registry.register(Blockly.registry.Type.METRICS_MANAGER, 'YOUR_NAME', CustomMetricsManagerClass);

Blockly.inject('blocklyDiv', {
  plugins: {
    'metricsManager': 'YOUR_NAME'
  }
}