كيف يستخدم محرِّر النماذج الثلاثية الأبعاد Blockbench واجهة برمجة التطبيقات SeeDropper للسماح للمستخدمين باختيار الألوان من كل مكان

توفر واجهة برمجة التطبيقات EyeDropper آلية لإنشاء أداة اختيار الألوان والتي تتيح للمستخدمين أخذ عينات من الألوان من شاشاتهم، بما في ذلك خارج نافذة المتصفح. تعرَّف على كيفية استخدام محرِّر النماذج الثلاثية الأبعاد Blockbench لواجهة برمجة التطبيقات هذه في قاعدة الرموز الخاصة به.

مقدمة

(تتوفر هذه المقالة أيضًا في شكل فيديو).

Blockbench هو محرِّر نماذج مجاني وحديث للنماذج التي تتضمّن زخارف منخفضة الشكل والمزيّنة بفن البكسل. إذا كنت قد لعبت في لعبة Minecraft، من المحتمل أنّك شاهدت مواد عرض تم إنشاؤها باستخدام لعبة Openbench، مثل لعبة الماعز التي تمّت إضافتها إلى لعبة Minecraft ضمن الجزء الأول من لعبة Caves and Cliffs Update. يُعدّ رمز الحظر المرخَّص بإصدار 3 من GPC مصدرًا مفتوح المصدر على GitHub.

تم تصميم خروف Minecraft باستخدام Blockbench.

لتجربة تطبيق Openbench، يمكنك تشغيل التطبيق من خلال الانتقال إلى web.blockbench.net. بصفتك تطبيق ويب تقدّمي (PWA، يمكنك تثبيته على سطح المكتب وتشغيله في نافذة مستقلّة. إذا كنت حديث العهد بالنمذجة الثلاثية الأبعاد، يمكنك البدء بواحد من أمثلة الملفات .bbmodel المتعددة المفتوحة المصدر التي يمكنك العثور عليها باستخدام البحث في الرموز من GitHub. على سبيل المثال، جرّب نموذج القطار الذي يظهر في لقطة الشاشة التالية.

تعديل نموذج قطار في Blackbench

واجهة برمجة التطبيقات EyeDropper

من بين العديد من الميزات الأخرى، تقدِّم لعبة Blockbench ميزة الطلاء، لذا إذا أردتَ الإشارة إلى القطار في أي وقت، بإمكانك ذلك الآن. يُرجى عدم إجراء ذلك في العالم الحقيقي. كما ترى، عند وضع العلامات، استخدمت اللون البرتقالي الزاهي.

البطاقة "كان طارق هنا" وعلامة سلام مكتوبة على نموذج القطار.

هذا لون برتقالي استخلصته مباشرةً من خلفية macOS Ventura من خلال EyeDropper API. كما ترى في لقطة الشاشة التالية، يمكن لأداة اختيار الألوان (الدائرة البرتقالية على يسار نافذة التطبيق) الوصول إلى خارج التطبيق مباشرةً إلى سطح المكتب أو أي تطبيق آخر قد أفتحه.

تم عرض "أداة اختيار الألوان" وهي تخرج من تطبيق Blockbench وتختار لونًا من صورة خلفية سطح المكتب.

تتيح لك أداة Blockbench كونها مفتوحة المصدر، ويمكنك التعرّف على كيفية تنفيذ المطوّرين لواجهة برمجة التطبيقات. الرمز المعني متوفّر باللغة JannisX11/blockbench/blob/master/js/texturing/color.js. تتوفّر أداة Openbench أيضًا كتطبيق Electron.js. يمكنك أن ترى من التعليق أنّه يعالج حالة خاصة لمشكلة في Electron، حيث لا يمكن لأداة اختيار الألوان اختيار لون من خارج النافذة. ولا تشكّل هذه المشكلة مشكلة في واجهة برمجة تطبيقات الويب التي يمكنك الاطّلاع عليها في الجزء المميّز من مقتطف الرمز. ويمكن بسهولة استخدام واجهة برمجة التطبيقات. أنشئ مثيل EyeDropper جديد واستدعِ طريقة open() الخاصة به. يتم حلّ هذه الطريقة باستخدام سلسلة sRGBHex تمثّل اللون المحدّد، بتنسيق sRGB سداسي عشري.

new Action("pick_screen_color", {
  icon: "colorize",
  category: "color",
  condition: () => typeof EyeDropper == "function",
  click: async function () {
    if (Blockbench.platform == "win32") {
      // workaround for https://github.com/electron/electron/issues/27980
      ipcRenderer.send("request-color-picker", {
        sync: settings.sync_color.value,
      });
    } else if (typeof EyeDropper == "function") {
      let dropper = new EyeDropper();
      let { sRGBHex } = await dropper.open();
      ColorPanel.set(sRGBHex);
    }
  },
});

الاستنتاجات

تعد منتقي الألوان جزءًا صغيرًا ولكنه مهم من برنامج الإبداع مثل Blockbench. في أغلب الأحيان، لا يكون اللون المطلوب جزءًا من نافذة التطبيق، ولكن يمكن العثور عليه في مكان ما بالخارج، ربما حتى على شاشة مختلفة. يمكن أن يكون منتقي الألوان الذي لا يتيح لك اختيار الألوان في مثل هذه الحالات قريبًا لعديم الفائدة. تم إنشاء EyeDropper API خصّيصًا لحالات استخدام كهذه، وقد أثبتت نجاحها بشكل كبير في لعبة Blockbench منذ تنفيذها في تشرين الثاني (نوفمبر) 2021. إذا كنت من محبّي لعبة Boxbench، نتمنى لك تجربة ممتعة في اختيار الألوان.