هل ذلك الزر بارتفاع 40 بكسل أم 44 بكسل؟ هل الهامش 16 بكسل أم 24 بكسل؟ عندما تبني واجهات مستخدم بدقة متناهية أو تراجع التصاميم، تحتاج طريقة لقياس الأشياء على الشاشة بدقة.
من يحتاج مسطرة شاشة؟
- مطورو الواجهات الأمامية: التحقق من أن CSS يطابق مواصفات التصميم
- مصممو UI/UX: فحص المسافات والمحاذاة وأحجام العناصر
- مختبرو ضمان الجودة: التحقق من أن التنفيذ بدقة البكسل يطابق النماذج
- مصممو الجرافيك: قياس النسب في الصور المرجعية
- مديرو المنتجات: إيصال متطلبات البكسل المحددة للمطورين
ما الذي يمكنك قياسه
- عرض وارتفاع العناصر بالبكسل
- المسافة بين عنصرين (الهوامش، الحشو، الفجوات)
- أحجام الخطوط (تقريبي، بقياس ارتفاع الحرف)
- سُمك الحدود وعرض الخطوط
- أحجام الأيقونات
- أبعاد الأزرار
كيفية استخدام مسطرة الشاشة في CaptureX Pro
- افتح CaptureX Pro واختر مسطرة الشاشة (Screen Ruler) من قائمة الأدوات
- تظهر مسطرة شفافة فوق شاشتك
- انقر واسحب لقياس أي مسافة بالبكسل
- يظهر القياس بالعرض × الارتفاع في تسمية تتبع المؤشر
- يعمل عبر جميع التطبيقات والشاشات
بدائل لمسطرة الشاشة المخصصة
أدوات المطور في المتصفح: أداة الفحص في Chrome تعرض أبعاد العناصر، لكنها تعمل فقط داخل المتصفح. لا يمكنك قياس تطبيقات سطح المكتب أو المتصفحات الأخرى أو ملفات التصميم.
لقطات شاشة + محرر صور: التقط لقطة شاشة وافتحها في محرر وعُد البكسلات. تعمل لكنها بطيئة ومملة للقياسات المتعددة.
مسطرة شاشة مخصصة: الخيار الأسرع. تظهر فوق كل شيء وتقيس أي شيء فورًا. بدون تبديل بين التطبيقات.
نصائح للقياس الدقيق
- تحقق من تكبير العرض: إذا كنت على تكبير 125% أو 150%، فإن البكسلات الفعلية تختلف عن بكسلات CSS. يراعي CaptureX Pro تكبير DPI تلقائيًا
- استخدم التكبير للدقة: كبّر المنطقة قبل القياس لدقة متناهية
- قِس من حافة إلى حافة: ابدأ من الحافة الخارجية لعنصر إلى الحافة الخارجية للعنصر التالي للحصول على المسافة الحقيقية
قِس أي شيء على الشاشة
مسطرة الشاشة في CaptureX Pro تقيس المسافات بالبكسل فورًا عبر أي تطبيق.
حمّل النسخة التجريبية