как поменять цвет кода в visual studio

Область редактирования кода в Visual Studio

Как большинство интегрированных сред разработки, система Visual Studio 2013 построена на основе главного окна редактирования кода. Со временем система эволюционировала и теперь представляет собой нечто большее, чем простой текстовый редактор. Несмотря на то что большинство разработчиков по-прежнему проводят значительное время, работая над кодом программ в области редактирования, все большее количество проектировщиков имеют возможность решать такие задачи, как создание форм, настройка параметров проекта и редактирование ресурсов. Независимо от того, пишете ли вы код или создаете форму проекта, вам придется провести много времени в системы Visual Studio 2013. По этой причине важно знать, как наладить среду так, чтобы ваша работа была более эффективной.

Одним из важных нововведений, появившемся в Visual Studio 2012, является возможность менять цветовые темы (color themes). Дизайн предыдущих версий Visual Studio изобиловал различными градиентами и графическими эффектами, в то время, как, начиная с версии 2012, появился более «строгий» монотонный графический интерфейс, который используется и в Visual Studio 2013. Благодаря цветовым темам можно изменять графический интерфейс. Существует три основных темы: темная (dark), светлая (light) и синяя (blue). Синяя тема добавлена в Visual Studio 2013 для людей, которые привыкли работать с более старыми версиями Visual Studio.

Шрифты и цвета

Одной из первых настроек, которую презентаторы программ обычно изменяют в системе Visual Studio, стремясь повысить читабельность кода, являются шрифты и цвета в области редактирования. Однако это делают не только презентаторы. Выбрав шрифт и цвет, которые не утомляют глаза, вы можете повысить производительность своей работы. На рисунке ниже показаны узлы Fonts и Colors в диалоговом окне Options, позволяющие настроить шрифт, размер, цвет и стиль разных элементов экрана. Следует лишь помнить, что эти узлы диалогового окна Options загружаются очень долго, поэтому старайтесь не открыть их непреднамеренно.

Для того чтобы изменить визуальное представление конкретного текстового элемента в системе Visual Studio 2013, сначала выберите область интегрированной среды разработки, к которой хотите применить новые настройки. Например, на рисунке был выбран элемент Text Editor. Это предопределило элементы, которые должны были появиться в списке Display Items. Выбрав требуемый элемент в этом списке, настройте шрифт и цвета.

Некоторые элементы этого списка, например Plain Text, используются во многих областях системы Visual Studio 2013, поэтому последствия изменения шрифтов и цветов иногда могут быть непредсказуемыми.

Выбирая шрифт, помните, что пропорциональные шрифты, как правило, не так эффективны для написания программ, как непропорциональные (известные также как моноширинные). Моноширинные шрифты выделены полужирным, что позволяет легко найти их.

Принципы визуального представления

Полноэкранный режим

Если вы используете несколько экранов, то полноэкранный режим может оказаться очень полезным. Открепите инструментальные окна и расположите их на втором мониторе. Когда окно редактирования находится в полноэкранном режиме, вы получаете доступ к инструментальным окнам, не переключая режимы. Если вы открепите окно редактирования кода, оно не перейдет в полноэкранный режим.

Отслеживание изменений

Для того чтобы обогатить возможности редактирования, система Visual Studio 2013 предусматривает отслеживание строк, изменившихся в ходе сеанса редактирования. Когда вы открываете файл для редактирования, ни одна из строк не раскрашена. Но когда вы начнете редактировать текст, то заметите желтую метку возле измененных строк. На рисунке ниже показано, что строка, содержащая ссылку на объект MessageBox, была модифицирована за время, прошедшее с момента последнего сохранения файла:

После сохранения файла в конце измененных строк появится зеленый маркер. На рисунке выше видно, что первая строка, содержащая ссылку на объект MessageBox, была изменена за время, прошедшее с открытия файла, но эти изменения уже записаны на диск. В то же время вторая строка, содержащая ссылку на объект MessageBox, еще не была сохранена.

Источник

Color Themes

Color themes let you modify the colors in Visual Studio Code’s user interface to suit your preferences and work environment.

Selecting the Color Theme

The active color theme is stored in your user settings (keyboard shortcut ⌘, (Windows, Linux Ctrl+, ) ).

Tip: By default, the theme is stored in your user settings and applies globally to all workspaces. You can also configure a workspace specific theme. To do so, set a theme in the Workspace settings.

Color Themes from the Marketplace

There are several out-of-the-box color themes in VS Code for you to try.

Many more themes have been uploaded to the VS Code Extension Marketplace by the community. If you find one you want to use, install it and restart VS Code and the new theme will be available.

You can search for themes in the Extensions view ( ⇧⌘X (Windows, Linux Ctrl+Shift+X ) ) search box using the @category:»themes» filter.

Customizing a Color Theme

Workbench colors

You can customize your active color theme with the workbench.colorCustomizations and editor.tokenColorCustomizations user settings.

You can use IntelliSense while setting workbench.colorCustomizations values or, for a list of all customizable colors, see the Theme Color Reference.

To customize a specific theme only, use the following syntax:

Editor syntax highlighting

To tune the editor’s syntax highlighting colors, use editor.tokenColorCustomizations in your user settings settings.json file:

Note: Directly configuring TextMate rules is an advanced skill as you need to understand on how TextMate grammars work. Go to the Color Theme guide for more information.

Again, to customize a specific theme only, use the following syntax:

Editor semantic highlighting

Some languages (currently: TypeScript, JavaScript, Java) provide semantic tokens. Semantic tokens are based on the language service’s symbol understanding and are more accurate than the syntax tokens coming from the TextMate grammars that are driven by regular expressions. The semantic highlighting that is computed from the semantic tokens goes on top of syntax highlighting and can correct and enrich the highlighting as seen in the following example:

The «Tomorrow Night Blue» color theme without semantic highlighting:

The «Tomorrow Night Blue» color theme with semantic highlighting:

Notice the color differences based on language service symbol understanding:

Users can override the theme setting by:

When semantic highlighting is enabled and available for a language, it is up to the theme to configure whether and how semantic tokens are colored. Some semantic tokens are standardized and map to well-established TextMate scopes. If the theme has a coloring rule for these TextMate scopes, the semantic token will be rendered with that color, without the need for any additional coloring rules.

Additional styling rules can be configured by the user in editor.semanticTokenColorCustomizations» :

To see what semantic tokens are computed and how they are styled, users can use the scope inspector (Developer: Inspect Editor Tokens and Scopes), which displays information for the text at the current cursor position.

More information on semantic tokens and styling rule syntax can be found in the Semantic Highlighting Guide.

Creating your own Color Theme

Creating and publishing a theme extension is easy. Customize your colors in your user settings then generate a theme definition file with the Developer: Generate Color Theme From Current Settings command.

VS Code’s Yeoman extension generator will help you generate the rest of the extension.

See the Create a new Color Theme topic in our Extension API section to learn more.

Remove default Color Themes

You can disable a built-in theme extension as you would any other VS Code extension with the Disable command on the gear context menu.

File Icon Themes

File icon themes can be contributed by extensions and selected by users as their favorite set of file icons. File icons are shown in the File Explorer and tabbed headings.

Selecting the File Icon Theme

By default, the Seti file icon set is used and those are the icons you see in the File Explorer. Once a file icon theme is selected, the selected theme will be remembered and appear again whenever VS Code is restarted. You can disable file icons by selecting None.

VS code ships with two file icon themes; Minimal and Seti. To install more file icon themes, select the Install Additional File Icon Themes item in the file icon theme picker and you’ll see a query for file icon themes (tag:icon-theme) in the Extensions view.

You can also browse the VS Code Marketplace site directly to find available themes.

The active File Icon theme is persisted in your user settings (keyboard shortcut ⌘, (Windows, Linux Ctrl+, ) ).

Creating your own File Icon Theme

You can create your own File Icon Theme from icons (preferably SVG), see the File Icon Theme topic in our Extension API section for details.

Next steps

Themes are just one way to customize VS Code. If you’d like to learn more about VS Code customization and extensibility, try these topics:

Источник

Практическое руководство. Изменение шрифтов и цветов в редакторе в Visual Studio

Вы можете изменить стандартное начертание, размер шрифта, а также цвет переднего плана и фона для различных текстовых отображаемых элементов в редакторе кода. При изменении параметров шрифта учитывайте следующее:

Значения для параметров Шрифт и Размер применяются глобально для всех текстовых элементов во всех редакторах Visual Studio.

Имена моноширинных шрифтов выделены полужирным шрифтом.

Параметры Основной цвет элемента, Фоновый цвет элемента и Полужирный можно задать для каждого типа текстового элемента. Например, если изменить цвета и выбрать значение Полужирный для параметров Комментарий и Закладки, другие типы текстовых элементов останутся неизменными.

Изменение начертания, размера и цвета шрифта по умолчанию

В меню Сервис выберите пункт Параметры. В разделе Окружение выберите Шрифты и цвета.

В поле Параметры для выберите Текстовый редактор.

Измените параметры Шрифт и Размер, чтобы настроить начертание и размер для всех текстовых элементов во всех редакторах.

Выберите соответствующий элемент в области Отображаемые элементы и затем измените параметры Основной цвет элемента и Фоновый цвет элемента.

Щелкните По умолчанию для сброса параметров до значений по умолчанию.

Нажмите кнопку ОК.

Следующие шаги

См. сведения об изменениях шрифта и цвета, которые можно внести в интегрированную среду разработки с помощью диалогового окна Параметры, в статье Страница «Шрифты и цвета», папка «Среда», диалоговое окно «Параметры».

Источник

Практическое руководство. Персонализация интегрированной среды разработки и редактора Visual Studio

Из этой статьи вы узнаете, как переключить цветовую тему Visual Studio по умолчанию на темный режим. Мы также настроим цвета для двух различных типов текста в редакторе кода.

В Visual Studio 2022 Preview мы обновили функциональность цветовых тем, чтобы они соответствовали вашим настройкам Windows. Дополнительные сведения см. в записи блога Гибкие возможности тематики для Visual Studio.

Установите Visual Studio бесплатно со страницы скачиваемых материалов Visual Studio, если еще не сделали этого.

Установите Visual Studio бесплатно со страницы скачиваемых материалов Visual Studio, если еще не сделали этого.

Настройка цветовой темы для интегрированной среды разработки

По умолчанию в пользовательском интерфейсе Visual Studio установлена тема Синяя. Давайте изменим ее на тему Темная.

В строке меню, где расположены разделы Файл и Изменить, выберите Средства > Параметры.

Откройте страницу параметров Окружение > Общие, измените значение Цветовая тема на Темная и щелкните ОК.

Цветовая тема для всей среды разработки (IDE) Visual Studio изменяется на Темная.

Вы можете выбрать дополнительные предопределенные темы, установив редактор цветовых тем Visual Studio из Visual Studio Marketplace. Когда вы установите это средство, в раскрывающемся списке Цветовая тема появятся дополнительные темы.

Вы можете создать собственные темы, установив конструктор цветовых тем Visual Studio из Visual Studio Marketplace.

Изменение цветов текста в редакторе

Теперь настроим несколько цветов текста для редактора. Сначала создадим XML-файл, чтобы просмотреть цвета по умолчанию.

В строке меню выберите Файл > Создать > Файл.

В диалоговом окне Новый файл в разделе Общие выберите XML-файл и нажмите кнопку Открыть.

Обратите внимание, что цвет номеров строк бирюзовый, а атрибутов XML (например id=»bk101″ ) — голубой. Давайте изменим цвет этих элементов.

Чтобы открыть диалоговое окно Параметры, в строке меню выберите Сервис > Параметры.

В разделе Среда выберите категорию Шрифты и цвета.

Обратите внимание, что в поле Показать параметры для указано значение Текстовый редактор,—именно это нам и нужно. Раскройте список, чтобы узнать, для каких еще элементов можно настроить шрифты и цвет текста.

Чтобы изменить цвет номера строки, в списке Отображение элементов выберите Номер строки. В поле Основной цвет элемента выберите Оливковый.

Некоторые языки имеют собственные параметры шрифтов и цветов. Если вы являетесь разработчиком на C++ и хотите изменить цвет, используемый для выделения функций, найдите элемент Функции C++ в списке Отображение элементов.

Прежде чем закрыть диалоговое окно, давайте также изменим цвет атрибутов XML. В списке Отображение элементов прокрутите вниз до элемента Атрибут XML и выберите его. В поле Основной цвет элемента выберите Травяной. Нажмите ОК, чтобы сохранить изменения и закрыть диалоговое окно.

Теперь цвет номеров строк станет оливковым, а цвет XML-атрибутов — ярко-травяным. Если открыть файл другого типа, например файл с кодом C++ и C#, цвет номеров строк также станет оливковым.

Мы изучили только некоторые способы настраивать цвета в Visual Studio. Ознакомьтесь с другими возможностями в диалоговом окне Параметры, чтобы настроить Visual Studio в соответствии со своими предпочтениями.

Источник

Практическое руководство. Изменение шрифтов, цветов и тем в Visual Studio

Шрифты и цвета в Visual Studio можно изменять различными способами. Например, вы можете изменить синюю тему по умолчанию на темную тему (так называемый «темный режим»). При необходимости вы также можете включить контрастную тему и изменить шрифт по умолчанию и размер текста в IDE в и редакторе кода.

Изменение цветовой темы

Изменить цветовую тему фрейма интегрированной среды разработки и окон инструментов в Visual Studio можно следующим образом:

В строке меню выберите Сервис > Параметры.

В списке параметров выберите Среда > Общие.

В списке Цветовая тема выберите тему по умолчанию Синяя, Светлая, Темная или Blue (Extra Contrast) (Синяя (дополнительный контраст)).

При изменении цветовой темы шрифты текста и их размер в интегрированной среде разработки возвращаются к значениям по умолчанию или ранее настроенным значениям.

Можно создавать и редактировать собственные темы Visual Studio, установив редактор цветовых тем для Visual Studio 2017.

Чтобы создавать и редактировать собственные темы Visual Studio, можно установить конструктор цветовых тем Visual Studio.

Изменение шрифтов и размера текста

Шрифт и размер текста можно изменить для всех окон фреймов IDE и инструментов или только для определенных окон и текстовых элементов. Кроме того, шрифт и размер текста можно изменить в редакторе.

Изменение шрифта и размера текста в интегрированной среде разработки

В строке меню выберите Сервис > Параметры.

В списке параметров выберите Среда > Шрифты и цвета.

В списке Показать параметры для выберите Среда.

Если требуется изменить шрифт только для окон инструментов, в списке Параметры для выберите Все окна текстовых инструментов.

Чтобы изменить шрифт и размер текста для интегрированной среды разработки, измените значения параметров Шрифт и Размер.

Выберите соответствующий элемент в области Отображаемые элементы и затем измените параметры Основной цвет элемента и Фоновый цвет элемента.

Изменение шрифта и размера текста в редакторе

В строке меню выберите Сервис > Параметры.

В списке параметров выберите Среда > Шрифты и цвета.

В списке Показать параметры для выберите Текстовый редактор.

Чтобы изменить шрифт и размер текста для редактора, измените значения параметров Шрифт и Размер.

Выберите соответствующий элемент в области Отображаемые элементы и затем измените параметры Основной цвет элемента и Фоновый цвет элемента.

Параметры специальных возможностей

При слабом зрении можно использовать специальные параметры цветовой темы. Параметр высокой контрастности можно использовать для всех приложений и пользовательского интерфейса на компьютере. Дополнительный параметр контрастности также можно использовать только для Visual Studio.

Использование высокой контрастности Windows

Чтобы переключить режим высокой контрастности Windows, используйте одну из следующих процедур:

В Windows или любом приложении Майкрософт нажмите сочетание клавиш Левая клавиша ALT+Левая клавиша SHIFT+PRTSCN.

В ОС Windows последовательно выберите Пуск > Параметры > Специальные возможности > Высокая контрастность.

Параметр высокой контрастности Windows влияет на все приложения и пользовательский интерфейс на компьютере.

Использование параметра дополнительной контрастности для Visual Studio

Чтобы переключить режим дополнительной контрастности в Visual Studio, используйте следующие процедуры:

В строке меню Visual Studio последовательно выберите Сервис > Параметры, а затем в списке параметров выберите Среда > Общая.

В раскрывающемся списке Цветовая тема выберите тему Blue (Extra Contrast) (Синий (дополнительный контраст)), а затем нажмите кнопку ОК.

Дополнительные сведения о других доступных параметрах специальных возможностей Visual Studio см. в этой статье.

Если вам требуется параметр специальных возможностей для цветов или шрифтов, но в настоящее время в Visual Studio он недоступен, сообщите нам, выбрав раздел Предложить функцию на странице сообщества разработчиков Visual Studio. Дополнительные сведения об этом форуме и возможностях его использования см. в статье Предложить функцию для Visual Studio.

Следующие шаги

Дополнительные сведения о всех элементах пользовательского интерфейса, для которых можно изменить шрифт и цветовые схемы, см. в этой статье.

Источник