آناتومی یک بلوک، آناتومی یک بلوک

این سند قسمت های مختلف یک بلوک را بررسی می کند.

اتصالات

اتصالات مشخص می کنند که بلوک ها می توانند به کجا متصل شوند و به چه نوع بلوک هایی می توانند متصل شوند.

چهار نوع اتصال وجود دارد:

نوع اتصال تصویر
اتصال خروجی یک اتصال خروجی
اتصال ورودی یک اتصال ورودی
اتصال قبلی یک اتصال قبلی
اتصال بعدی اتصال بعدی

اتصالات خروجی و اتصالات ورودی می توانند به یکدیگر متصل شوند و اتصالات بعدی و اتصالات قبلی می توانند به یکدیگر متصل شوند. شما می توانید اتصالات را با بررسی های اتصال محدودتر کنید.

شما می توانید اشکال اتصالات را با استفاده از یک رندر سفارشی سفارشی کنید .

اتصالات سطح بالا

بلوک ها دارای سه اتصال هستند که استفاده از آنها اختیاری است.

یک بلوک ممکن است یک اتصال خروجی داشته باشد که به عنوان یک اتصال دهنده اره منبت کاری اره مویی نر در لبه جلویی یک بلوک نشان داده می شود. یک اتصال خروجی مقدار یک بلوک (عبارت) را به بلوک دیگری ارسال می کند. بلوک با اتصال خروجی، بلوک ارزش نامیده می شود.

یک بلوک اعداد ریاضی.

یک بلوک ممکن است یک اتصال قبلی در بالای خود (به عنوان یک بریدگی) و یک اتصال بعدی در پایین (به عنوان یک زبانه) داشته باشد. اینها به بلوک‌ها اجازه می‌دهند که به صورت عمودی روی هم چیده شوند و دنباله‌ای از عبارات را نشان دهند. بلوک بدون اتصال خروجی، بلوک دستور نامیده می شود و معمولاً دارای هر دو اتصال قبلی و بعدی است.

یک متغیر_مجموعه مسدود کردن

برای اطلاعات بیشتر، اتصالات سطح بالا را ببینید.

فیلدها

فیلدها اکثر عناصر UI را در یک بلوک تعریف می کنند. اینها شامل برچسب‌های رشته، فهرست‌های بازشو، چک باکس، تصاویر و ورودی‌های داده‌های تحت اللفظی مانند رشته‌ها و اعداد است. به عنوان مثال، این بلوک حلقه از فیلدهای برچسب، یک فیلد کشویی و فیلدهای شماره استفاده می کند.

بلوکی با چندین فیلد.

Blockly تعدادی فیلد داخلی از جمله ورودی متن، انتخابگر رنگ و تصاویر را ارائه می‌کند. شما همچنین می توانید فیلدهای خود را ایجاد کنید .

برای اطلاعات بیشتر، فیلدها را ببینید.

ورودی ها

ورودی ها محفظه هایی برای فیلدها و اتصالات هستند. یک بلوک با رندر کردن ورودی های آن در یک یا چند ردیف مانند آجر ساخته می شود.

چهار نوع ورودی مختلف وجود دارد که همگی می‌توانند شامل فیلدها (شامل برچسب‌ها) باشند و دو نوع ورودی شامل یک اتصال واحد هستند. همچنین می توانید ورودی های سفارشی ایجاد کنید که از رندر سفارشی پشتیبانی می کنند.

نوع ورودی نوع اتصال تصویر
ورودی ساختگی هیچ کدام ورودی ساختگی
ورودی انتهای ردیف هیچ کدام ورودی انتهای ردیف
ارزش ورودی اتصال ورودی ورودی ارزش
ورودی بیانیه اتصال بعدی ورودی بیانیه

ما این ورودی ها را از طریق یک سری مثال معرفی خواهیم کرد. برای اطلاعات در مورد تعریف ورودی‌ها، اتصالات و فیلدهایی که یک بلوک را تشکیل می‌دهند، به ساختار بلوک در JSON و ساختار بلوک در جاوا اسکریپت مراجعه کنید.

ورودی های ساختگی

ورودی ساختگی فقط یک محفظه برای فیلدها است -- اتصالی ندارد. به عنوان مثال، بلوک اعداد زیر دارای یک ورودی ساختگی است که حاوی یک فیلد عددی واحد است.

یک بلوک اعداد با ورودی ساختگی و یک عدد زمینه

به عنوان مثال پیچیده تر، بلوکی را در نظر بگیرید که دو عدد را با هم جمع می کند. این می تواند از یک ورودی ساختگی با سه فیلد (عدد، برچسب، شماره) ساخته شود:

یک بلوک اضافی ساخته شده از ورودی ساختگی با سه زمینه ها

یا سه ورودی ساختگی که هر کدام یک فیلد دارند:

یک بلوک اضافی ساخته شده از سه ورودی ساختگی، که هر یک دارای یک واحد است زمینه

ورودی های انتهای ردیف

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

مانند ورودی‌های ساختگی، ورودی‌های انتهای ردیف می‌توانند حاوی فیلدهایی باشند اما اتصالی ندارند. برای مثال، در اینجا بلوک جمع ساخته شده از یک ورودی انتهای ردیف با دو فیلد و یک ورودی ساختگی با یک فیلد ساخته شده است. ورودی انتهای ردیف، ورودی ساختگی را مجبور می‌کند که در یک ردیف جدید ارائه شود.

یک بلوک اضافی توسط یک انتهای ردیف به دو ردیف تقسیم می شود ورودی

ارزش ورودی ها

زمینه ها در مواردی که می توانند بپذیرند محدود است. به عنوان مثال، فیلدهای شماره فقط اعداد را می پذیرند. اما اگر بخواهید دو متغیر را با هم اضافه کنید چه؟ یا نتیجه یک فراخوانی رویه را به نتیجه یک محاسبه متفاوت اضافه کنید؟ برای حل این مشکل به جای فیلدها از اتصالات ورودی استفاده کنید. این به کاربران اجازه می دهد تا از بلوک های ارزش به عنوان مقادیر ورودی استفاده کنند.

یک مقدار ورودی حاوی صفر یا چند فیلد است و به یک اتصال ورودی ختم می شود. بلوک زیر فیلدهای شماره در بلوک جمع را با اتصالات ورودی جایگزین می کند. این از دو ورودی مقدار ساخته شده است - اولی حاوی هیچ فیلدی نیست و دومی حاوی یک فیلد برچسب است. هر دو به اتصالات ورودی ختم می شوند.

یک بلوک اضافه با دو مقدار ورودی ها

ورودی های بیانیه

آخرین نوع ورودی یک ورودی عبارت است که حاوی صفر یا چند فیلد است و با اتصال بعدی به پایان می رسد. اتصال بعدی به شما امکان می دهد پشته ای از بلوک های دستوری را در داخل بلوک خود قرار دهید. به عنوان مثال، بلوک تکرار زیر را در نظر بگیرید. ردیف دوم این بلوک شامل یک ورودی عبارت با یک فیلد برچسب و یک اتصال بعدی است.

یک بلوک تکرار با یک ورودی عبارت برای تودرتو تکرار شده است بیانیه ها

ورودی های بیانیه همیشه در ردیف خودشان ارائه می شوند. این را می توانید در بلوک if-then-else زیر مشاهده کنید که دارای ورودی مقدار در ردیف اول و ورودی دستورات در دو ردیف بعدی است.

یک بلوک if-then-else با ورودی های دستور جداگانه برای then و else بیانیه ها

Inline در مقابل ورودی های خارجی

ورودی ها می توانند به صورت درون خطی یا خارجی ارائه شوند. این کنترل می‌کند که آیا کانکتورهای ورودی مقدار در داخل بلوک (در خط) یا در لبه بیرونی (خارجی) رندر شوند، و همچنین اینکه آیا ورودی‌ها در ردیف‌های یکسان یا متفاوت ارائه شوند.

همان بلوک یک بار با ورودی های درون خطی و یک بار با خارجی ارائه شده است ورودی ها

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

برو بازی کن

بهترین راه برای یادگیری در مورد ورودی‌ها، فیلدها و اتصالات، ساختن بلوک‌ها در ابزارهای توسعه‌دهنده Blockly و انتخاب تنظیمات مختلف برای inputs ( automatic ، external ، inline ) است.

نمادها

علاوه بر ورودی‌ها، اتصالات و فیلدها، بلوک‌ها می‌توانند یک یا چند نماد داشته باشند. اینها کاربردهای مختلفی دارند، مانند نمایش هشدارها، وارد کردن نظرات در سطح بلوک یا نمایش رابط کاربری mutator. به عنوان مثال، در اینجا یک بلوک با نماد نظر و ویرایشگر مربوط به آن وجود دارد.

بلوکی با نماد نظر و نظر باز ویرایشگر

برای اطلاعات بیشتر، نمادها را ببینید.

بلوک ها و اشیاء جاوا اسکریپت

بلوک ها، ورودی ها، اتصالات، فیلدها و آیکون ها همه اشیاء جاوا اسکریپت هستند.

جزء بلوکی کلاس پایه زیر کلاس ها
مسدود کردن Block BlockSvg
ورودی Input DummyInput
EndRowInput
ValueInput
StatementInput
ورودی سفارشی
اتصال Connection RenderedConnection
میدان Field FieldTextInput
FieldNumber
FieldLabel
فیلد سفارشی
و غیره
نماد Icon CommentIcon
MutatorIcon
WarningIcon
نماد سفارشی

اشیاء موجود در یک بلوک یک جسم درختی شکل را تشکیل می دهند. درک اینکه چگونه نمایش گرافیکی یک بلوک با این درخت مطابقت دارد، هنگام نوشتن کد برای دستکاری بلوک ها به صورت برنامه ای مفید است. به عنوان مثال، یک بلوک controls_for :

یک بلوک حلقه با یک فیلد متغیر، ورودی های مقدار به، از، و توسط، و a ورودی بیانیه برای تکرار بیانیه ها

مربوط به درخت زیر از اشیاء جاوا اسکریپت است.

// <Object> means an instance of an Object.
{                                   // Block
  nextConnection: <Connection>,     // ConnectionType NEXT_STATEMENT
  outputConnection: null,
  previousConnection: <Connection>, // ConnectionType PREVIOUS_STATEMENT
  inputList: [                      // Array of Inputs in block
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [                   // Array of fields in Input
        <FieldLabel>,               // 'count with'
        <FieldVariable>,            // i
        <FieldLabel>,               // 'from'
      ],
    },
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [
        <FieldLabel>,               // 'to'
      ],
    },
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [
        <FieldLabel>,               // 'by'
      ],
    },
    {                               // StatementInput
      connection: <Connection>,     // ConnectionType NEXT_STATEMENT
      fieldRow: [
        <FieldLabel>,               // 'do'
      ],
    },
  ]
}
،

این سند قسمت های مختلف یک بلوک را بررسی می کند.

اتصالات

اتصالات مشخص می کنند که بلوک ها می توانند به کجا متصل شوند و به چه نوع بلوک هایی می توانند متصل شوند.

چهار نوع اتصال وجود دارد:

نوع اتصال تصویر
اتصال خروجی یک اتصال خروجی
اتصال ورودی یک اتصال ورودی
اتصال قبلی یک اتصال قبلی
اتصال بعدی اتصال بعدی

اتصالات خروجی و اتصالات ورودی می توانند به یکدیگر متصل شوند و اتصالات بعدی و اتصالات قبلی می توانند به یکدیگر متصل شوند. شما می توانید اتصالات را با بررسی های اتصال محدودتر کنید.

شما می توانید اشکال اتصالات را با استفاده از یک رندر سفارشی سفارشی کنید .

اتصالات سطح بالا

بلوک ها دارای سه اتصال هستند که استفاده از آنها اختیاری است.

یک بلوک ممکن است یک اتصال خروجی داشته باشد که به عنوان یک اتصال دهنده اره منبت کاری اره مویی نر در لبه جلویی یک بلوک نشان داده می شود. یک اتصال خروجی مقدار یک بلوک (عبارت) را به بلوک دیگری ارسال می کند. بلوک با اتصال خروجی، بلوک ارزش نامیده می شود.

یک بلوک اعداد ریاضی.

یک بلوک ممکن است یک اتصال قبلی در بالای خود (به عنوان یک بریدگی) و یک اتصال بعدی در پایین (به عنوان یک زبانه) داشته باشد. اینها به بلوک‌ها اجازه می‌دهند که به صورت عمودی روی هم چیده شوند و دنباله‌ای از عبارات را نشان دهند. بلوک بدون اتصال خروجی، بلوک دستور نامیده می شود و معمولاً دارای هر دو اتصال قبلی و بعدی است.

یک متغیر_مجموعه مسدود کردن

برای اطلاعات بیشتر، اتصالات سطح بالا را ببینید.

فیلدها

فیلدها اکثر عناصر UI را در یک بلوک تعریف می کنند. اینها شامل برچسب‌های رشته، فهرست‌های بازشو، چک باکس، تصاویر و ورودی‌های داده‌های تحت اللفظی مانند رشته‌ها و اعداد است. به عنوان مثال، این بلوک حلقه از فیلدهای برچسب، یک فیلد کشویی و فیلدهای شماره استفاده می کند.

بلوکی با چندین فیلد.

Blockly تعدادی فیلد داخلی از جمله ورودی متن، انتخابگر رنگ و تصاویر را ارائه می‌کند. شما همچنین می توانید فیلدهای خود را ایجاد کنید .

برای اطلاعات بیشتر، فیلدها را ببینید.

ورودی ها

ورودی ها محفظه هایی برای فیلدها و اتصالات هستند. یک بلوک با رندر کردن ورودی های آن در یک یا چند ردیف مانند آجر ساخته می شود.

چهار نوع ورودی مختلف وجود دارد که همگی می‌توانند شامل فیلدها (شامل برچسب‌ها) باشند و دو نوع ورودی شامل یک اتصال واحد هستند. همچنین می توانید ورودی های سفارشی ایجاد کنید که از رندر سفارشی پشتیبانی می کنند.

نوع ورودی نوع اتصال تصویر
ورودی ساختگی هیچ کدام ورودی ساختگی
ورودی انتهای ردیف هیچ کدام ورودی انتهای ردیف
ارزش ورودی اتصال ورودی ورودی ارزش
ورودی بیانیه اتصال بعدی ورودی بیانیه

ما این ورودی ها را از طریق یک سری مثال معرفی خواهیم کرد. برای اطلاعات در مورد تعریف ورودی‌ها، اتصالات و فیلدهایی که یک بلوک را تشکیل می‌دهند، به ساختار بلوک در JSON و ساختار بلوک در جاوا اسکریپت مراجعه کنید.

ورودی های ساختگی

ورودی ساختگی فقط یک محفظه برای فیلدها است -- اتصالی ندارد. به عنوان مثال، بلوک اعداد زیر دارای یک ورودی ساختگی است که حاوی یک فیلد عددی واحد است.

یک بلوک اعداد با ورودی ساختگی و یک عدد زمینه

به عنوان مثال پیچیده تر، بلوکی را در نظر بگیرید که دو عدد را با هم جمع می کند. این می تواند از یک ورودی ساختگی با سه فیلد (عدد، برچسب، شماره) ساخته شود:

یک بلوک اضافی ساخته شده از ورودی ساختگی با سه زمینه ها

یا سه ورودی ساختگی که هر کدام یک فیلد دارند:

یک بلوک اضافی ساخته شده از سه ورودی ساختگی، که هر یک دارای یک واحد است زمینه

ورودی های انتهای ردیف

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

مانند ورودی‌های ساختگی، ورودی‌های انتهای ردیف می‌توانند حاوی فیلدهایی باشند اما اتصالی ندارند. برای مثال، در اینجا بلوک جمع ساخته شده از یک ورودی انتهای ردیف با دو فیلد و یک ورودی ساختگی با یک فیلد ساخته شده است. ورودی انتهای ردیف، ورودی ساختگی را مجبور می‌کند که در یک ردیف جدید ارائه شود.

یک بلوک اضافی توسط یک انتهای ردیف به دو ردیف تقسیم می شود ورودی

ارزش ورودی ها

زمینه ها در مواردی که می توانند بپذیرند محدود است. به عنوان مثال، فیلدهای شماره فقط اعداد را می پذیرند. اما اگر بخواهید دو متغیر را با هم اضافه کنید چه؟ یا نتیجه یک فراخوانی رویه را به نتیجه یک محاسبه متفاوت اضافه کنید؟ برای حل این مشکل به جای فیلدها از اتصالات ورودی استفاده کنید. این به کاربران اجازه می دهد تا از بلوک های ارزش به عنوان مقادیر ورودی استفاده کنند.

یک مقدار ورودی حاوی صفر یا چند فیلد است و به یک اتصال ورودی ختم می شود. بلوک زیر فیلدهای شماره در بلوک جمع را با اتصالات ورودی جایگزین می کند. این از دو ورودی مقدار ساخته شده است - اولی حاوی هیچ فیلدی نیست و دومی حاوی یک فیلد برچسب است. هر دو به اتصالات ورودی ختم می شوند.

یک بلوک اضافه با دو مقدار ورودی ها

ورودی های بیانیه

آخرین نوع ورودی یک ورودی عبارت است که حاوی صفر یا چند فیلد است و با اتصال بعدی به پایان می رسد. اتصال بعدی به شما امکان می دهد پشته ای از بلوک های دستوری را در داخل بلوک خود قرار دهید. به عنوان مثال، بلوک تکرار زیر را در نظر بگیرید. ردیف دوم این بلوک شامل یک ورودی عبارت با یک فیلد برچسب و یک اتصال بعدی است.

یک بلوک تکرار با یک ورودی عبارت برای تودرتو تکرار شده است بیانیه ها

ورودی های بیانیه همیشه در ردیف خودشان ارائه می شوند. این را می توانید در بلوک if-then-else زیر مشاهده کنید که دارای ورودی مقدار در ردیف اول و ورودی دستورات در دو ردیف بعدی است.

یک بلوک if-then-else با ورودی های دستور جداگانه برای then و else بیانیه ها

Inline در مقابل ورودی های خارجی

ورودی ها می توانند به صورت درون خطی یا خارجی ارائه شوند. این کنترل می‌کند که آیا کانکتورهای ورودی مقدار در داخل بلوک (در خط) یا در لبه بیرونی (خارجی) رندر شوند، و همچنین اینکه آیا ورودی‌ها در ردیف‌های یکسان یا متفاوت ارائه شوند.

همان بلوک یک بار با ورودی های درون خطی و یک بار با خارجی ارائه شده است ورودی ها

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

برو بازی کن

بهترین راه برای یادگیری در مورد ورودی‌ها، فیلدها و اتصالات، ساختن بلوک‌ها در ابزارهای توسعه‌دهنده Blockly و انتخاب تنظیمات مختلف برای inputs ( automatic ، external ، inline ) است.

نمادها

علاوه بر ورودی‌ها، اتصالات و فیلدها، بلوک‌ها می‌توانند یک یا چند نماد داشته باشند. اینها کاربردهای مختلفی دارند، مانند نمایش هشدارها، وارد کردن نظرات در سطح بلوک یا نمایش رابط کاربری mutator. به عنوان مثال، در اینجا یک بلوک با نماد نظر و ویرایشگر مربوط به آن وجود دارد.

یک بلوک با نماد نظر و یک نظر باز ویرایشگر

برای اطلاعات بیشتر، نمادها را ببینید.

بلوک ها و اشیاء جاوا اسکریپت

بلوک ها، ورودی ها، اتصالات، فیلدها و آیکون ها همه اشیاء جاوا اسکریپت هستند.

جزء بلوکی کلاس پایه زیر کلاس ها
مسدود کردن Block BlockSvg
ورودی Input DummyInput
EndRowInput
ValueInput
StatementInput
ورودی سفارشی
اتصال Connection RenderedConnection
میدان Field FieldTextInput
FieldNumber
FieldLabel
فیلد سفارشی
و غیره
نماد Icon CommentIcon
MutatorIcon
WarningIcon
نماد سفارشی

اشیاء موجود در یک بلوک یک جسم درختی شکل را تشکیل می دهند. درک اینکه چگونه نمایش گرافیکی یک بلوک با این درخت مطابقت دارد، هنگام نوشتن کد برای دستکاری بلوک ها به صورت برنامه ای مفید است. به عنوان مثال، یک بلوک controls_for :

یک بلوک حلقه با یک فیلد متغیر، ورودی های مقدار به، از، و توسط، و a ورودی بیانیه برای تکرار بیانیه ها

مربوط به درخت زیر از اشیاء جاوا اسکریپت است.

// <Object> means an instance of an Object.
{                                   // Block
  nextConnection: <Connection>,     // ConnectionType NEXT_STATEMENT
  outputConnection: null,
  previousConnection: <Connection>, // ConnectionType PREVIOUS_STATEMENT
  inputList: [                      // Array of Inputs in block
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [                   // Array of fields in Input
        <FieldLabel>,               // 'count with'
        <FieldVariable>,            // i
        <FieldLabel>,               // 'from'
      ],
    },
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [
        <FieldLabel>,               // 'to'
      ],
    },
    {                               // ValueInput
      connection: <Connection>,     // ConnectionType INPUT_VALUE
      fieldRow: [
        <FieldLabel>,               // 'by'
      ],
    },
    {                               // StatementInput
      connection: <Connection>,     // ConnectionType NEXT_STATEMENT
      fieldRow: [
        <FieldLabel>,               // 'do'
      ],
    },
  ]
}