다음을 통해 공유


방법: 텍스트 장식 만들기

TextDecoration 개체는 텍스트에 추가할 수 있는 시각적 장식입니다. 네 개의 텍스트 장식으로 밑줄, 기준선, 취소선 및 윗줄이 있습니다. 다음 예제에서는 텍스트를 기준으로 텍스트 장식의 위치를 보여 줍니다.

텍스트 장식 종류의 예

텍스트 장식 위치의 다이어그램

텍스트 장식을 텍스트에 추가하려면 TextDecoration 개체를 만들고 해당 속성을 수정합니다. Location 속성을 사용하여 텍스트 장식이 나타날 위치(예: 밑줄)를 지정합니다. Pen 속성을 사용하여 텍스트 장식의 모양(예: 단색 채우기 또는 그라데이션 색)을 지정합니다. Pen 속성에 대해 값을 지정하지 않는 경우 장식의 기본값은 텍스트와 같은 색으로 지정됩니다. TextDecoration 개체를 정의한 경우 원하는 텍스트 개체의 TextDecorations 컬렉션에 해당 개체를 추가합니다.

다음 예제에서는 선형 그라데이션 브러시 및 파선 펜으로 스타일이 지정된 텍스트 장식을 보여 줍니다.

선형 그라데이션 브러시 및 파선 펜으로 스타일이 지정된 밑줄의 예

선형 그라데이션 밑줄로 텍스트 장식

Hyperlink 개체는 유동 콘텐츠 내에 하이퍼링크를 호스팅할 수 있도록 하는 인라인 수준의 유동 콘텐츠 요소입니다. 기본적으로 HyperlinkTextDecoration 개체를 사용하여 밑줄을 표시합니다. 특히 Hyperlink 개체가 많은 경우 TextDecoration 개체를 인스턴스화할 때 성능이 저하될 수 있습니다. Hyperlink 요소를 광범위하게 사용하는 경우 MouseEnter 이벤트와 같은 이벤트가 트리거될 때만 밑줄이 표시되도록 할 수 있습니다.

다음 예제에서 "My MSN" 링크의 밑줄은 동적입니다. 즉, MouseEnter 이벤트가 트리거될 때만 나타납니다.

TextDecorations로 정의된 하이퍼링크

TextDecoration을 표시하는 하이퍼링크

자세한 내용은 방법: Hyperlink가 있는 텍스트 장식 사용을 참조하십시오.

예제

다음 코드 예제에서 밑줄 텍스트 장식은 기본 글꼴 값을 사용합니다.

        ' Use the default font values for the strikethrough text decoration.
        Private Sub SetDefaultStrikethrough()
            ' Set the underline decoration directly to the text block.
            TextBlock1.TextDecorations = TextDecorations.Strikethrough
        End Sub
// Use the default font values for the strikethrough text decoration.
private void SetDefaultStrikethrough()
{
    // Set the underline decoration directly to the text block.
    TextBlock1.TextDecorations = TextDecorations.Strikethrough;
}
<!-- Use the default font values for the strikethrough text decoration. -->
<TextBlock
  TextDecorations="Strikethrough"
  FontSize="36" >
  The quick red fox
</TextBlock>

다음 코드 예제에서는 단색 브러시를 펜으로 사용하여 밑줄 텍스트 장식을 만듭니다.

        ' Use a Red pen for the underline text decoration.
        Private Sub SetRedUnderline()
            ' Create an underline text decoration. Default is underline.
            Dim myUnderline As New TextDecoration()

            ' Create a solid color brush pen for the text decoration.
            myUnderline.Pen = New Pen(Brushes.Red, 1)
            myUnderline.PenThicknessUnit = TextDecorationUnit.FontRecommended

            ' Set the underline decoration to a TextDecorationCollection and add it to the text block.
            Dim myCollection As New TextDecorationCollection()
            myCollection.Add(myUnderline)
            TextBlock2.TextDecorations = myCollection
        End Sub
// Use a Red pen for the underline text decoration.
private void SetRedUnderline()
{
    // Create an underline text decoration. Default is underline.
    TextDecoration myUnderline = new TextDecoration();

    // Create a solid color brush pen for the text decoration.
    myUnderline.Pen = new Pen(Brushes.Red, 1);
    myUnderline.PenThicknessUnit = TextDecorationUnit.FontRecommended;

    // Set the underline decoration to a TextDecorationCollection and add it to the text block.
    TextDecorationCollection myCollection = new TextDecorationCollection();
    myCollection.Add(myUnderline);
    TextBlock2.TextDecorations = myCollection;
}
<!-- Use a Red pen for the underline text decoration -->
<TextBlock
  FontSize="36" >
  jumped over
  <TextBlock.TextDecorations>
    <TextDecorationCollection>
      <TextDecoration 
        PenThicknessUnit="FontRecommended">
        <TextDecoration.Pen>
          <Pen Brush="Red" Thickness="1" />
        </TextDecoration.Pen>
      </TextDecoration>
    </TextDecorationCollection>
  </TextBlock.TextDecorations>
</TextBlock>

다음 코드 예제에서는 선형 그라데이션 브러시를 파선 펜으로 사용하여 밑줄 텍스트 장식을 만듭니다.

        ' Use a linear gradient pen for the underline text decoration.
        Private Sub SetLinearGradientUnderline()
            ' Create an underline text decoration. Default is underline.
            Dim myUnderline As New TextDecoration()

            ' Create a linear gradient pen for the text decoration.
            Dim myPen As New Pen()
            myPen.Brush = New LinearGradientBrush(Colors.Yellow, Colors.Red, New Point(0, 0.5), New Point(1, 0.5))
            myPen.Brush.Opacity = 0.5
            myPen.Thickness = 1.5
            myPen.DashStyle = DashStyles.Dash
            myUnderline.Pen = myPen
            myUnderline.PenThicknessUnit = TextDecorationUnit.FontRecommended

            ' Set the underline decoration to a TextDecorationCollection and add it to the text block.
            Dim myCollection As New TextDecorationCollection()
            myCollection.Add(myUnderline)
            TextBlock3.TextDecorations = myCollection
        End Sub
// Use a linear gradient pen for the underline text decoration.
private void SetLinearGradientUnderline()
{
    // Create an underline text decoration. Default is underline.
    TextDecoration myUnderline = new TextDecoration();

    // Create a linear gradient pen for the text decoration.
    Pen myPen = new Pen();
    myPen.Brush = new LinearGradientBrush(Colors.Yellow, Colors.Red, new Point(0, 0.5), new Point(1, 0.5));
    myPen.Brush.Opacity = 0.5;
    myPen.Thickness = 1.5;
    myPen.DashStyle = DashStyles.Dash;
    myUnderline.Pen = myPen;
    myUnderline.PenThicknessUnit = TextDecorationUnit.FontRecommended;

    // Set the underline decoration to a TextDecorationCollection and add it to the text block.
    TextDecorationCollection myCollection = new TextDecorationCollection();
    myCollection.Add(myUnderline);
    TextBlock3.TextDecorations = myCollection;
}
<!-- Use a linear gradient pen for the underline text decoration. -->
<TextBlock FontSize="36">the lazy brown dog.
  <TextBlock.TextDecorations>
    <TextDecorationCollection>
      <TextDecoration  
        PenThicknessUnit="FontRecommended">
        <TextDecoration.Pen>
          <Pen Thickness="1.5">
            <Pen.Brush>
              <LinearGradientBrush Opacity="0.5"
                StartPoint="0,0.5"  EndPoint="1,0.5">
                <LinearGradientBrush.GradientStops>
                  <GradientStop Color="Yellow" Offset="0" />
                  <GradientStop Color="Red" Offset="1" />
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>
            </Pen.Brush>
            <Pen.DashStyle>
              <DashStyle Dashes="2"/>
            </Pen.DashStyle>
          </Pen>
        </TextDecoration.Pen>
      </TextDecoration>
    </TextDecorationCollection>
  </TextBlock.TextDecorations>
</TextBlock>

참고 항목

작업

방법: Hyperlink가 있는 텍스트 장식 사용

참조

TextDecoration

Hyperlink