شريط تمرير تحميل أفقي

يبدو الأمر جيدًا!

عند النقر على الروابط في هذه القائمة (خارج القوائم المنسدلة)، لا يزال المؤشر الدوّار يظهر:

إعجاب واحد (1)

حاليًا مضبوطة على 2 بكسل، لكن إذا كنت تستخدم شاشة عالية الدقة مع تكبير (مثل ماك بوك ريتينا)، فقد تبدو أقرب إلى 1 بكسل على شاشتك. سأزيدها إلى 3 بكسل اليوم.

أنت محق، هذا يبدو غير متناسق من حيث تجربة المستخدم في الوقت الحالي. إنه أمر معقد تقنيًا. شريط التحميل متصل حاليًا بموجه التوجيه في إمبير، لذا يظهر فقط عند الانتقال بين مسارات إمبير. بعض حالات “التحميل” داخل واجهة المستخدم ليست في الواقع انتقالات لمسارات إمبير… سأحتاج للتفكير في كيفية جعل هذا أكثر اتساقًا.

9 إعجابات

أتطلع بشدة إلى دعم الدقة العالية (High DPI). ربما تمنح مسؤولي الموقع خيارًا بين شريط التحميل أو ربما دائرة دوّارة مُحدّثة (سعال سعال :wink:

إعجاب واحد (1)

تم رفعه الآن إلى 3 بكسل، لذا يجب أن يكون أكثر وضوحًا قليلاً.

يمكن للمسؤولين تخصيص كل شيء عبر مكون السمة، لذا إذا رغب المواقع في الاحتفاظ بمؤشر التحميل الدوار، فسيكون ذلك ممكنًا :slight_smile:

12 إعجابًا

@ميجنا نشرت Custom Loading Spinner Component وهي طريقة رائعة للاستفادة من أيقونات FontAwesome SVG التي تعمل على جميع مستويات DPI.

7 إعجابات

أحب هذا تمامًا وأوافق @codinghorror على أنه يجب نقله إلى النواة كإعداد افتراضي.

20 إعجابًا

أعتقد أنني قمت بحل هذه المشكلة - يجب أن يختفي مؤشر التحميل من جميع عروض قائمة المواضيع.

9 إعجابات

في جهاز iPad، لا يظهر شريط التحميل على الإطلاق. (iPad الجيل الخامس… أعتقد. iOS 14، تطبيق DiscourseHub)

image

شاهد ملف gif أعلاه

5 إعجابات

اكتشاف رائع، شكرًا لك @CaptainZac. قمت بإجراء بعض التعديلات بحيث يجب أن يعمل الآن في عرض PWA/DiscourseHub على جهاز iPad.

كما أضفت قيمة top البالغة 1 بكسل التي نحتاجها لـ DiscourseHub على جهاز iPhone. أصبح الارتفاع الكامل البالغ 3 بكسل مرئيًا الآن في التطبيق، ويبدو أنه يتطابق بشكل معقول مع شريط التمرير الخاص بـ DiscourseHub نفسه.

7 إعجابات

أعجبني الأمر كثيرًا :+1: عمل رائع حقًا! :slightly_smiling_face:

إعجابَين (2)

يبدو أن شريط التحميل لا ينشط بدلاً من مؤشر التدوير في الصفحة الرئيسية عند النقر على الشعار.

تسجيل الشاشة 2021-02-04 الساعة 21:32:58|فيديو

4 إعجابات

ممتاز، ابدأ استخدامه - شكرًا لك!

إعجابَين (2)

ينبغي أن يكون الأمر محلولاً الآن، شكرًا لك!

7 إعجابات

المشكلة مع أشرطة التمرير هي أنها قد تبدو أبطأ فعليًا (حتى لو كانت الصفحة تُحمّل بسرعة أكبر).

السبب في ذلك هو أنه لا يحدث أي شيء لباقي الصفحة حتى تنتهي الصفحة من التحميل - وهذا يختلف عن نسخة مؤشر التحميل الدائري حيث تصبح الصفحة فارغة فورًا بعد النقر - أي أن شيئًا مهمًا يحدث على الفور مقابل حدوث شيء مهم بعد تأخير.

6 إعجابات

أجل، هذا صحيح، وهو أمر نناقشه داخليًا أيضًا. إبقاء جميع المحتويات القديمة على الشاشة يعني عدم وجود تغذية راجعة فورية بعد النقر على رابط. لقد دفعت للتو تغييرًا يخفّي محتوى الصفحة (جزئيًا) أثناء التحميل. (cc @awesomerobot)

في البداية، كان الاختفاء كاملًا، لكننا كنا ننتهي بصفحة فارغة تمامًا. أعتقد أن الإبقاء على الشفافية عند 20% قد يكون حلًا وسطًا جيدًا. تغذية راجعة كافية، لكن دون أن تكون مزعجة جدًا؟ :thinking:

في الوقت الحالي، يختفي العنصر #main-outlet بالكامل. للأسف، لا أعتقد أن هناك طريقة لاستهداف {{outlet}} للمسار الذي يتم تحميله فعليًا… لكنني أحب أن أثبت خطئي. أعتقد أن الحل الوحيد سيكون استبدال جميع {{outlet}} في كودنا بمكون تغليف مخصص…

18 إعجابًا

كلما تحسّنت أكثر وأكثر… :sunglasses:

7 إعجابات

لعب على مستوى أعلى: سجل المدة المتوسطة التي تستغرقها الطلبات واجعل تأثير التلاشي يستغرق نفس المدة :rofl:

14 إعجابًا

رائع. يبدو الأمر أفضل بكثير. :100::+1:

3 إعجابات

الأمر أفضل مع ديفيد… لكنه لا يزال ‘يبدو’ أبطأ. لست متأكدًا من أن هذا سيتغير ما لم يكن التأثير صارخًا كما هو الحال مع مؤشر التحميل، في الحقيقة. قد يكون هذا أيضًا سمة خاصة بمؤشر التمرير، خاصة إذا اكتمل دائمًا. والسبب في ذلك أن الصفحة ستنتهي من التحميل (أو ستبدو وكأنها انتهت من التحميل) قبل أن يكتمل مؤشر التمرير… ومع ذلك، فإن مؤشر التمرير هو الذي سيصبح مؤشرًا على تحميل الصفحة وليس الصفحة نفسها، وذلك لأنه ملحوظ جدًا.

6 إعجابات

https://meta.discourse.org/u/golaxo/summary
إذا نقرنا من عرض الملف الشخصي إلى شعار Discourse، يختفي الجزء العلوي، وهو ما يبدو غريبًا.

3 إعجابات