Xterm.js: السماح لعكس التحديد

تم إنشاؤها على ١٠ يونيو ٢٠١٧  ·  4تعليقات  ·  مصدر: xtermjs/xterm.js

نظرًا لأنه لم يعد بإمكاننا استخدام ::selection لم يعد هذا ممكنًا كما هو الحال مع الإصدار الحالي من VS Code.

screen shot 2017-06-09 at 4 40 40 pm

هناك نوعان من التحديات عند التعامل مع هذه المشكلة:

  • التحديد مرسوم حاليًا أسفل النص في الصفوف ، والذي يمكن أن يكون له لون خلفية أيضًا. هذا الفصل جيد وسيكون من الجيد إبقاء عرض التحديد منفصلاً تمامًا عن عرض الصفوف.
  • نظرًا لعدم التفاف كل عنصر في .xterm-rows في عنصره الخاص ، فقد يبدأ التحديد أو ينتهي في منتصف العنصر ، مما يقيد بعض الحلول.

فكرة واحدة:

  • استفد من فكرة تقسيم التحديد إلى 3 أجزاء ؛ الصف العلوي والصفوف الوسطى والصف السفلي (كما في https://github.com/sourcelair/xterm.js/pull/691)
  • يمكن تمييز عناصر الصف الأوسط داخل .xterm-rows xterm-invert-selection بفئة
  • يمكن رسم الصفين العلوي والسفلي أعلى الصفوف باستخدام z-index: 1 ويتم إضافة المحتوى الفعلي للصف إلى التحديد. يمكن بعد ذلك إضافة aria-hidden كمقياس جيد لضمان عدم قراءته مرتين.

لست متأكدًا مما إذا كان هذا هو الحل الصحيح ، فأنا لا أحب حقًا تكرار النص في الحل أعلاه ولكنه على الأقل في صفين فقط.

areselection out-of-scope typenhancement
مصدر
picture Tyriar
👍1

التعليق الأكثر فائدة

ليس لدي وقت للعلاقات العامة في الوقت الحالي ، لكنني اكتشفت أننا قد نستخدم خاصية css mix-blend-mode لإنجاز ذلك مع العارض بجهد ضئيل للغاية:

.xterm-selection-layer {
    mix-blend-mode: exclusion;
}

بالإضافة إلى ذلك ، حتى مع لون التحديد غير المعتم ، فإن هذا سيجعل المقدمة والتحديد والخلفية مرئية:

.xterm-selection-layer {
    mix-blend-mode: multiply;
}

لسوء الحظ ، لا يبدو أنه مدعوم من Edge atm.

picture mofux في ٥ يناير ٢٠١٨
👍2

ال 4 كومينتر

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

mofux picture mofux في ٢٥ يوليو ٢٠١٧

هذا شيء لطيف أكثر ، لا أعتقد أننا نرغب في التنازل عن الأداء / الهندسة أو أي شيء لجعل هذا ممكنًا. https://github.com/sourcelair/xterm.js/issues/720 هو أكثر أهمية من المنظمة البحرية الدولية.

Tyriar picture Tyriar في ٢٨ يوليو ٢٠١٧
👍2

ليس لدي وقت للعلاقات العامة في الوقت الحالي ، لكنني اكتشفت أننا قد نستخدم خاصية css mix-blend-mode لإنجاز ذلك مع العارض بجهد ضئيل للغاية:

.xterm-selection-layer {
    mix-blend-mode: exclusion;
}

بالإضافة إلى ذلك ، حتى مع لون التحديد غير المعتم ، فإن هذا سيجعل المقدمة والتحديد والخلفية مرئية:

.xterm-selection-layer {
    mix-blend-mode: multiply;
}

لسوء الحظ ، لا يبدو أنه مدعوم من Edge atm.

mofux picture mofux في ٥ يناير ٢٠١٨
👍2

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

Tyriar picture Tyriar في ٧ أكتوبر ٢٠١٩
هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات

القضايا ذات الصلة

jerch picture jerch  ·  27تعليقات
Tyriar picture Tyriar  ·  73تعليقات
BengBu-YueZhang picture BengBu-YueZhang  ·  63تعليقات
anatoly-spb picture anatoly-spb  ·  24تعليقات
Tyriar picture Tyriar  ·  26تعليقات