Visual Studio Code converteix l'edició i l'escriptura de codi nou en una experiència divertida i sense problemes. El tema fosc predeterminat de VS Code va ser dissenyat per ser més fàcil per als ulls que un fons blanc dur i normal que pot causar fatiga després de llargues hores de treball. Però, què passa si no t'agraden realment els colors foscos de la pantalla mentre treballes?
L'avantatge del disseny modular de VS Code és que teniu una gran llibertat per canviar el tema fosc original amb moltes opcions de personalització diferents que abasten la gamma de colors de la pantalla, tipus de lletra i fins i tot l'aspecte del terminal integrat de VS Code.
Aquest article us explicarà tot el que necessiteu saber sobre el canvi de temes a VS Code.
Com canviar el tema al codi VS
Canviar el tema general a VS Code és ràpid i fàcil. Aquí teniu el que heu de fer:
- Obriu el codi VS.
- Seleccioneu "Fitxer" ("Codi" a macOS), seleccioneu "Preferències" i, a continuació, trieu "Tema de color".
- VS Code us mostrarà una selecció de temes preconstruïts per triar en un menú desplegable.
- Utilitzeu les tecles del cursor per veure com es veu cada tema directament a la pantalla.
- Premeu "Enter" mentre seleccioneu per triar el tema que voleu utilitzar.
Canviar el tema a un altre preconfigurat pot ser el primer que feu quan obriu VS Code per primera vegada. La codificació pot trigar molt de temps, de manera que és beneficiós utilitzar un tema amb el qual us sentiu còmode i que no us faci mal als ulls mentre treballeu.
Com canviar el tema del vostre terminal a VS Code
Si voleu respectar les diverses opcions preconfigurades per al color i el tema del terminal, el procés és el mateix que canviar el tema general. Tots els temes integrats inclouen opcions per canviar l'aparença del vostre terminal, però no podeu separar-lo de les altres parts del mateix tema des del menú principal.
Abans d'utilitzar els passos esmentats per canviar el tema, obriu la consola del terminal (Ctrl + Maj + P) per previsualitzar els canvis fets al terminal. Alguns temes no fan cap canvi al terminal, mentre que altres poden canviar-lo dràsticament. A més, utilitzar un tema que us agradi només moderadament tampoc no és bo, ja que potser us trobeu fent servir el terminal més del que pensàveu inicialment.
Tanmateix, hi ha algunes solucions que us permetran canviar el tema del terminal, que tractarem a les seccions següents.
Com canviar el tema del material al codi VS
La característica principal de VS Code és la sobreabundància d'extensions interessants per personalitzar la vostra experiència de codificació i oferir més funcionalitats a l'editor de text. Una d'aquestes extensions és el tema Material, un dels més populars d'aquest tipus al VS Code Marketplace.
Material Theme té molts avantatges respecte als dissenys personalitzats prèviament, però alguns usuaris poden trobar-lo a faltar. El manual d'usuari d'aquesta extensió inclou uns quants consells sobre com fer més canvis segons les vostres necessitats. A continuació s'explica com canviar el tema general al tema Material:
- Obriu el menú ràpid (Ctrl + Maj + P).
- Escriviu "tema" al missatge.
- Trieu "Preferències: Tema de color".
- Seleccioneu un dels valors predefinits del tema de material.
Establir un color d'accent farà que una part del codi aparegui, cosa que pot ser útil si es tracta d'una línia especialment important o problemàtica per diagnosticar. Per establir un color d'accent, seguiu els passos següents:
- Obriu el menú ràpid (Ctrl + Maj + P).
- Escriviu "tema de material" a la sol·licitud.
- Trieu "Tema de material: estableix el color d'accent".
- Trieu el color que us agradi de la llista.
Amb un tema de material canviat, podeu obtenir una personalització que estigui per sobre de la norma, i us mostrarem com.
Com personalitzar manualment un tema a VS Code
VS Code permet personalitzar molt més que simplement canviar entre uns quants valors predefinits. Aquí teniu dues maneres de personalitzar el tema segons el vostre gust.
Mètode 1: descarregueu un tema personalitzat
Quan parlem de personalització, no podem passar sense esmentar l'ampli VS Code Marketplace. Existeixen diverses extensions que només canvien l'aparença de VS Code sense interferir amb la seva funcionalitat. A continuació s'explica com descarregar un tema.
- Obriu el VS Code Marketplace. També podeu utilitzar el menú "Extensions" integrat a l'esquerra de la pantalla.
- Escriviu "tema" a la barra de cerca per explorar només aquells elements que canvien el tema. Una de les nostres recomanacions principals és el tema de material esmentat anteriorment, però estem segurs que en trobareu el que més us convingui.
- Baixeu l'extensió (si feu servir un navegador) i després instal·leu el fitxer .VSIX anant a "Extensions > icona de punts suspensius > Instal·la des de VSIX". De manera alternativa, quan trobeu el tema que us agrada a VS Code, feu-hi clic i, a continuació, seleccioneu el botó "Instal·lar" al menú de detalls (dreta).
- Un cop instal·lat i habilitat el tema, seleccioneu-lo amb l'ordre "Preferències: Tema de color".
Mètode 2: edició del tema
Tots els temes i configuracions s'emmagatzemen a VS Code mitjançant text sense format. Seguiu els passos per accedir a aquesta configuració i feu els canvis que vulgueu:
- Creeu un banc de treball o un fitxer de configuració d'usuari. El primer només canviarà l'aspecte del projecte actual, però el segon es mantindrà en els nous projectes.
- Escriviu l'ordre "Preferències: Obre la configuració" al menú principal.
- Seleccioneu la pestanya a la part superior esquerra per triar entre la configuració de l'usuari i la del banc de treball.
- Premeu "Edita a settings.json" per obrir el fitxer que conté la configuració que heu de canviar.
- Cerqueu la configuració anomenada "workbench.colorCustomizations".
- Centra't a canviar el tema que vulguis posant-hi
“[Nom_tema]”: { }
Theme_name és el nom del tema que voleu canviar. Guardeu les cometes.
- Es fan més canvis al tema als nous parèntesis. Escriviu el nom del paràmetre que voleu canviar (entre cometes), escriviu ":" i després trieu la configuració adequada que necessiteu.
- Utilitzeu aquesta guia per trobar els paràmetres que voleu canviar.
- Els colors s'emmagatzemen en codi hexadecimal. Utilitzeu una guia hexadecimal de colors per identificar el color que voleu.
- Quan hàgiu acabat amb els canvis, deseu el fitxer.
Aquest mètode es pot utilitzar per canviar la major part de la interfície d'usuari i l'aparença del codi, inclòs el color del tema base, els fons, l'aparença del terminal, els colors dels botons i els estils de lletra.
Si us pregunteu com canviar el tipus de lletra al codi VS, utilitzeu el mètode 2 descrit anteriorment. Probablement necessitareu una guia de tipus de lletra.
PMF addicionals
On s'emmagatzemen els temes de VS Code?
Els temes que provenen de les extensions s'emmagatzemen a la carpeta d'extensions de VS Code. Aquesta ubicació es troba al vostre directori d'instal·lació (per exemple C:) i normalment es pot trobar aquí:
~/.vscode/extensions
Aquí, "~" és el directori d'instal·lació de VS Code.
Els temes base s'emmagatzemen a: Microsoft VS Code\resources\app\extensions\theme-defaults\themes
Tanmateix, no cal que passis temps buscant fitxers per canviar. Canviar la configuració de l'usuari mitjançant el fitxer "settings.json" oferirà resultats molt més ràpids.
Com puc canviar el color del comentari al codi VS?
Per canviar els colors dels comentaris, obriu el fitxer "settings.json" (utilitzeu el "Mètode 2" descrit més amunt), seleccioneu el tema que voleu canviar i, a continuació, introduïu (amb cometes):
“comments”: “#hexcode”
Aquí, "codi hexadecimal" és el codi del color desitjat. Utilitzeu un selector de colors per triar el color adequat.
Quin és el millor tema de VS Code?
El millor tema de VS Code és el que trobeu més agradable i útil per als vostres esforços de programació. Diferents usuaris poden tenir preferències de colors i temàtiques diferents. Afortunadament, hi ha moltes opcions per triar, ja sigui en temes preconfigurats, descàrregues d'extensions o en la possibilitat de personalitzar un tema exactament al vostre gust.
Tria el teu tema
Amb aquestes instruccions, podeu personalitzar completament un tema com vulgueu. Amb la seva riquesa d'opcions, VS Code segueix sent un dels editors de text més populars i la seva capacitat per obtenir noves funcions amb extensions el fa molt semblant a un IDE.
Quins temes feu servir a VS Code? Heu fet algun canvi al vostre tema preferit? Feu-nos-ho saber a la secció de comentaris a continuació.
