vscode material icon theme
v5.14.1
ในตัวอย่างของเรา เราวางพวกมันไว้ในโฟลเดอร์ icons ภายในโฟลเดอร์ .vscode/extensions :
.vscode
┗ extensions
┗ icons
┣ folder-sample.svg
┗ folder-sample-open.svg
ใน settings.json (การตั้งค่าผู้ใช้เท่านั้น!) ไอคอนโฟลเดอร์สามารถเชื่อมโยงกับชื่อโฟลเดอร์ (เช่น "src") ดังนี้:
"material-icon-theme.folders.associations" : {
"src" : " ../../../../icons/folder-sample "
} นอกจากนี้ยังสามารถโคลนไอคอนโฟลเดอร์ที่มีอยู่และเปลี่ยนสีเพื่อสร้างไอคอนใหม่ที่สามารถเชื่อมโยงกับชื่อโฟลเดอร์ได้ ตัวอย่างต่อไปนี้แสดงวิธีการโคลนไอคอนโฟลเดอร์ admin :
"material-icon-theme.folders.customClones" : [
{
"name" : " users-admin " ,
"base" : " admin " ,
"color" : " light-green-500 " ,
"lightColor" : " light-green-700 " ,
"folderNames" : [ " users " ]
},
{
"name" : " roles-admin " ,
"base" : " admin " ,
"color" : " purple-400 " ,
"folderNames" : [ " roles " ]
}
] สิ่งนี้จะสร้างไอคอนใหม่สองไอคอนที่เรียกว่า users-admin และ roles-admin ซึ่งเชื่อมโยงกับโฟลเดอร์ชื่อ users และ roles ตามลำดับ คุณสมบัติ base กำหนดไอคอนที่ควรโคลน (ในกรณีนี้คือไอคอนโฟลเดอร์ admin ) คุณสมบัติ color กำหนดสีของไอคอนใหม่ คุณสมบัติ lightColor เป็นทางเลือกและกำหนดสีของไอคอนเมื่อ Visual Studio Code ทำงานด้วยธีมสีอ่อน คุณสมบัติ folderNames กำหนดชื่อโฟลเดอร์ที่ควรเชื่อมโยงกับไอคอนใหม่
#RRGGBB ใดๆ สำหรับคุณสมบัติ color และ lightColor ได้ แต่ถ้าคุณต้องการใช้สีจากชุดแบบวัสดุ คุณสามารถตรวจสอบรายการนามแฝงทั้งหมดที่อนุญาตได้ที่นี่base ได้ที่นี่ด้วยการกำหนดค่าต่อไปนี้ คุณสามารถปรับแต่งไอคอนภาษาได้ นอกจากนี้ยังสามารถเขียนทับการเชื่อมโยงที่มีอยู่ได้อีกด้วย
"material-icon-theme.languages.associations" : {
"languageId" : " iconName " ,
"json" : " json "
} คุณสามารถดูชื่อไอคอนที่มีอยู่ในภาพรวมด้านบน ดู "ตัวระบุภาษาที่รู้จัก" ในเอกสารประกอบ VS Code สำหรับรายการค่าที่อนุญาตสำหรับ languageId
กด Ctrl-Shift-P เพื่อเปิดแผงคำสั่งและพิมพ์ Material Icons
| สั่งการ | คำอธิบาย |
|---|---|
| เปิดใช้งานธีมไอคอน | เปิดใช้งานชุดไอคอน |
| เปลี่ยนสีไฟล์ | เปลี่ยนสีของไอคอนไฟล์ |
| เปลี่ยนสีโฟลเดอร์ | เปลี่ยนสีของไอคอนโฟลเดอร์ |
| เปลี่ยนธีมโฟลเดอร์ | เปลี่ยนการออกแบบไอคอนโฟลเดอร์ |
| เปลี่ยนความทึบ | เปลี่ยนความทึบของไอคอน |
| เปลี่ยนความอิ่มตัว | เปลี่ยนค่าความอิ่มตัวของไอคอน |
| กำหนดค่าชุดไอคอน | เลือกชุดไอคอนที่เปิดใช้งานไอคอนเพิ่มเติม (เช่น Angular, React, Ngrx) |
| สลับลูกศร Explorer | แสดงหรือซ่อนลูกศรที่อยู่ถัดจากไอคอนโฟลเดอร์ |
| คืนค่าการกำหนดค่าเริ่มต้น | รีเซ็ตเป็นการกำหนดค่าเริ่มต้น |
| สลับระดับสีเทา | ตั้งค่าความอิ่มตัวของไอคอนเป็น 0 (ระดับสีเทา) หรือ 1 (สี) |
คุณต้องการมีส่วนร่วมหรือไม่?
ดูแนวทางการสนับสนุนและเปิดประเด็นใหม่หรือดึงคำขอบน GitHub
