Zmień kolor podświetlenia tekstu w Visual Studio Code

W tej chwili jest to słabo widoczna szara nakładka. Jakiś sposób na zmianę domyślnego koloru?

Aktualizacja Zobacz odpowiedź @Jakub Zawiślak na VScode 1.12+

Stara odpowiedź

Visual Studio Code wywołuje ten wybór podświetleniem i niestety nie sądzę, aby obecnie można było dostosowywać kolor. Motywy mogą kontrolować kolor „zaznaczenia”, ale kolor „zaznaczenia zaznaczenia” jest zakodowany na stałe.

Zobacz ten problem, śledząc możliwe rozwiązanie: https://github.com/Microsoft/vscode/issues/1636

(Na marginesie, możesz przełączać tę funkcję lub wyłączać ją za pomocą tego editor.selectionHighlightustawienia.)

Dodaj następujące wiersze do ustawienia „Editor: Token Color Customizations” w pliku settings.json.

"workbench.colorCustomizations": {
    "editor.selectionBackground": "#135564",
    "editor.selectionHighlightBackground": "#135564"
},

Więcej opcji można znaleźć w sekcji Odniesienia do kolorów motywu

Powyższe odpowiedzi obejmują Selected texti areas with same content as selection, ale brakuje im Current Search Matchi Other Search Matches- które mają ten sam problem .

"workbench.colorCustomizations": {
    "editor.findMatchBackground": "#00cc44a8", //Current SEARCH MATCH
    "editor.findMatchHighlightBackground": "#ff7b00a1" //Other SEARCH MATCHES
}

Zwróć uwagę, że powyższe ustawienia wpłyną również na kolory podczas korzystania z opcji Zmień wszystkie wystąpienia CtrlF2 (bardzo przydatne polecenie, które inteligentnie wybiera wszystkie wystąpienia ciągu, umieszczając kursory w każdym miejscu w celu edycji wielu instancji) .

AKTUALIZACJA:

Dla tych, którzy używają popularnego rozszerzenia Zakładki numerowane - możesz teraz zmienić kolor tła linii dodanych do zakładek - sprawia, że ​​ich zauważenie jest niezwykle łatwe. Dodaj tę linię do swojego settings.json (również w workbench.colorCustomizations ):

        "numberedBookmarks.lineBackground": "#007700"

I nie przegap przydatnej wskazówki Henry'ego Zhu w jego odpowiedzi poniżej (pamiętaj, aby zagłosować za jego odpowiedź, jeśli uznasz ją za pomocną) . I dodaje końcówkę Henry'ego z ustawieniami powyżej i znajdź ogólny efekt poprawie.

Przykład typowego pliku ustawień, post mod:

    {
        "git.enableSmartCommit": prawda,
        "git.autofetch": prawda,
        "breadcrumbs.enabled": true,
        "git.confirmSync": fałsz,
        "explorer.confirmDelete": false,
        "code-runner.saveFileBeforeRun": true,
        "code-runner.saveAllFilesBeforeRun": true,
        "workbench.activityBar.visible": true,
        "files.trimTrailingWhitespace": true,
        "telemetry.enableTelemetry": false,
        "scm.providers.visible": 0, // 0 umożliwia ręczną zmianę rozmiaru paneli kontroli źródła
        "workbench.colorCustomizations": {
            "editor.selectionBackground": "# e788ff7c", // Aktualnie WYBRANY tekst
            "editor.selectionHighlightBackground": "# ff00005b", // Ta sama treść co zaznaczenie
            "editor.findMatchBackground": "# 00cc44a8", // Bieżące WYSZUKIWANIE
            "editor.findMatchHighlightBackground": "# ff7b00a1", // Inne WYSZUKIWANIE MATERIAŁÓW
            "numberedBookmarks.lineBackground": "# 007700"
            // Wskazówka Henry'ego jest tutaj ... (nie zapomnij dodać przecinka do linii powyżej)
        }
    }

Gdzie znaleźć plik settings.json:

Depending on your platform, the user settings file is located here:

Windows %APPDATA%\Code\User\settings.json
macOS $HOME/Library/Application Support/Code/User/settings.json
Linux $HOME/.config/Code/User/settings.json

ALTERNATYWNA metoda otwierania pliku settings.json:

1. Ctrl +, (przecinek), aby otworzyć Ustawienia

2. stoł warsztatowy

3. Edytor ustawień

4. W polu wyszukiwania u góry wklej workbench.colorCustomizations

5. Po lewej stronie kliknij, Workbencha następnieAppearance

6. Kliknij link po prawej stronie: Edit in settings.json

Bibliografia:

https://code.visualstudio.com/api/references/theme-color#editor-colors

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

https://code.visualstudio.com/docs/getstarted/settings

Jeśli ktoś to znajdzie i tak jak ja nie był w stanie uruchomić powyższej konfiguracji, spróbuj to zrobić.

1. przejdź do pliku> Preferencje> ustawienia
2. wpisz modyfikacje kolorów tokena edytora wyszukiwania
3. pod nagłówkiem Dostosowywanie kolorów tokena edytora
4. kliknij edytuj w settings.json
5. w kolumnie po prawej stronie wybierz ustawienia użytkownika
6. wklej to do obiektu json

Pamiętaj, aby zastąpić znaki # kolorami, które chcesz zobaczyć.

"workbench.colorCustomizations": {
    "editor.lineHighlightBackground": "#<color1>",
    "editor.selectionBackground": "#<color2>",
    "editor.wordHighlightBackground": "#<color3>",
    "editorCursor.foreground": "#<color4>"
},

Moje rozumienie powyższej konfiguracji.

editor.lineHighlightBackground - po kliknięciu na linię jest to kolor jej tła.

„editor.selectionBackground” - to jest tło dopasowanych zaznaczeń w innym miejscu bufora. Pomyśl o zmiennej o nazwie foo i jest ona używana w całym pliku. Następnie zaznacz ten tekst, a wszystkie inne elementy na stronie będą miały ten kolor.

„editor.wordHighlightBackground” - jest to kolor zaznaczonego tekstu, jeśli domyślne słowo podświetlenia po kliknięciu nie działa. Widziałem, że ta wartość ma znaczenie tylko wtedy, gdy klikniesz słowo, które nie jest wybierane automatycznie.

editorCursor.foreground - to jest kolor twojego kursora.

Jak przetestowałem, ustawienie koloru obramowania jest łatwiejsze do odczytania niż ustawienie koloru tła, co robi Sublime Text.

Na przykład dodaj te wiersze w settings.json:

"workbench.colorCustomizations": {
    "editor.selectionHighlightBorder": "#FFFA",
},

Wybrane słowa zostaną wyświetlone w następujący sposób:

możesz go zmienić na swój ulubiony kolor poprzez:

Kroki

1. Otwórz kod wizualny
2. Idź do menu plików
3. Preferencje -> Ustawienia

po otwarciu ustawień zaktualizujesz ustawienia w prawej kolumnie, skopiuj i wklej ten kod w nawiasach głównych { ... }

"workbench.colorCustomizations": {
    "editor.selectionBackground": "#f00", // red color hexadecimal code
    "editor.selectionHighlightBackground": "#fff" // white hex code
},

Jeśli ktoś znalazł się czytając odpowiedź @ FujiRoyale, ponieważ żaden z pozostałych nie działał, i zastanawiał się, dlaczego jego / jej również nie działa, ale ponieważ ostatnio zastanawiałem się, dlaczego, poszedłem za ich odpowiedzią i (z wersją 1.18 vscode ) to jako user settingskonfiguracja:

{
    // Is git enabled
    "git.enabled": true,
    // Path to the git executable
    "git.path": "C:\\Users\\t606964\\AppData\\Local\\Programs\\Git\\mingw64\\bin\\git.exe",
    "workbench.startupEditor": "newUntitledFile",
    // other settings
    //
    "editor.fontSize": 12,
    "editor.tabSize": 2,
    "git.confirmSync": false,
    "workbench.colorTheme": "Monokai",
    "editor.fontWeight": "bold",
    "editor.formatOnSave": true,
    "editor.formatOnPaste": true,
    "workbench.iconTheme": "vscode-icons",
    "explorer.confirmDelete": false,
    "files.autoSave": "off",
    "workbench.colorCustomizations": {
        "editor.lineHighlightBackground": "#f00",
        "editor.selectionBackground": "#0f0",
        "editor.wordHighlightBackground": "#00f",
        "editorCursor.foreground": "#ff0"
    }
}

Zwróć uwagę na wcięcia i przecinki oraz usunięcie podwójnych cudzysłowów z ich odpowiedzi (z którymi musiałem się bawić, aby uzyskać poprawną odpowiedź, co nie było tak jasne z odpowiedzi). Nie powinno być potrzeby ponownego uruchamiania vscode, ale warto File > Autosavezajrzeć i sprawdzić, czy zaczniesz otrzymywać podstawowe kolory. A potem wybierz lepsze kolory dla swoich pasemek.

Możesz również sprawić, by to zadziałało workspace settings, wklejając

"workbench.colorCustomizations": {
    "editor.lineHighlightBackground": "#f00",
    "editor.selectionBackground": "#0f0",
    "editor.wordHighlightBackground": "#00f",
    "editorCursor.foreground": "#ff0"
}

pomiędzy istniejącymi {}w tym okienku ustawień po prawej stronie.