Compartilhar via


Como: Criar diferentes padrões lado a lado com um TileBrush

Este exemplo mostra como usar a propriedade TileMode de um TileBrush para criar um padrão.

A propriedade TileMode permite que você especifique como o conteúdo de um TileBrush é repetido, ou seja, desenhado lado a lado para preencher uma área de saída. Para criar um padrão, defina o TileMode como Tile, FlipX, FlipY ou FlipXY. Você também deve definir o Viewport do TileBrush para que seja menor do que a área que você está pintando; caso contrário, apenas um único "azulejo" é produzido, independentemente da configuração de TileMode.

Exemplo

O exemplo a seguir cria cinco objetos DrawingBrush, dá a cada um deles uma configuração de TileMode diferente e os utiliza para pintar cinco retângulos. Embora esse exemplo use a classe DrawingBrush para demonstrar o comportamento de TileMode, a propriedade TileMode funciona de forma idêntica para todos os objetos TileBrush, ou seja, para ImageBrush,VisualBrush e DrawingBrush.

A ilustração a seguir mostra a saída que esse exemplo produz.

Padrões lado a lado criados com a propriedade TileMode

Saída de exemplo de disposição lado a lado de TileBrush

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace BrushesIntroduction
{
    public class TileModeExample : Page
    {

        public TileModeExample()
        {
            Background = Brushes.White;
            Margin = new Thickness(20);
            StackPanel mainPanel = new StackPanel();
            mainPanel.HorizontalAlignment = HorizontalAlignment.Left;

            //
            // Create a Drawing. This will be the DrawingBrushes' content.
            //
            PolyLineSegment triangleLinesSegment = new PolyLineSegment();
            triangleLinesSegment.Points.Add(new Point(50, 0));
            triangleLinesSegment.Points.Add(new Point(0, 50));
            PathFigure triangleFigure = new PathFigure();
            triangleFigure.IsClosed = true;
            triangleFigure.StartPoint = new Point(0, 0);
            triangleFigure.Segments.Add(triangleLinesSegment);
            PathGeometry triangleGeometry = new PathGeometry();
            triangleGeometry.Figures.Add(triangleFigure);

            GeometryDrawing triangleDrawing = new GeometryDrawing();
            triangleDrawing.Geometry = triangleGeometry;
            triangleDrawing.Brush = new SolidColorBrush(Color.FromArgb(255, 204, 204, 255));
            Pen trianglePen = new Pen(Brushes.Black, 2);
            triangleDrawing.Pen = trianglePen;
            trianglePen.MiterLimit = 0;
            triangleDrawing.Freeze();

            //
            // Create the first TileBrush. Its content is not tiled.
            //
            DrawingBrush tileBrushWithoutTiling = new DrawingBrush();
            tileBrushWithoutTiling.Drawing = triangleDrawing;
            tileBrushWithoutTiling.TileMode = TileMode.None;

            // Create a rectangle and paint it with the DrawingBrush.
            Rectangle noTileExampleRectangle = createExampleRectangle();
            noTileExampleRectangle.Fill = tileBrushWithoutTiling;

            // Add a header and the rectangle to the main panel.
            mainPanel.Children.Add(createExampleHeader("None"));
            mainPanel.Children.Add(noTileExampleRectangle);

            //
            // Create another TileBrush, this time with tiling.
            //
            DrawingBrush tileBrushWithTiling = new DrawingBrush();
            tileBrushWithTiling.Drawing = triangleDrawing;
            tileBrushWithTiling.TileMode = TileMode.Tile;

            // Specify the brush's Viewport. Otherwise,
            // a single tile will be produced that fills
            // the entire output area and its TileMode will
            // have no effect.
            // This setting uses realtive values to
            // creates four tiles. 
            tileBrushWithTiling.Viewport = new Rect(0, 0, 0.5, 0.5);

            // Create a rectangle and paint it with the DrawingBrush.
            Rectangle tilingExampleRectangle = createExampleRectangle();
            tilingExampleRectangle.Fill = tileBrushWithTiling;
            mainPanel.Children.Add(createExampleHeader("Tile"));
            mainPanel.Children.Add(tilingExampleRectangle);

            //
            // Create a TileBrush with FlipX tiling.
            // The brush's content is flipped horizontally as it is
            // tiled in this example
            //
            DrawingBrush tileBrushWithFlipXTiling = new DrawingBrush();
            tileBrushWithFlipXTiling.Drawing = triangleDrawing;
            tileBrushWithFlipXTiling.TileMode = TileMode.FlipX;

            // Specify the brush's Viewport.
            tileBrushWithFlipXTiling.Viewport = new Rect(0, 0, 0.5, 0.5);

            // Create a rectangle and paint it with the DrawingBrush.
            Rectangle flipXTilingExampleRectangle = createExampleRectangle();
            flipXTilingExampleRectangle.Fill = tileBrushWithFlipXTiling;
            mainPanel.Children.Add(createExampleHeader("FlipX"));
            mainPanel.Children.Add(flipXTilingExampleRectangle);

            //
            // Create a TileBrush with FlipY tiling.
            // The brush's content is flipped vertically as it is
            // tiled in this example
            //
            DrawingBrush tileBrushWithFlipYTiling = new DrawingBrush();
            tileBrushWithFlipYTiling.Drawing = triangleDrawing;
            tileBrushWithFlipYTiling.TileMode = TileMode.FlipX;

            // Specify the brush's Viewport.
            tileBrushWithFlipYTiling.Viewport = new Rect(0, 0, 0.5, 0.5);

            // Create a rectangle and paint it with the DrawingBrush.
            Rectangle flipYTilingExampleRectangle = createExampleRectangle();
            flipYTilingExampleRectangle.Fill = tileBrushWithFlipYTiling;
            mainPanel.Children.Add(createExampleHeader("FlipY"));
            mainPanel.Children.Add(flipYTilingExampleRectangle);

            //
            // Create a TileBrush with FlipXY tiling.
            // The brush's content is flipped vertically as it is
            // tiled in this example
            //
            DrawingBrush tileBrushWithFlipXYTiling = new DrawingBrush();
            tileBrushWithFlipXYTiling.Drawing = triangleDrawing;
            tileBrushWithFlipXYTiling.TileMode = TileMode.FlipXY;

            // Specify the brush's Viewport.
            tileBrushWithFlipXYTiling.Viewport = new Rect(0, 0, 0.5, 0.5);

            // Create a rectangle and paint it with the DrawingBrush.
            Rectangle flipXYTilingExampleRectangle = createExampleRectangle();
            flipXYTilingExampleRectangle.Fill = tileBrushWithFlipXYTiling;
            mainPanel.Children.Add(createExampleHeader("FlipXY"));
            mainPanel.Children.Add(flipXYTilingExampleRectangle);

            Content = mainPanel;
        }

        //
        // Helper method that creates rectangle elements.
        //
        private static Rectangle createExampleRectangle()
        {
            Rectangle exampleRectangle = new Rectangle();
            exampleRectangle.Width = 50;
            exampleRectangle.Height = 50;
            exampleRectangle.Stroke = Brushes.Black;
            exampleRectangle.StrokeThickness = 1;
            return exampleRectangle;
        }

        //
        // Helper method that creates headers for the examples. 
        //
        private static TextBlock createExampleHeader(String text)
        {
            TextBlock header = new TextBlock();
            header.Margin = new Thickness(0, 10, 0, 0);
            header.Text = text;
            return header;
        }
    }
}
<!-- Demonstrates TileMode values. -->
<Page  
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:PresentationOptions="https://schemas.microsoft.com/winfx/2006/xaml/presentation/options" 
  xmlns:mc="https://schemas.openxmlformats.org/markup-compatibility/2006"
  mc:Ignorable="PresentationOptions"
  Background="White" Margin="20">
  <Page.Resources>

    <!-- Define a Drawing as a resource that it can be easily used
         as content for all the DrawingBrush objects in this example. -->
    <GeometryDrawing x:Key="TriangleDrawing"
      Geometry="M0,0 L50,0 0,50Z" Brush="#CCCCFF"
      PresentationOptions:Freeze="True" >
      <GeometryDrawing.Pen>
        <Pen Thickness="2" Brush="Black" MiterLimit="0" />
      </GeometryDrawing.Pen>
    </GeometryDrawing>
  </Page.Resources>

  <StackPanel HorizontalAlignment="Left">
    <TextBlock Margin="0,10,0,0">None</TextBlock>
    <Rectangle Width="50" Height="50" Stroke="Black" StrokeThickness="1">
      <Rectangle.Fill>

        <!-- The DrawingBrush's content is not tiled in this example. -->
        <DrawingBrush TileMode="None" 
          Drawing="{StaticResource TriangleDrawing}" />
      </Rectangle.Fill>
    </Rectangle>

    <TextBlock Margin="0,10,0,0">Tile</TextBlock>
    <Rectangle Width="50" Height="50" Stroke="Black" StrokeThickness="1">
      <Rectangle.Fill>

        <!-- The DrawingBrush's content is tiled in this example. 
             The Viewport property is set to create four tiles. -->
        <DrawingBrush TileMode="Tile" Viewport="0,0,0.5,0.5" 
          Drawing="{StaticResource TriangleDrawing}"/>
      </Rectangle.Fill>
    </Rectangle>

    <TextBlock Margin="0,10,0,0">FlipX</TextBlock>
    <Rectangle Width="50" Height="50" Stroke="Black" StrokeThickness="1">
      <Rectangle.Fill>

        <!-- The DrawingBrush's content is flipped horizontally as it is
             tiled in this example. -->
        <DrawingBrush 
          TileMode="FlipX" Viewport="0,0,0.5,0.5"
          Drawing="{StaticResource TriangleDrawing}" />
      </Rectangle.Fill>
    </Rectangle>

    <TextBlock Margin="0,10,0,0">FlipY</TextBlock>
    <Rectangle Width="50" Height="50" Stroke="Black" StrokeThickness="1">
      <Rectangle.Fill>

        <!-- The DrawingBrush's content is flipped vertically as it is
             tiled in this example. -->
        <DrawingBrush TileMode="FlipY" Viewport="0,0,0.5,0.5" 
          Drawing="{StaticResource TriangleDrawing}" />
      </Rectangle.Fill>
    </Rectangle>

    <TextBlock Margin="0,10,0,0">FlipXY</TextBlock>
    <Rectangle Width="50" Height="50" Stroke="Black" StrokeThickness="1">
      <Rectangle.Fill>

        <!-- The DrawingBrush's content is flipped horizontally
             and vertically as it is tiled in this example. -->
        <DrawingBrush TileMode="FlipXY" Viewport="0,0,0.5,0.5" 
          Drawing="{StaticResource TriangleDrawing}" />
      </Rectangle.Fill>
    </Rectangle>

  </StackPanel>
</Page>

Consulte também

Tarefas

Exemplo de ImageBrush

Como: Definir o tamanho da área lado a lado para um TileBrush

Exemplo de ImageBrush

Exemplo de VisualBrush

Exemplo de DrawingBrush

Conceitos

Pintura com Imagens, Desenhos e Visuais