it-swarm.com.de

Wie bearbeite ich ein dunkles Standarddesign für Visual Studio Code?

Ich verwende Windows 7 64-Bit.

Gibt es eine Möglichkeit, das dunkle Standardthema im Visual Studio-Code zu bearbeiten? Im Ordner% USERPROFILE% .vscode befinden sich nur Themen aus den Erweiterungen, während sich im Installationspfad (ich habe standardmäßig C:\Programme (x86)\Microsoft VS Code verwendet) einige Standardthemen in\resources\app\befinden. Erweiterungen wie Kimbie Dark, Solarized Dark/Light oder Varianten von Monokai, aber es gibt kein Standard-Dark-Theme.

Aber wenn es doch eine Möglichkeit gibt, es zu bearbeiten, welche Codeblöcke sind dann für die Farbe des Objekts, des Zeigers und des Namens der Klasse und der Struktur in der C++ - Sprache verantwortlich?

62
Toreno96

Die gesuchte Datei befindet sich in,

Microsoft VS Code\resources\app\extensions\theme-defaults\themes

unter Windows und suchen Sie nach dem Dateinamen dark_vs.json, um es auf einem anderen System zu lokalisieren.

20
paarandika

Im VS-Code "Benutzereinstellungen" können Sie sichtbare Farben mit den folgenden Tags bearbeiten (dies ist ein Beispiel und es gibt viel mehr Tags).

"workbench.colorCustomizations": {
    "list.inactiveSelectionBackground": "#C5DEF0",
    "sideBar.background": "#F8F6F6",
    "sideBar.foreground": "#000000",
    "editor.background": "#FFFFFF",
    "editor.foreground": "#000000",
    "sideBarSectionHeader.background": "#CAC9C9",
    "sideBarSectionHeader.foreground": "#000000",
    "activityBar.border": "#FFFFFF",
    "statusBar.background": "#102F97",
    "scrollbarSlider.activeBackground": "#77D4CB",
    "scrollbarSlider.hoverBackground": "#8CE6DA",
    "badge.background": "#81CA91"}

Wenn Sie einige C++ - Farbtoken bearbeiten möchten, verwenden Sie das folgende Tag:

"editor.tokenColorCustomizations": {
    "numbers": "#2247EB",
    "comments": "#6D929C",
    "functions": "#0D7C28"
}
54

In Bezug auf die Themen kann VS Code genauso gut bearbeitet werden wie Sublime. Sie können jedes der Standardthemen bearbeiten, die mit VS-Code geliefert werden. Sie müssen nur wissen, wo sich die Themendateien befinden.

Randnotiz: Ich liebe das Thema Monokai. Alles was ich daran ändern wollte, war der Hintergrund. Ich mag den dunkelgrauen Hintergrund nicht. Stattdessen denke ich, dass der Kontrast mit einem festen schwarzen Hintergrund viel besser ist. Der Code springt viel mehr heraus.

Wie auch immer, ich suchte nach der Themendatei und fand sie (in Windows) unter:

c:\Programme (x86)\Microsoft VS Code\Ressourcen\App\Erweiterungen\theme-monokai\themes \

In diesem Ordner fand ich die Monokai.tmTheme-Datei und änderte den ersten Hintergrundschlüssel wie folgt:

<key>background</key>
<string>#000000</string>

Die Designdatei enthält einige Hintergrundschlüssel. Stellen Sie sicher, dass Sie den richtigen bearbeiten. Der, den ich bearbeitet habe, war ganz oben. Zeile 12 denke ich.

26
iviouse

Sie können ein Standarddesign nicht "bearbeiten", es ist "gesperrt".

Sie können es jedoch mit den genauen gewünschten Änderungen in Ihr eigenes benutzerdefiniertes Design kopieren.

Weitere Informationen finden Sie in den folgenden Artikeln: https://code.visualstudio.com/Docs/customization/themeshttps://code.visualstudio.com/docs/extensions/install- Erweiterung # _Ihr-Erweiterungs-Ordner

Wenn Sie nur die Farben für C++ - Code ändern möchten, sollten Sie den Colorizer für die c ++ - Unterstützung überschreiben. Informationen dazu finden Sie hier: https://code.visualstudio.com/docs/customization/colorizer

BEARBEITEN: Das dunkle Thema ist hier zu finden: https://github.com/Microsoft/vscode/tree/80f8000c10b4234c7b027dccfd627442623902d2/extensions/theme-colorful-defaults

EDIT2: Zur Verdeutlichung:

16
Tobiah Zarlez

Jedes Farbschema kann in diesem Einstellungsabschnitt in VS Code Version 1.12 oder höher geändert werden:

 // Overrides colors from the currently selected color theme.
  "workbench.colorCustomizations": {}

Siehe https://code.visualstudio.com/docs/getstarted/themes#_customize-a-color-theme

Verfügbare Werte zum Bearbeiten: https://code.visualstudio.com/docs/getstarted/theme-color-reference

BEARBEITEN: Informationen zum Ändern der Syntaxfarben finden Sie hier: https://code.visualstudio.com/docs/extensions/themes-snippets-colorizers#_syntax-highlighting-colors und hier: https : //www.sublimetext.com/docs/3/scope_naming.html

13
needfulthing

Am einfachsten ist es, die Benutzereinstellungen zu bearbeiten und anzupassen workbench.colorCustomizations

Editing color customizations

Wenn Sie Ihr Thema machen möchten

Es gibt auch die Option, das aktuelle Design zu ändern, wodurch die aktuellen Designeinstellungen kopiert werden und Sie es als JSON5-Datei *.color-theme.json Speichern können

Generate color theme from current settings

10
jay

Ich bin mir nicht sicher, ob diese Antwort hier passt, aber ich möchte eine Lösung für MAC-Benutzer teilen. Es ist unangenehm, wenn ich eine neue Frage starte und mich dort selbst beantworte.

[Lösung für MAC OS]
Suchen Sie nach Ihrem VSCode-Themenpfad wie folgt:

..Ihr_Installationsverzeichnis/Visual Studio Code.app/Contents/Resources/app/extensions/theme-name/themes/theme_file.json

öffnen Sie die JSON-Datei und suchen Sie nach den zu ändernden Zielstilen.
In meinem Fall möchte ich die Whitespace-Renderfarbe ändern
und ich fand es als
"editorWhitespace.foreground"
also unter settings.json in Visual Studio Code,
Ich habe die folgenden Zeilen hinzugefügt (in den Arbeitsbereichseinstellungen),

"workbench.colorCustomizations": {
    "editorWhitespace.foreground": "#93A1A130" // stand as #RRGGBBAA
}

Lösungen geführt von: https://code.visualstudio.com/docs/getstarted/themes#_customize-a-color-theme


Vergiss das nicht ⌘ Command+S Einstellungen speichern, damit sie wirksam werden.

3
elliotching

Die docs haben jetzt einen ganzen Abschnitt darüber.

Verwenden Sie npm, um yo zu installieren, und führen Sie den Befehl yo code Aus. Daraufhin wird ein kleiner textbasierter Assistent angezeigt, mit dem Sie u Bearbeiten Sie eine Kopie des Standardschemas für Dunkelheit.

2
LeeGee

Wie bereits erwähnt, müssen Sie das editor.tokenColorCustomizations oder der workbench.colorCustomizations Einstellung in der settings.json-Datei. Hier können Sie ein Basisthema wie Abyss auswählen und nur die Dinge überschreiben, die Sie ändern möchten. Sie können entweder sehr wenige Dinge wie die Funktion, die Zeichenfolgenfarben usw. sehr leicht außer Kraft setzen.

Z.B. zum workbench.colorCustomizations

"workbench.colorCustomizations": {
    "[Default Dark+]": {
        "editor.background": "#130e293f",
    }
}

Z.B. zum editor.tokenColorCustomizations:

"editor.tokenColorCustomizations": {
    "[Abyss]": {
        "functions": "#FF0000",
        "strings": "#FF0000"
    }
}
// Don't do this, looks horrible.

Bei umfangreichen Anpassungen wie dem Ändern der Farbe des Schlüsselworts var müssen Sie jedoch die Überschreibungswerte unter dem Schlüssel textMateRules angeben.

Z.B. unten:

"editor.tokenColorCustomizations": {
    "[Abyss]": {
        "textMateRules": [
            {
                "scope": "keyword.operator",
                "settings": {
                    "foreground": "#FFFFFF"
                }
            },
            {
                "scope": "keyword.var",
                "settings": {
                    "foreground": "#2871bb",
                    "fontStyle": "bold"
                }
            }
        ]
    }
}

Sie können Themen auch global überschreiben:

"editor.tokenColorCustomizations": {
    "textMateRules": [
        {
            "scope": [
                //following will be in italics (=Pacifico)
                "comment",
                "entity.name.type.class", //class names
                "keyword", //import, export, return…
                //"support.class.builtin.js", //String, Number, Boolean…, this, super
                "storage.modifier", //static keyword
                "storage.type.class.js", //class keyword
                "storage.type.function.js", // function keyword
                "storage.type.js", // Variable declarations
                "keyword.control.import.js", // Imports
                "keyword.control.from.js", // From-Keyword
                //"entity.name.type.js", // new … Expression
                "keyword.control.flow.js", // await
                "keyword.control.conditional.js", // if
                "keyword.control.loop.js", // for
                "keyword.operator.new.js", // new
            ],
            "settings": {
                "fontStyle": "italic"
            }
        }
    ]
}

Weitere Details hier: https://code.visualstudio.com/api/language-extensions/syntax-highlight-guide

0
Varun Achar