F NAV - ألسمة التنقل في الجوال

:information_source: ملخص F NAV - تبويبات التنقّل على الجوال
:eyeglasses: معاينة Theme Creator
:hammer_and_wrench: المستودع GitHub - VaperinaDEV/f-nav-for-mobile: F NAV - Mobile Navigation Tabs · GitHub
:heart: وجدته مفيدًا؟ > ./support --coffee
:question: دليل التثبيت كيفية تثبيت سمة أو مكوّن سمة
:open_book: جديد على سمات Discourse؟ دليل المبتدئين لاستخدام سمات Discourse

ثبّت مكوّن السمة هذا

مرحبًا :wave:

من قبل، قمت بإنشاء موضوع في قسم Development كمفهوم لمكوّن السمة، والآن أصبح في حالة تسمح له بأن يكون مكوّن سمة مخصصًا (Customization > Theme component).

:warning: يرجى التأكد من اختباره قبل استخدامه في بيئة الإنتاج.

بعض المعلومات حول المكوّن: F NAV - Theme component concept


حول مكوّن السمة. لقد قرأت الكثير من المنشورات التي ذكرت أنه سيكون رائعًا جعل شريط تبويبات Discourse على الجوال أكثر ديناميكية وإضافة القدرة على التعامل مع الإشعارات وما إلى ذلك… يمكن لـ F-NAV القيام بذلك والمزيد…

الترويسة

تُخفي قائمة البورغر (Hamburger)، وقائمة المستخدم، والبحث، والدردشة، وتضيف زر قائمة الملف الشخصي (الصورة الرمزية) الذي يحتوي على محتوى تبويب الملف الشخصي الافتراضي لقائمة المستخدم.

الإعدادات

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

توجد بعض الإعدادات لإظهار/إخفاء أيقونات الترويسة الافتراضية، وهو ما يكون مفيدًا عندما لا ترغب في وضع التبويب الدقيق في F NAV، وبالتالي سيظهر في الترويسة.

التبويبات

من الممكن ربط وظائف مختلفة بالتبويبات. تتيح هذه الوظائف لكل تبويب أن يتغير ديناميكيًا.

Screenshot 2024-12-13 at 13.06.14

تشمل هذه التغييرات:

الوظائف

home

  • يبدّل أيقونة تبويب الصفحة الرئيسية إلى سهم يسار على مسارات الموضوعات، مما يضيف وظيفة للرجوع
    Screenshot 2024-12-13 at 12.29.33
  • يضيف نقطة مؤشر للموضوعات الجديدة أو غير المقروءة
    Screenshot 2024-12-13 at 12.30.52

hamburger (يفتح قائمة البورغر)


multi

multi tab

يتغير تبويب multi تلقائيًا إلى تبويب الرسائل إذا لم تكن الدردشة مفعّلة أو إذا قام المستخدم بإيقافها في
إعدادات المستخدم.

يتغير فقاعة الإشعارات حسب كونها عاجلة أم لا.

إشعارات تبويب multi العاجلة تكون خضراء وتبدو كهذا. :arrow_down_small:


موسّع

الرسائل الشخصية تكون دائمًا خضراء، لكن الدردشة يمكن أن تكون زرقاء كما في الأصل، على سبيل المثال إشعار رسالة قناة غير مقروءة.

موسّع

إشعار واحد


message

  • يضيف زر رسائل مع الإشعارات، وعند النقر عليه تفتح نافذة منبثقة للرسائل للاطلاع السريع

chat

  • يضيف زر دردشة مع وظائفه

notificationToRoute

  • إذا كانت خاصية “عدم الإزعاج” مفعّلة، تتغير أيقونة الجرس إلى أيقونة جرس مشطوب ويظهر وقت انتهاء عدم الإزعاج
    Screenshot 2024-12-13 at 13.02.35

  • يعيد التوجيه إلى صفحة إشعارات الملف الشخصي متجاوزًا قائمة الإشعارات

    • إذا كان هناك إشعار، يعيد التوجيه إلى /notifications?filter=unread
    • إذا لم يكن هناك إشعار، يعيد التوجيه إلى /notifications
    • إذا كان هناك محتوى قابل للمراجعة، ستظهر علامة حمراء ويعيد التوجيه إلى /review

notificationMenu

  • إذا كانت خاصية “عدم الإزعاج” مفعّلة، تتغير أيقونة الجرس إلى أيقونة جرس مشطوب ويظهر وقت انتهاء عدم الإزعاج
    Screenshot 2024-12-13 at 13.02.35

  • يفتح قائمة الإشعارات


search

  • يعيد التوجيه إلى صفحة /search القائمة على السياق

الإعدادات

حاولت جعل الإعدادات بسيطة قدر الإمكان.
ستحتوي على أربعة حقول.

  • name: هذا فقط لتسهيل تحديد التبويب في الإعدادات.
  • icon: يضيف أيقونة إلى التبويب. ملاحظة: إذا اخترت وظيفة، فقد تكون هناك أيقونات لا يمكن تجاوزها بهذا الإعداد.
  • destination: يضيف وجهة لتبويبك المخصص. ملاحظة: إذا اخترت وظيفة، فستتولى هذه الوظيفة التعامل مع الوجهة، لذا يمكنك تركه فارغًا. يتعامل المكوّن مع وجهات /my/... تلقائيًا وتحويلها إلى /u/username/... بحيث يمكن إضافة حالة التبويب النشطة بشكل صحيح.
  • function: اختر وظيفة للتبويب.

يمكن للمشرفين ببساطة إنشاء/إزالة/تغيير التبويبات واختيار إحدى الوظائف أو إضافة وجهة مخصصة للتبويب.
الوظائف :arrow_down_small:

على سبيل المثال، إضافة تبويب إنشاء موضوع ستبدو ببساطة كهذا.


Screenshot 2024-12-12 at 18.55.50


الإسناد: شريط تبويبات Discourse على الجوال وشكرًا للجميع على الملاحظات في موضوع F NAV - مفهوم مكوّن السمة. :heart:

22 إعجابًا

هذا رائع ويجب أن يكون السلوك الافتراضي حقًا وسيوفر إبهامي من محاولة الوصول إلى الجزء العلوي البعيد من شاشتي :mobile_phone:.

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

لقد أجريت على ما يبدو العديد من التعديلات المفيدة جدًا على مكونات سمة التنقل. أود استخدام بعضها، ولكن إلى أي مدى ترى نفسك تحافظ على كل هذا على المدى الطويل؟ أنا أميل كثيرًا إلى استخدام مكونات السمات # الرسمية فقط لضمان الموثوقية.

لم أر مكون سمة شريط علامات التبويب الأصلي الرسمي، لذا سألقي نظرة عليه.

7 إعجابات

شكرا على المكون @don لقد كنت هنا لفترة طويلة، أنت تقوم بعمل رائع حقًا.

3 إعجابات

يجب أن يكون هذا خطأ

إعجابَين (2)

أه شكرًا، هذا يتعلق بسمة FKB. سأقوم بتحديث السمة.

3 إعجابات

إليك الحل: Compatibility: Adds support for F NAV theme component by VaperinaDEV · Pull Request #51 · VaperinaDEV/fkb-pro-theme · GitHub
يرجى تحديث سمة FKB وتمكين هذا الإعداد الجديد.
Screenshot 2024-12-14 at 9.17.02

3 إعجابات

مرحباً @don، كيف يمكنني استخدام أيقونات fa-regular كما في الصورة؟ لقد أجريت بعض الأبحاث ولم أجد أي معلومات حول كيفية القيام بذلك بعد التبديل إلى Fontawesome 6.

3 إعجابات

مرحباً :waving_hand: يجب أن يعمل مع far-bell. كانت لدي خطط لجعلها منتظمة إلى صلبة عند تنشيط علامة التبويب، سأتحقق من ذلك ولكن إذا كنت أتذكر بشكل صحيح فإن أيقونة المنزل لديها فقط شكل صلب في الإصدار المجاني. :thinking:

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

شكراً، لقد قمت بحل مشكلتي. @Don

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

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

إعجابَين (2)

أعتقد أنه يمكننا إضافته إلى دالة أفكر فقط في مكان وضع هذا. يمكن أن تكون هذه علامة تبويب واحدة ويمكنك إضافتها إلى التنقل الذي يظهر فقط في DiscourseHub.

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

في الواقع، يعمل DiscourseHub بشكل جيد مع السحب لأسفل. لم أكن أعرف ذلك فحسب.

إن مسألة زر الصفحة الرئيسية/الرجوع أكبر لأنني بحاجة لشرحها للآخرين.

3 إعجابات

زر الرجوع نشط فقط في المواضيع لتسهيل التنقل بين المواضيع. إنه من وظيفة المنزل التي يمكنك إيقاف تشغيلها، وبعد ذلك سيحافظ هذا على وجهة المنزل.

لا يمكن إعادة ترتيب الإعدادات بعد، وإذا كان لديك تحديد موجود فلا يمكنك مسحه، ولكني أضفت وظيفة جديدة none والتي ستكون بنفس سلوك ترك حقل الوظيفة فارغًا. بهذه الطريقة لا تحتاج إلى إعادة إنشاء علامات تبويب التنقل بأكملها.

هذه هي الطريقة التي يجب أن تكون عليها إذا كنت ترغب في تعطيل زر الرجوع والاحتفاظ بالمنزل في كل مكان.

3 إعجابات

رائع كالعادة. يجب أن أتفق من المعاينة السريعة على منشئ السمة. يجب بالفعل تعبئة هذا في النواة مع تبديل للجوال الكلاسيكي والجوال المحسن.

أرى أن هذا يفتح أشياء مثل شعار موقع لافتة أطول. خيار أنظف للإضافات في الرأس مثل محدد اللغة والمزيد. جميل جدًا كالعادة يا دون!

3 إعجابات

يتم طي أيقونة القلم ومواضيع التنقل مع شريط التنقل.

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

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

لتقديم مثال آخر بسيط، عندما أكون في صفحة الدردشة وأحتاج إلى العودة إلى الصفحة الرئيسية، يجب علي النقر على زر الرجوع في الزاوية العلوية اليسرى، وهو في الواقع ليس سهل الاستخدام على الأجهزة المحمولة.

لذا، هل من الممكن الاحتفاظ بشريط القائمة دائمًا في الأعلى؟

آمل أن يكون وصفي مفهومًا.

إعجابَين (2)

مرحباً ماكس :wave:

هل يمكنك التقاط بعض لقطات الشاشة / تسجيل الشاشة حول المشكلة؟

في /chat، نقوم بإخفاء التنقل ونستخدم رأس الدردشة الافتراضي. لست متأكداً من أن عرض التنقل في الدردشة يستحق العناء لأنه قد يسبب مشاكل في المتصفحات المختلفة ربما، لكنني سأتحقق من ذلك.

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

مرحباً دون :smiley:
شكراً على ردك.
يرجى الرجوع إلى لقطات الشاشة أدناه. أول لقطتي شاشة تعني أنه عندما أريد إغلاق قائمة Hamburger أو Notification، يمكنني فقط النقر على المنطقة الصفراء. المشكلة هي أنه من السهل النقر عن طريق الخطأ على المقالة أو الصورة الرمزية.

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



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

شكراً للتوضيح :blush:

نعم، أفهم. المشكلة هنا ليست في المكون ولكنها مشكلة أساسية عندما تكون قد قمت بتمكين إعداد تقليل الحركة على جهازك. هل هذا ممكّن على جهازك؟

عندما يتم إيقاف تشغيل تقليل الحركة. فإن header-cloak (المنطقة المظلمة خلف القائمة) تمنع إجراء النقر.

عندما أقوم بتمكينه على جهازي، فإنه لا يمنع نقر المستخدم.

إذا كان هذا هو الحال، يمكنك إغلاق القوائم بأمان باستخدام إيماءات السحب أيضًا.

أعتقد أن لدي موضوعًا حول هذه المشكلة في مكان ما :thinking:

هذا هو رأس الدردشة الافتراضي.

سأتحقق مما إذا كان بإمكاننا تمكين التنقل هناك أيضًا.

3 إعجابات