ฉันจะพับหรือยุบส่วนของโค้ดใน Visual Studio Code ได้อย่างไร

คุณสมบัตินี้รองรับหรือไม่

ตอบ

พับได้ถูกรีดออกและจะดำเนินการตั้งแต่ตอนนี้ Visual Studio รหัสรุ่น 0.10.11 มีแป้นพิมพ์ลัดเหล่านี้:

  • พับส่วนที่ไม่ยุบด้านในสุดที่เคอร์เซอร์:

    • Ctrl+ Shift+ [บน Windows และ Linux
    • + + [บน macOS
  • แฉแฉพื้นที่ยุบที่เคอร์เซอร์:

    • Ctrl+ Shift+ ]บน Windows และ Linux
    • + + ]บน macOS
  • พับทั้งหมดพับทุกภูมิภาคในตัวแก้ไข:

    • Ctrl+ ( K=> 0) (ศูนย์) บน Windows และ Linux
    • + ( K=> 0) (ศูนย์) บน macOS
  • Unfold Allขยายขอบเขตทั้งหมดในตัวแก้ไข:

    • Ctrl+ ( K=> J) บน Windows และ Linux
    • + ( K=> J) บน macOS

ข้อมูลอ้างอิง: https://code.visualstudio.com/docs/getstarted/keybindings

ตั้งแต่ Visual Studio Code เวอร์ชัน 1.12.0 เมษายน 2017 โปรดดูส่วนBasic Editing > Foldingในเอกสาร

คีย์เริ่มต้นคือ:

Fold All: CTRL+K, CTRL+0 (zero)

Fold Level [n]: CTRL+K, CTRL+[n]*

Unfold All: CTRL+K, CTRL+J

Fold Region: CTRL+K, CTRL+[

Unfold Region: CTRL+K, CTRL+]

* ระดับการพับ: หากต้องการพับทั้งหมดยกเว้นคลาสที่อยู่นอกสุด ให้ลองCTRL+ K, CTRL+1

Macs: ใช้แทนCTRL(ขอบคุณ Prajeet)

การพับโค้ดตาม ภูมิภาคมาถึงแล้วในเวอร์ชัน 1.17 พับเอกสารภูมิภาค และv1.19และ1.23 .

[โดยทั่วไปคุณสามารถเพิ่มพื้นที่เช่น// region and // endregionไป//region and //endregionและมันก็ยังจะทำงาน.]

TypeScript/JavaScript: //#region and //#endregion or // #region and // #endregion
C#:                    #region and #endregion
C/C++:                 #pragma region and #pragma endregion
F#:                    //#region and //#endregion
PowerShell:            #region and #endregion
Python:                #region and #endregion
VB:                    #Region and #End Region
PHP:                   #region and #endregion
Bat:                   ::#region and ::#endregion or REM #region and REM #endregion
Markdown:              <!-- #region --> and <!-- #endregion -->
Golang                 //region and //endregion or //#region and //#endregion
Java                   //#region and //#endregion
CSS/SCSS/Less:         /* #region */ and /* #endregion */ or /*#region*/ and /*#endregion*/
SCSS/Less:             // #region and // #endregion
Go:                    // region, // endregion and // #region, // #endregion
shellscript:           # region and # endregion
Perl5                  #region and #endregion or =pod and =cut`

สำคัญ: หากคุณไม่เห็นภาษาของคุณในรายการ::

Each language also has snippets available for the markers. Type '#' and invoke code completion to see them. To have region markers configured for your language, contact the language extension provider.

พิมพ์#แล้วกดCtrl+ Spaceเพื่อดูเครื่องหมายภูมิภาคสำหรับภาษาใดก็ได้


คุณลักษณะนี้มีอยู่ในรุ่นมาตรฐานแล้ว ในการทำให้ตัวควบคุมการยุบ/ขยายปรากฏขึ้น คุณต้องวางเมาส์เหนือพื้นที่ทางด้านขวาของหมายเลขบรรทัดตามที่แสดงในภาพหน้าจอนี้:

ใส่คำอธิบายภาพที่นี่

คุณควรเพิ่มการตั้งค่าผู้ใช้:

{
    "editor.showFoldingControls": "always",
    "editor.folding": true,
    "editor.foldingStrategy": "indentation", 
}

ctrl+ k+ 0: พับทุกระดับ (เนมสเปซ คลาส เมธอด บล็อก)

ctrl+ k+ 1: นัมสเปซ

ctrl+ k+ 2: คลาส

ctrl+ k+ 3: วิธีการ

ctrl+ k+ 4: บล็อค

ctrl+ k+ [หรือ]: บล็อกเคอร์เซอร์ปัจจุบัน

ctrl+ k+ j: กางออก

หากไม่มีทางลัดใดทำงาน (เช่นสำหรับฉัน) วิธีแก้ปัญหา คุณสามารถเปิดจานคำสั่ง ( Ctrl+ 3หรือ View -> Command Palette...) แล้วพิมพ์fold all:

ใส่คำอธิบายภาพที่นี่

ทางลัดเริ่มต้นสำหรับการยุบ/ขยายคือ:

Ctrl+ Shift+ [: "พับ"

Ctrl+ Shift+ Alt+ [: "พับทั้งหมด"

Ctrl+ Shift+ ]: "แฉ"

Ctrl+ Shift+ Alt+ ]: "แฉทั้งหมด"

หรือไปที่ keybindings.json แล้วเปลี่ยนตามที่คุณต้องการ

ตัวอย่างเช่น:

{
    "key": "cmd+k cmd+m",
    "command": "editor.foldAll",
    "when": "editorFocus"
},
{
    "key": "cmd+m cmd+k",
    "command": "editor.unfoldAll",
    "when": "editorFocus"
},

รองรับการยุบในรีลีส 1.0 :

Source Code Folding Shortcuts

There are new folding actions to collapse source code regions based on their folding level.

There are actions to fold level 1 (Ctrl+K Ctrl+1) to level 5 (Ctrl+K Ctrl+5). To unfold, use Unfold All (Ctrl+Shift+Alt+]).

The level folding actions do not apply to region containing the current cursor.

ฉันมีปัญหาในการค้นหา]ปุ่มบนแป้นพิมพ์ (รูปแบบนอร์เวย์) และในกรณีของฉันคือÅปุ่ม (หรือปุ่มซ้ายสองปุ่มและปุ่มหนึ่งลงล่างโดยเริ่มจากปุ่ม Backspace)

ด้วยจาวาสคริปต์:

//#region REGION_NAME
   ...code here
//#endregion

คุณลักษณะนี้จะสนับสนุนในขณะนี้เนื่องจากVisual Studio รหัส 1.17 หากต้องการพับ/ยุบบล็อกโค้ดของคุณ เพียงเพิ่มแท็กภูมิภาค เช่น//#region my block nameและ//#endregionหากเข้ารหัสใน TypeScript/JavaScript

ตัวอย่าง:

ภูมิภาคพับ

ตัวควบคุมการพับโค้ดภายในตัวแก้ไขเพื่อขยายโหนดของเอกสารที่มีโครงสร้าง XML และซอร์สโค้ดใน VsCode

ไม่มีคำแนะนำทางเทคนิคที่นี่ เพียงแค่ปรับการตั้งค่า VsCode อย่างง่าย

ฉันจัดการเพื่อแสดงการควบคุมการพับโค้ดเสมอใน VsCode โดยไปที่การตั้งค่าและค้นหา 'การพับ' ตอนนี้เพียงแค่เลือกให้แสดงการควบคุมเหล่านี้เสมอ ใช้งานได้กับโค้ด typescript และ HTML ของเทมเพลตในโซลูชัน Angular 8 ที่ฉันทดสอบด้วย

สิ่งนี้ได้รับการทดสอบกับ VsCode Insiders 1.37.0 ที่ทำงานบนระบบปฏิบัติการ Windows 10

แสดงการควบคุมการพับโค้ดเสมอใน VsCode

v1.42 กำลังเพิ่มการปรับแต่งที่ดีให้กับรูปลักษณ์และการทำงานของการพับ ดูhttps://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_42.md#folded-range-highlighting :

Folded Range Highlighting

Folded ranges now are easier to discover thanks to a background color for all folded ranges.

พับไฮไลท์

Fold highlight color Theme: Dark+

The feature is controled by the setting editor.foldingHighlight and the color can be customized with the color editor.foldBackground.

"workbench.colorCustomizations": { "editor.foldBackground": "#355000" }

Folding Refinements

Shift + Click on the folding indicator first only folds the inner ranges. Shift + Click again (when all inner ranges are already folded) will also fold the parent. Shift + Click again unfolds all.

พับกะคลิก

When using the Fold command (kb(editor.fold))] on an already folded range, the next unfolded parent range will be folded.

ในเวอร์ชัน 1.3.1 (2016-07-17) Block Collapse จะสะดวกกว่ามาก

บรรทัดใดๆ ที่ตามด้วยบรรทัดที่เยื้องจะมีอักขระ '-' เพื่อให้สามารถยุบได้ หากบล็อกถูกยุบ บล็อกนั้นจะถูกแทนที่ด้วยอักขระ '+' ซึ่งจะเปิดบล็อกที่ยุบ

( Ctrl+ Shift+ Alt+ ]) จะยังคงมีผลกับบล็อคทั้งหมด ปิดหนึ่งระดับ การใช้ซ้ำแต่ละครั้งปิดขึ้นอีกระดับหนึ่ง ( Ctrl+ Shift+ Alt+ [) ทำงานในทางตรงกันข้าม

ไชโย ในที่สุดการล่มสลายของบล็อกก็ใช้งานได้จริง

สำหรับ Mac จะเป็นปุ่มคำสั่ง RHS Kไม่ใช่ด้านซ้ายสำหรับคำสั่งพับโค้ด

มิฉะนั้น ปุ่ม Command ทางซ้ายมือจะลบบรรทัดปัจจุบันK.

ส่วนขยาย VSCode: ระดับการพับหนึ่งปุ่มพับไปยังระดับที่คุณต้องการ

ใส่คำอธิบายภาพที่นี่

ฉันหวังว่า Visual Studio Code สามารถจัดการ:

#region Function Write-Log
Function Write-Log {
    ...
}
#endregion Function Write-Log

ตอนนี้ Visual Studio Code ไม่สนใจมันและจะไม่ยุบมัน ในขณะเดียวกัน Notepad ++ และ PowerGUI ก็จัดการได้ดี

อัปเดต: ฉันเพิ่งสังเกตเห็นการอัปเดตสำหรับ Visual Studio Code ขณะนี้ได้รับการสนับสนุนแล้ว!

นี่คือคีย์แมปเริ่มต้นที่เป็นประโยชน์มากที่สุดของโค้ด VS และคุณสามารถปรับแต่งได้อย่างง่ายดายด้วยคีย์แมปของคุณเอง กำลังเขียนโค้ดอยู่ 😊😊😊

Fold All: CTRL + 0

Unfold All: CTRL + J

Fold Region: CTRL + [

Unfold Region: CTRL + ]

Fold Level 1: CTRL+ 1

Fold Level 2: CTRL+ 2

Fold Level 3: CTRL+ 3

Fold Level 1: CTRL+ 4

Note: these shortcuts only work as expected if you edit your keybindings.json

ฉันไม่พอใจกับทางลัดเริ่มต้น ฉันต้องการให้มันทำงานดังนี้:

  • พับ: Ctrl+ Alt+]
  • พับซ้ำ: Ctrl+ ⇧ Shift+ Alt+]
  • พับทั้งหมด: Ctrl+ kแล้วก็Ctrl+]
  • แฉ: Ctrl+ Alt+[
  • แฉซ้ำ: Ctrl+ ⇧ Shift+ Alt+[
  • แฉทั้งหมด: Ctrl+ kแล้วCtrl+[

ในการตั้งค่า:

  • เปิดPreferences: Open Keyboard Shortcuts (JSON)( Ctrl+ ⇧ Shift+ p)
  • เพิ่มตัวอย่างต่อไปนี้ในไฟล์นั้น

    Already have custom keybindings for fold/unfold? Then you'd need to replace them.

    {
        "key": "ctrl+alt+]",
        "command": "editor.fold",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+alt+[",
        "command": "editor.unfold",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+shift+alt+]",
        "command": "editor.foldRecursively",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+shift+alt+[",
        "command": "editor.unfoldRecursively",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+k ctrl+[",
        "command": "editor.unfoldAll",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+k ctrl+]",
        "command": "editor.foldAll",
        "when": "editorTextFocus && foldingEnabled"
    },

หรือหากต้องการถอดปุ่มพับออกเพื่อเพิ่มพื้นที่:

"editor.folding": false

(เพิ่มในsettings.jsonไฟล์ของคุณ)