Walkthrough: Customize the text view

Applies to: yesVisual Studio noVisual Studio for Mac

Note

This article applies to Visual Studio 2017. If you're looking for the latest Visual Studio documentation, see Visual Studio documentation. We recommend upgrading to the latest version of Visual Studio. Download it here

You can customize a text view by modifying any of the following properties in its editor-format map:

  • Indicator margin

  • Insertion caret

  • Overwrite caret

  • Selected text

  • Inactive selected text (that is, selected text that's lost focus)

  • Visible whitespace

Prerequisites

Starting in Visual Studio 2015, you do not install the Visual Studio SDK from the download center. It's included as an optional feature in Visual Studio setup. You can also install the VS SDK later on. For more information, see Install the Visual Studio SDK.

Create a MEF project

  1. Create a C# VSIX project. (In the New Project dialog, select Visual C# / Extensibility, then VSIX Project.) Name the solution ViewPropertyTest.

  2. Add an Editor Classifier item template to the project. For more information, see Create an extension with an editor item template.

  3. Delete the existing class files.

Define the content type

  1. Add a class file and name it ViewPropertyModifier.

  2. Add the following using directives:

    using System;
    using System.Collections;
    using System.Windows;
    using System.Windows.Media;
    using System.ComponentModel.Composition;
    using Microsoft.VisualStudio.Text.Classification;
    using Microsoft.VisualStudio.Text.Editor;
    using Microsoft.VisualStudio.Utilities;
    
    Imports System
    Imports System.Collections
    Imports System.Windows
    Imports System.Windows.Media
    Imports System.ComponentModel.Composition
    Imports Microsoft.VisualStudio.Text.Classification
    Imports Microsoft.VisualStudio.Text.Editor
    Imports Microsoft.VisualStudio.Utilities
    
  3. Declare a class named TestViewCreationListener that inherits from IWpfTextViewCreationListener. Export this class with the following attributes:

    • ContentTypeAttribute to specify the type of content to which this listener applies.

    • TextViewRoleAttribute to specify the role of this listener.

      [Export(typeof(IWpfTextViewCreationListener))]
      [ContentType("text")]
      [TextViewRole(PredefinedTextViewRoles.Document)]
      internal class TestViewCreationListener : IWpfTextViewCreationListener
      
      <Export(GetType(IWpfTextViewCreationListener)), ContentType("text"), TextViewRole(PredefinedTextViewRoles.Document)>
      Friend Class TestViewCreationListener
          Implements IWpfTextViewCreationListener
      
  4. In this class, import the IEditorFormatMapService.

    [Import]
    internal IEditorFormatMapService FormatMapService = null;
    
    <Import()>
    Friend FormatMapService As IEditorFormatMapService = Nothing
    

Change the view properties

  1. Set up the TextViewCreated method so that the view properties are changed when the view is opened. To make the change, first find the ResourceDictionary that corresponds to the aspect of the view you want to find. Then, change the appropriate property in the resource dictionary and set the properties. Batch the calls to the SetProperties method by calling the BeginBatchUpdate method before you set the properties and then the EndBatchUpdate after you set the properties.

    public void TextViewCreated(IWpfTextView textView)
    {
        IEditorFormatMap formatMap = FormatMapService.GetEditorFormatMap(textView);
    
        ResourceDictionary regularCaretProperties = formatMap.GetProperties("Caret");
        ResourceDictionary overwriteCaretProperties = formatMap.GetProperties("Overwrite Caret");
        ResourceDictionary indicatorMargin = formatMap.GetProperties("Indicator Margin");
        ResourceDictionary visibleWhitespace = formatMap.GetProperties("Visible Whitespace");
        ResourceDictionary selectedText = formatMap.GetProperties("Selected Text");
        ResourceDictionary inactiveSelectedText = formatMap.GetProperties("Inactive Selected Text");
    
        formatMap.BeginBatchUpdate();
    
        regularCaretProperties[EditorFormatDefinition.ForegroundBrushId] = Brushes.Magenta;
        formatMap.SetProperties("Caret", regularCaretProperties);
    
        overwriteCaretProperties[EditorFormatDefinition.ForegroundBrushId] = Brushes.Turquoise;
        formatMap.SetProperties("Overwrite Caret", overwriteCaretProperties);
    
        indicatorMargin[EditorFormatDefinition.BackgroundColorId] = Colors.LightGreen;
        formatMap.SetProperties("Indicator Margin", indicatorMargin);
    
        visibleWhitespace[EditorFormatDefinition.ForegroundColorId] = Colors.Red;
        formatMap.SetProperties("Visible Whitespace", visibleWhitespace);
    
        selectedText[EditorFormatDefinition.BackgroundBrushId] = Brushes.LightPink;
        formatMap.SetProperties("Selected Text", selectedText);
    
        inactiveSelectedText[EditorFormatDefinition.BackgroundBrushId] = Brushes.DeepPink;
        formatMap.SetProperties("Inactive Selected Text", inactiveSelectedText);
    
        formatMap.EndBatchUpdate();
    }
    
    Public Sub TextViewCreated(ByVal textView As IWpfTextView) Implements IWpfTextViewCreationListener.TextViewCreated
    
        Dim formatMap As IEditorFormatMap = FormatMapService.GetEditorFormatMap(textView)
    
        Dim regularCaretProperties As ResourceDictionary = formatMap.GetProperties("Caret")
        Dim overwriteCaretProperties As ResourceDictionary = formatMap.GetProperties("Overwrite Caret")
        Dim indicatorMargin As ResourceDictionary = formatMap.GetProperties("Indicator Margin")
        Dim visibleWhitespace As ResourceDictionary = formatMap.GetProperties("Visible Whitespace")
        Dim selectedText As ResourceDictionary = formatMap.GetProperties("Selected Text")
        Dim inactiveSelectedText As ResourceDictionary = formatMap.GetProperties("Inactive Selected Text")
    
        formatMap.BeginBatchUpdate()
    
        regularCaretProperties(EditorFormatDefinition.ForegroundBrushId) = Brushes.Magenta
        formatMap.SetProperties("Caret", regularCaretProperties)
    
        overwriteCaretProperties(EditorFormatDefinition.ForegroundBrushId) = Brushes.Turquoise
        formatMap.SetProperties("Overwrite Caret", overwriteCaretProperties)
    
        indicatorMargin(EditorFormatDefinition.BackgroundColorId) = Colors.LightGreen
        formatMap.SetProperties("Indicator Margin", indicatorMargin)
    
        visibleWhitespace(EditorFormatDefinition.ForegroundColorId) = Colors.Red
        formatMap.SetProperties("Visible Whitespace", visibleWhitespace)
    
        selectedText(EditorFormatDefinition.BackgroundBrushId) = Brushes.LightPink
        formatMap.SetProperties("Selected Text", selectedText)
    
        inactiveSelectedText(EditorFormatDefinition.BackgroundBrushId) = Brushes.DeepPink
        formatMap.SetProperties("Inactive Selected Text", inactiveSelectedText)
    
        formatMap.EndBatchUpdate()
    End Sub
    

Build and test the code

  1. Build the solution.

    When you run this project in the debugger, a second instance of Visual Studio is started.

  2. Create a text file and type some text.

    • The insertion caret should be magenta and the overwrite caret should be turquoise.

    • The indicator margin (to the left of the text view) should be light green.

  3. Select the text you typed. The color of the selected text should be light pink.

  4. While the text is selected, click anywhere outside the text window. The color of the selected text should be dark pink.

  5. Turn on visible whitespace. (On the Edit menu, point to Advanced and then click View White Space). Type some tabs in the text. Red arrows that represent the tabs should be displayed.

See also