Vscode: أدلة المسافة البادئة لشجرة الدليل في مستكشف الملفات

تم إنشاؤها على ٢٣ ديسمبر ٢٠١٦  ·  124تعليقات  ·  مصدر: microsoft/vscode

من الصعب التنقل خلال مشروع بهيكل دليل معقد.

من الأفضل بكثير النظر إلى شيء مثل هذا:

├─ app
|  └─ main.js
├─ src
|  ├─ main.ts
|  └─ tsconfig.json
└─ package.json

بدلا من هذا:

    main.js
  src
    main.ts
    tsconfig.json
  package.json
feature-request file-explorer on-testplan

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

image

لذا نعم ... عيناي تنزفان. أنا مثل what is index.js of Expression folder... I know you're there! .

أعتقد أنه يجب أن يكون لها أولوية عالية. غالبًا ما تحتوي تطبيقات الويب الحديثة على بنية ملفات متداخلة عميقة. انظر هذا المثال

ال 124 كومينتر

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

وأنا أتفق أيضا! +1

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

@ Aides359 أوافق. عيون الجميع مختلفة. مجرد إلقاء نظرة على علامات التبويب. يحب بعض الأشخاص علامتي تبويب مسافة في التعليمات البرمجية الخاصة بهم. البعض مثل 8. أخرى 4.

أنا أعاني من عسر القراءة قليلاً ، لذلك أجد صعوبة في التعامل مع المسافة البادئة في رمز VS ،

على الرغم من أنه يبدو أنه قد تحسن قليلاً. لكنه لا يزال سيئًا على شاشة الكمبيوتر المحمول ، على سبيل المثال ، بينما في الشاشات الكبيرة في العمل ، يكون هناك مسافة بادئة بشكل ملحوظ.

نعم! يرجى خطوط الشجرة كخيار. سيكون مفيدًا بشكل خاص عندما يكون المحرر مفتوحًا في زاوية بعيدة على شاشة كبيرة.

سيساعد ربط التبديل بالماوس في Explorer Pane في الحفاظ على المظهر النظيف.

حقا مفيد في المشاريع الكبيرة.
أي تحديث على هذا؟ أو أين يمكنني البدء في البحث في المصدر؟

@ edmundo096 تم إغلاق هذا كنسخة مزدوجة # 21295 ، وهي مغلقة أيضًا. لذلك أعتقد أن هذا لن يذهب إلى أي مكان.

cosmoKenney هذه المسألة ليست مغلقة ...

cosmoKenney ، كلا ، هذه هي المشاركة الأصلية ولم يتم حلها. # 21295 كان مكرر.
لم أتمكن من العثور على تكوين لتمكين أدلة المسافة البادئة هذه في مستكشف الشريط الجانبي حتى الآن.

image

لذا نعم ... عيناي تنزفان. أنا مثل what is index.js of Expression folder... I know you're there! .

أعتقد أنه يجب أن يكون لها أولوية عالية. غالبًا ما تحتوي تطبيقات الويب الحديثة على بنية ملفات متداخلة عميقة. انظر هذا المثال

27506535-e5bc7042-58b9-11e7-942c-a592295c143b

وإليك المظهر التقريبي بدون المكبر. ليس سيئا جدا ... إذا كان لديك رؤية طيار مقاتل

أود هذا أيضًا ، من السهل جدًا أن تضيع في المشاريع الأكبر.

أوافق أيضًا على أنه يجب أخذ هذا في الاعتبار ، حتى عندما تبدأ مشروعًا صغيرًا وتعرف كل ملف عن ظهر قلب ، فمن المزعج العثور عليها عندما تريد استخدام المستكشف ، وليس "Quick File Opener" ...

أنا موافق! لقد كنت أحاول البحث عن إعداد أو ملحق يقوم بذلك خلال اليومين الماضيين ولكن لا شيء T_T. أنا أكافح حقًا للتنقل باستخدام المستكشف (مفيد جدًا عند التنقل في مشروع جديد).

ستكون خطوط المسافة البادئة مذهلة!

هل لدينا أي مؤشر إذا كان هذا في خارطة الطريق؟

+1

1+ ، هذا يمثل ألمًا هائلاً بالنسبة لي على شاشتي الكبيرة.

++ 1

+1 ، أحد الأسباب التي قد تجعلني أعود إلى Atom

+1

+1 مايكروسوفت من فضلك!

+1 لهذا.

في غضون ذلك ، اكتشفت القليل من الاختراق لحلها في الوقت الحالي:

ابحث عن تثبيت VSCode (كان لي C:/Program Files/Microsoft VS Code ) وانتقل إلى resources/app/out/vs/workbench وافتح workbench.main.css .

أضف هذه الأسطر إلى نهاية الملف:

.monaco-tree-row[aria-level="1"]  { padding-left:   0px !important; }
.monaco-tree-row[aria-level="2"]  { padding-left:  20px !important; }
.monaco-tree-row[aria-level="3"]  { padding-left:  40px !important; }
.monaco-tree-row[aria-level="4"]  { padding-left:  60px !important; }
.monaco-tree-row[aria-level="5"]  { padding-left:  80px !important; }
.monaco-tree-row[aria-level="6"]  { padding-left: 100px !important; }
.monaco-tree-row[aria-level="7"]  { padding-left: 120px !important; }
.monaco-tree-row[aria-level="8"]  { padding-left: 140px !important; }
.monaco-tree-row[aria-level="9"]  { padding-left: 160px !important; }
.monaco-tree-row[aria-level="10"] { padding-left: 180px !important; }
.monaco-tree-row[aria-level="11"] { padding-left: 200px !important; }
.monaco-tree-row[aria-level="12"] { padding-left: 220px !important; }
.monaco-tree-row[aria-level="13"] { padding-left: 240px !important; }
.monaco-tree-row[aria-level="14"] { padding-left: 260px !important; }
.monaco-tree-row[aria-level="15"] { padding-left: 280px !important; }

فعله!

يقوم هذا الرمز بوضع مسافة بادئة لكل مستوى بمقدار 20 بكسل ، بدءًا من 0 بكسل (يتجاوز !important القيم الافتراضية) ، ولكن بالطبع يمكنك تغيير ذلك من 20 بكسل إلى بقدر ما تريد ، فقط قم بتغيير القيم. لقد تعمقت أيضًا في 15 مستوى فقط ، والتي يمكنك توسيعها أيضًا ، ولكن إذا كان مشروعك أعمق من 15 مستوى ، أقترح عليك إعادة تقييم هيكل الدليل الخاص بك. ؛)

jakewtaylor لقد كان هذا رائعًا بالنسبة لي ، المشكلة الوحيدة هي أنك ستتلقى إشعار "تثبيت تالف" بعد إجراء التغييرات (.. مزيد من المعلومات هنا ).

jakewtaylor @ swordf1zh هل يمكنك تقديم بعض لقطة الشاشة مع هذا "الاختراق"؟

مستوحاة من فكرتك ، لقد ابتكرت أنماطًا مثل:

.monaco-tree .monaco-tree-rows>.monaco-tree-row {
    position: relative;
}

.monaco-tree .monaco-tree-rows>.monaco-tree-row:before {
    content: '';
    top: 0px;
    bottom: 0px;
    position: absolute;
    border-left: 1px dotted rgba(255, 255, 255, 0.4);
    border-bottom: 1px dotted rgba(255, 255, 255, 0.4);
    width: 15px;
    border-radius: 1px;
}

إنه بعيد عن دليل المسافة البادئة الصلبة ، لكنه يمثل خطوة للأمام:
image

@ swordf1zh نعم ، حصلت على ذلك أيضًا ولكن مرة واحدة فقط. لم أره منذ ذلك الحين.

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

@ pie6k سيكون الاختراق حلاً مؤقتًا مثاليًا باستثناء أنه لم يعمل جيدًا بالنسبة لي لسبب ما T_T (انظر الصورة أدناه)

image

jakewtaylor لا يمكن أن تنتظر 😄

لدي شيء يعمل بشكل جيد. كما قلت ، بعيدًا عن الكمال ولكنه يجعل شجرة الملفات أجمل بكثير ، IMO.

لقد وضعت التعليمات في هذا Gist لأن CSS أطول بكثير الآن.

يشبه هذا:
file tree screenshot

آمل أن يعمل لك!

هذا يعمل بشكل جيد جدا.
شكرا لك.

لقد حفظت عيني وعقلي.

تحسن جيد. لقد غيرت ألفا من 0.4 إلى 0.1 ويبدو رائعًا ، لكنه مجرد تفضيل شخصي. إذا كان بإمكانك إنشاء امتداد للخروج من هذا ، فسيكون أحد أفضل 25 امتدادًا بالتأكيد:

imagen

أعتقد أنني سأفعل ذلك ، وسأبحث في الأمر. 😃

تحديث: يبدو أن تعديل واجهة المستخدم باستخدام الإضافات غير ممكن في الوقت الحالي ، فسيتعين عليك فقط استخدام الإرشادات من Gist.

نسيت @ Winston-Guess إخبارك أنك بحاجة إلى position: relative على .monaco-tree .monaco-tree-rows>.monaco-tree-row نفسها.

jakewtaylor @ swordf1zh - تبدو مذهلة 🎉 🕺! لول أخيرا!

يا إله ينقط. لقد بحثت عن هذه الأيام الأربعة الآن. استغرقت بعض الوقت لأفهم أن اسم الشريط الجانبي ليس موناكو. يرجى تنفيذ هذا بأشكال مختلفة.
هذا "النمط الخالي من الخطوط" يدفعني حقًا إلى الشعور بالجنون وعدم رؤية أي خطوط أو أي شيء آخر لتوجيه عيني.
إجراء 1+ لكل من توصل لحل لهذا الأمر.

يا إلهي هذا هو الأفضل. من أين أرسل تبرعا !؟

edenprojectde ماذا تقصد ب "اسم الشريط الجانبي ليس مونكاو"؟ هل لديك أسماء فئات مختلفة على التثبيت الخاص بك؟ يمكنني بسهولة وضع بعض الملاحظات في Gist لمساعدة الناس في المستقبل.

jakewtaylor لا ، أنا فقط أعني أن جميع ملفات Css التي بحثت عنها في واجهة المستخدم الرسومية تحتوي على اسم موناكو ، ولكن لا يوجد إشارة إلى "الشريط الجانبي". لقد غيرت للتو إلى VS Code لذلك لم أكن أعرف / لا أعرف كيف يعمل تكوين واجهة المستخدم ، فهو ليس واضحًا كما كان في الذرة.

فقط لتوضيح هذه النقطة:
grafik
grafik
لا توجد إشارة إلى الشريط الجانبي للاسم في أسماء الفئات هذه.

أفترض أنه بسبب الجزء الخاص به من إطار العمل ، لا شيء يجب أن يقلق VS Code نفسه بشأنه هو بالأحرى افتقاري إلى فهم واجهة المستخدم الرسومية نفسها.

أرى ، لقد عملت فقط باستخدام المفتش

تعليمات خطوة بخطوة (لنظام التشغيل macOS)

  1. قم بتثبيت https://marketplace.visualstudio.com/items؟itemName=be5invis.vscode-custom-css وأعد تشغيل VS Code
  2. احفظ محتويات هذا الجوهر في ملف ما ، في المثال الخاص بي هو /Users/semenov/.vscode/css/tree.css
  3. افتح التفضيلات> الإعدادات ، وأضف هذا الإعداد:
    "vscode_custom_css.imports": [
        "file:///Users/semenov/.vscode/css/tree.css"
    ]
  1. Cmd-P ، "> تمكين CSS و JS المخصص" ، أعد تشغيل VS Code
  2. رفض الرسالة "رمز VS تالف"

بعد ترقية VS Code ، كرر الخطوتين 4 و 5.

IlyaSemenov لسبب ما لا تعمل طريقتك بالنسبة لي سواء في الإصدار العادي أو المطلعين. رأيت في إرشادات الإضافة أن الخطوة 4 تتطلب امتيازات المسؤول ولكن ذلك لم يساعدني أيضًا 😕

يبدو أن الامتداد و CSS المخصص يعملان بالنسبة لي ، لكن ألوان الخطوط موجهة نحو السمات الأكثر قتامة. شاهد لقطة الشاشة ...

code explorer lines

...اقتراحات؟

cosmoKenney نعم ، فقط قم بتغيير CSS في الجوهر .

اللون الحالي هو rgba(255, 255, 255, 0.4) ، وهو أبيض بنسبة 40٪ عتامة - قم بتغيير كل تكرارات ذلك إلى اللون الذي تريده.

قد يعمل rgba(0, 0, 0, 0.4) بشكل جيد للخلفيات الفاتحة (أسود عند درجة تعتيم 40٪)

jakewtaylor :
شكرا جيك. يعمل جيدا.
الآن عليّ فقط معرفة كيفية تفتيح أدلة المسافة البادئة العمودية في جزء المصدر. ؛-)

+1

تضمين التغريدة

راجع للشغل هل يعرف أي شخص حلاً لزيادة المسافة العمودية بين عناصر القائمة؟

هذا مفيد جدًا لذا أتساءل لماذا لم يقم أحد بتمديده؟ سيكون المفضل لدي.

هيا Microsoft ، لقد اكتشفت ذلك في عام 95

image

هذا بالتأكيد يحتاج إلى أن يكون خيارًا مدمجًا قريبًا. لو سمحت :)

التوسع في الأفكار من chentel و @ swordf1zh

سيساعد ربط التبديل بالماوس في Explorer Pane في الحفاظ على المظهر النظيف.

لقد غيرت ألفا من 0.4 إلى 0.1 ويبدو رائعًا

لقد فرغت من جوهر jakewtaylor لتسهيل التنقل. => https://gist.github.com/samdenty/b96f4df576d05cb123248f8ebfa899b6

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

قبل مقابل بعد

image

:root {
  /** Width of the lines **/
  --tree-width: 14px;
  /** Opacity of the lines whilst not hovered **/
  --tree-opacity: 0.05;
  /** Opacity of the lines on hover **/
  --tree-opacity-hover: 0.2;
  /** Color of the lines **/
  --tree-color: rgb(255, 255, 255);
}

هذا ما أبحث عنه.

+1
أي خطط لتنفيذ هذه الميزة التي تشتد الحاجة إليها؟

في رأيي ، يجب أن يكون هذا افتراضيًا ، ومع وجود خيار مدمج لتعطيله 😬

miguelkashir أوافق ، وأعتقد أن عدد الردود على هذا الموضوع تتحدث عن مجلدات الحاجة إلى هذا كميزة مضمنة؟

يوافق. بينما أقدر جهود الأشخاص الذين قدموا حلول CSS ، يجب أن يكون هذا في المنتج. يصبح من الصعب للغاية استخدام المستكشف في مشروع كبير به شاشات كبيرة كما هو الحال في الوقت الحالي. تعال إلى Microsoft - الرجاء الإصلاح!

تتصاعد كطلب مطلوب

+1

إذا كان شخص ما لا يرى أي تغييرات بعد إنشاء ملف CSS مخصص والإشارة إليه في "vscode_custom_css.imports" ، فيمكنك جعله يعمل بشكل أبسط بكثير وبدون تثبيت vscode-custom-css - فقط أضف CSS إلى نهاية الملف workbench.main.css وأنت على ما يرام!

تضمين التغريدة

jakewtaylor نعم ، لكنني اعتقدت أن بعض الأشخاص سيستخدمون الإصدار "المصحح" من @ samdenty99 وملف CSS المخصص لا يعمل مع الجميع ¯_ (ツ) _ / ¯

+1

+1

يا رفاق ، من فضلك توقف عن التعليق +1. إنه أمر مزعج للأشخاص المشتركين الذين ينتظرون الحلول ، فقط رد على المنشور الأولي. 😋

هل هناك خيار لهذا في المدونة - بناء المطلعين؟ تمت الإشارة إلى الإعدادات الجديدة هنا "توفير واجهة المستخدم الرسومية للإعدادات رقم 3355" ولهذا السبب أسأل

fillipvt المشكلة التي ربطتها تتعلق بواجهة المستخدم الرسومية للإعدادات ، هذه المشكلة تتعلق بمظهر مستكشف الملفات. لا أعتقد أنهم مرتبطين؟ (إلا إذا فاتني شيء ...؟)

بعض مدير المستوى 4 في Microsoft:
"أزل الخطوط ، يبدو الأمر أكثر برودة مهما كان ما تفعله طوال اليوم بدون تلك الخطوط القبيحة."

+1

+1
2 الدلائل الفرعية وأشعر بالفعل بالألم

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

+1

من فضلك ، نحن بحاجة إلى مزيد من التحكم في هذا المجال من المحرر! شكرا لك! (بدون الحل المبتكر)

+1

samdenty لا يمكنني الوصول إلى جوهرك. هل تم نقله أو حذفه؟

لقد صنعت شوكة من جوهر jakewtaylor . يبدو هو نفسه samdenty.
https://gist.github.com/thepixture/72f5090e7fab8edae3d1dc1fb59f9f5c

image

بالنسبة لي لقد غيرت المستوى إلى 10.

هناك أيضًا مشكلة صغيرة لا أعرف كيفية إصلاحها. لا أعرف ما إذا كان Samdenty لديه نفس المشكلة. جوهره ليس أكثر.

image

thepixture هذه المشكلة للأسف أحد الآثار الجانبية للطريقة المبتكرة التي تعمل بها - فهي ببساطة تكرر الخط العمودي عدة مرات. رأي شخصي هنا ، ولكن em أكثر أمانًا من px (تم تغيير رأيي المحلي ؛-)).

designbyadrian غيّر اسم المستخدم الخاص بي ، الرابط المحدّث https://gist.github.com/samdenty/b96f4df576d05cb123248f8ebfa899b6

+1

في الإصدار 1.31 ، تم تقديم عنصر واجهة مستخدم جديد للشجرة. هل سيكون عرض أدلة المسافة البادئة أسهل مع هذه الأداة الجديدة؟ تضمين التغريدة

لأي شخص يستخدم امتداد CSS المخصص ، قمت بإصلاحه للعمل مع تحديث يناير 2019 الجديد
كانت هناك 3 إصلاحات رئيسية أضفتها ،

  1. تم تحديث فئة صف الشجرة من monaco-tree-row إلى monaco-list-row
  2. في ملف css المخصص ، السطر 21 ، كان للقاعدة monica-tree-row قاعدة position: relative ، مما تسبب في حدوث مشكلات في التباعد الرأسي
  3. تحتوي .monaco-tl-twistie div على قاعدة margin-left: 40px مضمنة ، والتي كان عليّ تجاوزها (السطر 15)

https://gist.github.com/Lightfire228/39dc2cf403237a190e79a000912691b2

تحرير: لقد استخدمت جوهر samdenty كقاعدة ، ولكن قد تضطر إلى تعديلها لجعلها تبدو "صحيحة"

تحرير 2: لقد أصلحت مشكلة اختفاء الأسطر عند التمرير أو تحديد مجلد يزيد عمقه عن 3

تحرير 3: إذا لعبت بهذا ، يمكنك التعليق على قاعدة monaco-tl-twistie (الأسطر 15-17). لم أكن أعرف أن الإعداد كان موجودًا عندما قمت بإصلاح css (ومع أدلة المسافة البادئة ، أفضل مسافة بادئة أكثر إحكاما من ضبط ذلك على 0)

شكرا @ Lightfire228

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

+1

أنا أردد نفس المشاعر مثل أي شخص آخر ؛ المسافة البادئة لهيكل الشجرة أصغر بكثير من أن تحدد بشكل فعال البنى التحتية.

يرجى إعطائنا بعض الخيارات لتغيير هذا.

إذن هذا جزء من إعدادات vscode الآن ، لكن لماذا يقتصر على 20 كحد أقصى؟

img

لقد جئت من Sublime وأنا معتاد على مسافة بادئة أعمق بكثير ، فهل هناك سبب وجيه لعدم السماح بمسافة بادئة أعمق؟

ss
vscode max 20 Tree Indent left مقابل sublime text 3 right

لقد تخليت كثيرًا عن VS Code. من الصعب جدًا بالنسبة لي رؤية الملفات. وبما أنني حصلت على اشتراك Visual Studio ، فمن غير المنطقي إلى حد كبير استخدام VS 2017. بمجرد إعداده يكون أفضل بكثير من Code.

آه ، شكرًا ، sguilla - القدرة على تغيير حجم المسافة البادئة تعمل على إصلاح معظم المشكلات بالنسبة لي!

لقد بدأت للتو في استخدام VS Code منذ بضعة أسابيع ، ومثل أي شخص آخر ، أجد أنه من الصعب حقًا معرفة الدلائل التي توجد بها ملفات معينة بسرعة.

لقد قمت للتو بتعيين خيار Tree Indent على الحد الأقصى وهو 20 ولكن من الناحية المثالية أريد تعيينه أعلى من ذلك.

لا يزال من الصعب جدًا التنقل في المجلدات بدون خطوط المسافة البادئة لشجرة الدليل كما توصي المنشور الأصلي.

أرى أن هذه القضية من عام 2016 ؛ لقد مرت 3 سنوات ، يرجى إضافة بعض خطوط الأشجار.

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

بالنسبة إلى كل من لم يفعل ذلك ، يرجى "الإعجاب" بتعليق البداية.
بالنسبة للأعداد المفتوحة ، مرتبة حسب الإعجاب ( is:issue is:open sort:reactions-+1-desc ) ، نحن حاليًا في المركز الثامن عشر فقط!
شكرا.

لقد قمت بزيادة المسافة البادئة للشجرة إلى 20 بكسل ، ولكن لسبب ما عندما "أعيد تحميل" كود VS و / أو أغلقه وأعد فتحه ، يعود التباعد إلى التباعد الأصلي البالغ 8 بكسل. يمكنك أن ترى بصريًا قفزة التباعد من إعداد 20 بكسل إلى 8 بكسل.

أنا أيضًا أستخدم سمة أيقونة المواد. عندما أقوم بتعطيل السمة ، لا تزال المشكلة قائمة.

فقط أتساءل عما إذا كان بإمكان شخص ما إنشاء امتداد VS Code لهذا الغرض. للأسف ، ليس لدي خبرة في إنشاء ملحقات VS Code (... حتى الآن)

أحدث المطلعين لدي الآن لديه 40 بكسل كحد أقصى. ما زال يفتقد الشجرة نفسها صعبة 🤷‍♂️

فقط أتساءل عما إذا كان بإمكان شخص ما إنشاء امتداد VS Code لهذا الغرض. للأسف ، ليس لدي خبرة في إنشاء ملحقات VS Code (... حتى الآن)

يوجد امتداد CSS مخصص واحد ، كما هو موضح في التعليقات أعلاه. ولكن تم حظر هذا بواسطة MicroSoft ، سوف تحصل على تحذير [غير مدعوم] في شريط العنوان وسيتوقف عن العمل في كل مرة يتم فيها تحديث كود VS. في انتظار حل رسمي.

+1

يبدو هذا أكثر قابلية للقراءة من الافتراضي:

image

لإصلاح [Unsupported] عند تعديل الأنماط الأصلية ، استخدم https://github.com/lehni/vscode-fix-checksums

_ [Unsupported] يظهر تحذير عند تعديل الملفات الأساسية (ويختلف مجموعها الاختباري عن الأصلي).

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

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

شكرا لهذا الطلب الميزة. ظننت أنني واحد فقط.

الجزء الأسوأ بالنسبة لي هو أن الأسهم لا تتماشى مع العناصر الأخرى على نفس المستوى:
Capture

هذه الميزة حاليًا في المرتبة 12 (عند طلبها من خلال الإبهام)

لقد كان هذا هنا لمدة 2 سنوات ...

+1 ، الرجاء إصلاح هذا ، تعيين طاولة العمل> الشجرة: المسافة البادئة إلى 19 ساعدني ، لكن الرجل! تحدث عن الضياع في شجرة ضخمة ، فقد تعمل بشكل افتراضي مع مجلد واحد ولكن ... ستلاحظ أنه في VS2017 أضافوا خطوط الشجرة إلى عبارات if حتى تتمكن من معرفة مكانك في مستوى {} مسافة بادئة. أين رمز الصداع!

أيضا مشكلة بالنسبة لي! أحتاج إلى سطور من أجل التركيز بشكل أفضل على كتابة التعليمات البرمجية ؛ لا تكافح للعثور على الملفات الصحيحة في كل مرة

لقد وجدت موضوعًا آخر حيث أظهروا أنه تمت معالجة هذا الأمر (عن طريق ضبط المسافة بين الشجرة في الإعدادات)
https://github.com/Microsoft/vscode/issues/35447#issuecomment -455461013

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

الحلول المؤقتة

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

هناك طريقة أخرى تتمثل في أنك إذا كنت تعرف اسم الملف الذي ترغب في فتحه ، فاضغط بسرعة على F1 ثم احذف على لوحة المفاتيح مما يؤدي إلى عرض الملفات في لوحة الأوامر ثم ابدأ في كتابة اسم الملف. من السهل أن يكون هذا أيضًا بحثًا يحتوي على بحث بدلاً من البداية. يمكّنك هذا من رؤية الملفات المتاحة والمجلد الموجود بداخله. يمكنك ضبط window.zoomLevel في ملف settings.json لجعل الأشياء بالحجم الأمثل لكفاءتك.

فكرة إضافية للتنفيذ

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

  • الأحمر - المستوى 1
    - برتقالي - المستوى 2
    - أصفر - المستوى 3
    ---- أخضر - المستوى 4
    ----- الأزرق - المستوى 5
    ------ النيلي - المستوى 6
    ------- بنفسجي - المستوى 7

أود أيضًا أن أرى هذه الميزة تأتي قريبًا إلى VS Code وأحب الاتجاه الذي يسير فيه المشروع. عمل جيد يا رفاق!

اسأل وسيتم تجاهلك

ما زلنا في المركز الثاني عشر ، بالنسبة للمشكلات المفتوحة مرتبة حسب 👍 (ممتاز) ، لكننا نسد الفجوة بسرعة ..

# | العدد المفتوح | : +1: | : -1: | :قلب:
- | ---------- | ---- | ---- | -------
1 | السماح للنوافذ العائمة | 2909 | 40 | 416
2 | علامات تبويب للمحطة المتكاملة | 1293 | 16 | 128
3 | لا يتم تحديث vscode.extensions عند تثبيت / إزالة / تعطيل الملحقات دون إعادة التشغيل | 922 | 0 | 47
4 | السماح بتغيير حجم الخط وخط طاولة العمل | 917 | 1 | 123
5 | تحديث رمز المنتج VS Code | 825 | 18 | 303
6 | Git: استخدم VS Code كمحرر دمج | 669 | 0 | 105
7 | دعم لفتح مجلد مشروع في عدة نوافذ VS Code | 630 | 0 | 72
8 | مسافة بادئة تلقائية / تنسيق رمز / تجميل | 589 | 0 | 45
9 | تسجيل ماكرو | 586 | 0 | 73
10 | إضافة خيار لتثبيت علامات التبويب المشابهة لـ Visual Studio | 553 | 0 | 73
11 | السماح بتخصيص اختصارات الماوس | 521 | 0 | 57
12 | 👉 أدلة المسافة البادئة لشجرة الدليل في مستكشف الملفات 👈 | 503 | 0 | 84
13 | توفير الدعم لمزامنة الإعدادات عبر الأجهزة | 429 | 0 | 62
14 | عرض نتائج البحث في علامة تبويب بدلاً من الشريط الجانبي | 423 | 0 | 73

لأي شخص لم يفعل ذلك ، يرجى 👍 (ممتاز) تعليق البداية.

أتمنى أن يقوم مرسلي البريد العشوائي +1 بمضايقة Github للسماح بإلغاء الاشتراك من التعليقات فقط ، بالطريقة نفسها التي تفعلها هنا: ابتسم:

هل رأيت هذا المنشور؟ https://simonholman.blog/visual-studio-code-finally-has-a-tree-indent-setting/
يبدو أن "أدلة المسافة البادئة لشجرة الدليل في مستكشف الملفات" تعمل الآن.
في الإعدادات ، ابحث عن "مسافة بادئة للشجرة"
إعداد> طاولة العمل> مسافة بادئة للشجرة.

RoelandJimenez نعم ، نناقشها أعلاه. إنها ليست مثل وجود خطوط ، ولكنها خطوة في الاتجاه الصحيح.

يجب أن تحتوي هذه الميزة على كل برنامج به مستكشف ملفات!

أي تحديث؟

Ninroot لا تزعج المطورين مثل هذا. نتلقى تحديثات عندما تحدث مناقشة أو عندما تتغير حالة التذكرة.

الرجاء إضافة هذه الميزة !!!!!!!!!!

+1

أيها الناس ، بحق الله ، من فضلكم أوقفوا هذه التذكرة المزعجة. يعرف فريق VS Code عن هذا الطلب.
إذا كنت تريد أن تقول "+1" ، فما عليك سوى التصويت واختيار رد فعلك (تسليم الرموز التعبيرية). هذه هي الطريقة التي يعمل بها في هذا المستودع

+1

kanlukasz Github أضاف مؤخرًا ميزة جديدة. يمكننا الاشتراك فقط للتغييرات المهمة وليس مقابل +1 me too pls fix !!!!! 🎉🎉🎉🎉🎉🎉🎉🎉🎉

عزيزي +1 مرسلي البريد العشوائي ، لن تكون معي مرة أخرى.

تعليمات خطوة بخطوة (لنظام التشغيل macOS)

  1. قم بتثبيت https://marketplace.visualstudio.com/items؟itemName=be5invis.vscode-custom-css وأعد تشغيل VS Code
  2. احفظ محتويات هذا الجوهر في ملف ما ، في المثال الخاص بي هو /Users/semenov/.vscode/css/tree.css
  3. افتح التفضيلات> الإعدادات ، وأضف هذا الإعداد:
    "vscode_custom_css.imports": [
        "file:///Users/semenov/.vscode/css/tree.css"
    ]
  1. Cmd-P ، "> تمكين CSS و JS المخصص" ، أعد تشغيل VS Code
  2. رفض الرسالة "رمز VS تالف"

بعد ترقية VS Code ، كرر الخطوتين 4 و 5.

حسنًا ، لا يبدو أن لها أي تأثير.

هذا حاليًا في خطة التكرار لشهر يونيو 2019 رقم 75103 كـ "إضافة دعم لأدلة المسافة البادئة في الأشجار".

تم دفع هذا لإتقانه: https://github.com/microsoft/vscode/commit/036278c3ed0ef39274fa68e11e472fbd05f3e9d0 سيصدر غدًا على المطلعين! :العاب ناريه:

Peek 2019-06-18 15-07

يأتي مع إعداد جديد workbench.tree.renderIndentGuides مع الخيارات التالية:

  • none ، فقط لا تقدم أي شيء
  • onHover ، اعرض الأدلة غير الممتعة عند المرور بالماوس فقط. قم دائمًا بتقديم أدلة شيقة (عقد شجرية محددة ومركزة).
  • always ، اعرض كل الأدلة طوال الوقت: شيقة وغير شيقة.

تذكر أن تقوم بتجربته هذا الأسبوع وتقديم ملاحظاتك! مرة أخرى: يجب أن يخرج إلى المطلعين غدًا.

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

├─ app
|  └─ main.js
├─ src
|  ├─ main.ts
|  └─ tsconfig.json
└─ package.json

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

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

joaomoreno يبدو رائعًا ، ولكن سيكون رائعًا إذا كانت هذه الأدلة أكثر وضوحًا

image

الآن بالكاد أستطيع رؤيته

الآن بالكاد أستطيع رؤيته

يجب أن يكون هناك خيار لتركهم كما هم الآن.

joaomoreno يجب أن تكون هناك إعدادات أقل من workbench.colorCustomizations كما هو الحال في أدلة محرر المسافة البادئة ، مما يسمح ببعض التخصيصات التي يطلبها الأشخاص.

KamasamaK :

    "workbench.colorCustomizations": {
        "tree.indentGuidesStroke": "#ff0000"
    }

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

أحب الخيار بين "لا شيء" و "onHover" الذي يعرض دائمًا الأدلة الشيقة ، لكنه لا يعرض الأدلة غير الشيقة عند المرور فوقها.

سيكون رائعًا أيضًا عند التمرير لتمييز جميع المجلدات الرئيسية للملف الذي تم تمريره

إذا كنت ترغب في الحصول على بديل لائق لهذا اليوم :

"workbench.tree.indent": 32

image

اضبط حسب الحاجة.

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات