هر تغییر در فضای کاری باعث ایجاد یک رویداد میشود. این رویدادها وضعیت قبل و بعد از هر تغییر را به طور کامل توصیف میکنند.
گوش دادن به رویدادها از فضای کاری
فضاهای کاری دارای متدهای addChangeListener و removeChangeListener هستند که میتوانند برای گوش دادن به جریان رویداد استفاده شوند. یک مثال ، تولید کد در زمان واقعی است. مثال دیگر ، نسخه آزمایشی حداکثر محدودیت بلوک است. همانطور که اغلب اتفاق میافتد، هیچ یک از این دو مثال اهمیتی نمیدهند که رویداد آغازگر چه بوده است. آنها صرفاً به وضعیت فعلی فضای کاری نگاه میکنند.
یک شنونده رویداد پیچیدهتر، رویداد آغازگر را بررسی میکند. مثال زیر تشخیص میدهد که کاربر چه زمانی اولین نظر خود را ایجاد میکند، یک هشدار صادر میکند، سپس گوش دادن را متوقف میکند تا هشدارهای بیشتری فعال نشوند.
function onFirstComment(event) {
if (event.type == Blockly.Events.BLOCK_CHANGE &&
event.element == 'comment' &&
!event.oldValue && event.newValue) {
alert('Congratulations on creating your first comment!')
workspace.removeChangeListener(onFirstComment);
}
}
workspace.addChangeListener(onFirstComment);
برای گوش دادن به هر رویدادی که درون یک flyout اتفاق میافتد، میتوان یک listener به فضای کاری flyout اضافه کرد.
var flyoutWorkspace = yourWorkspace.getFlyout().getWorkspace();
flyoutWorkspace.addChangeListener(onFirstComment);
گوش دادن به رویدادها از بلوکها
بلوکها میتوانند توابع شنونده تغییر داشته باشند که با هر تغییری در فضای کاری (از جمله مواردی که به بلوک مربوط نیستند) فراخوانی میشوند. این توابع اغلب برای تنظیم متن هشدار بلوک یا اعلان کاربر مشابه در خارج از فضای کاری استفاده میشوند.
این تابع با فراخوانی Block.setOnChange با یک تابع اضافه میشود و میتواند در طول مقداردهی اولیه یا از طریق یک افزونه JSON در صورتی که قصد استفاده از آن را در همه پلتفرمها دارید، انجام شود.
جیسون
{
// ...,
"extensions":["warning_on_change"],
}
Blockly.Extensions.register('warning_on_change', function() {
// Example validation upon block change:
this.setOnChange(function(changeEvent) {
if (this.getInput('NUM').connection.targetBlock()) {
this.setWarningText(null);
} else {
this.setWarningText('Must have an input block.');
}
});
});
جاوا اسکریپت
Blockly.Blocks['block_type'] = {
init: function() {
// Example validation upon block change:
this.setOnChange(function(changeEvent) {
if (this.getInput('NUM').connection.targetBlock()) {
this.setWarningText(null);
} else {
this.setWarningText('Must have an input block.');
}
});
}
}
همچنین میتوانید ویژگی onchange را مستقیماً روی بلوک تنظیم کنید:
جاوا اسکریپت
Blockly.Blocks['block_type'] = {
init: function() {
// Example validation upon block change:
this.onchange = function(changeEvent) {
if (this.getInput('NUM').connection.targetBlock()) {
this.setWarningText(null);
} else {
this.setWarningText('Must have an input block.');
}
};
}
}
سیستم تابع را فراخوانی میکند و رویداد change را به آن ارسال میکند. درون تابع، this به نمونه بلوک اشاره دارد.
از آنجا که این تابع در صورت هرگونه تغییر فراخوانی میشود، در صورت استفاده، توسعهدهندگان باید اطمینان حاصل کنند که شنونده به سرعت اجرا میشود. همچنین باید مراقب تغییرات در فضای کاری بود که ممکن است به صورت آبشاری یا حلقهای به شنونده بازگردد.
برای مثالها به بلوکهای controls_flow_statements ، logic_compare و procedures_ifreturn مراجعه کنید.
توجه داشته باشید که فیلدهای قابل ویرایش، شنوندههای رویداد مخصوص به خود را برای اعتبارسنجی ورودی و ایجاد عوارض جانبی دارند.
انواع رویداد
برای اطلاعات مربوط به رویدادهای فردی به مستندات مرجع مراجعه کنید.
نسخه آزمایشی
برای مثالی از کارهای جالبی که میتوانید با رویدادها انجام دهید، میتوانید دموی آینهای (mirror demo) را بررسی کنید. این دمو دارای دو فضای کاری Blockly است که با استفاده از رویدادها همگامسازی میشوند.