方法 : TileBrush のタイル サイズを設定する

この例では、TileBrush のタイル サイズを設定する方法について説明します。 既定では、TileBrush は、描画する領域を完全に塗りつぶす 1 つのタイルを生成します。 Viewport プロパティと ViewportUnits プロパティを設定することで、この動作をオーバーライドできます。

Viewport プロパティは、TileBrush のタイル サイズを指定します。 既定では、Viewport プロパティの値は、描画する領域のサイズを基準にした相対値です。 Viewport プロパティでタイル サイズの絶対値を指定するには、ViewportUnits プロパティを Absolute に設定します。

使用例

次の例では、TileBrush の一種である ImageBrush を使用して、四角形をタイルで塗りつぶします。 各タイルを、出力領域 (四角形) の 50% x 50% に設定しています。 結果として、四角形はイメージの 4 つの投影で塗りつぶされます。

この例が生成する出力を次の図に示します。

            '
            ' Create an ImageBrush and set the size of each
            ' tile to 50% by 50% of the area being painted. 
            ' 
            Dim relativeTileSizeImageBrush As New ImageBrush()
            relativeTileSizeImageBrush.ImageSource = New BitmapImage(New Uri("sampleImages\cherries_larger.jpg", UriKind.Relative))
            relativeTileSizeImageBrush.TileMode = TileMode.Tile

            ' Specify the size of the base tile. 
            ' By default, the size of the Viewport is
            ' relative to the area being painted,
            ' so a value of 0.5 indicates 50% of the output
            ' area.
            relativeTileSizeImageBrush.Viewport = New Rect(0, 0, 0.5, 0.5)

            ' Create a rectangle and paint it with the ImageBrush.
            Dim relativeTileSizeExampleRectangle As New Rectangle()
            With relativeTileSizeExampleRectangle
                .Width = 200
                .Height = 150
                .Stroke = Brushes.LimeGreen
                .StrokeThickness = 1
                .Fill = relativeTileSizeImageBrush
            End With

//
// Create an ImageBrush and set the size of each
// tile to 50% by 50% of the area being painted. 
// 
ImageBrush relativeTileSizeImageBrush = new ImageBrush();
relativeTileSizeImageBrush.ImageSource =
    new BitmapImage(new Uri(@"sampleImages\cherries_larger.jpg", UriKind.Relative));
relativeTileSizeImageBrush.TileMode = TileMode.Tile;

// Specify the size of the base tile. 
// By default, the size of the Viewport is
// relative to the area being painted,
// so a value of 0.5 indicates 50% of the output
// area.
relativeTileSizeImageBrush.Viewport = new Rect(0, 0, 0.5, 0.5);

// Create a rectangle and paint it with the ImageBrush.
Rectangle relativeTileSizeExampleRectangle = new Rectangle();
relativeTileSizeExampleRectangle.Width = 200;
relativeTileSizeExampleRectangle.Height = 150;
relativeTileSizeExampleRectangle.Stroke = Brushes.LimeGreen;
relativeTileSizeExampleRectangle.StrokeThickness = 1;
relativeTileSizeExampleRectangle.Fill = relativeTileSizeImageBrush;

<!-- The ImageBrush's tiles are set to 50% by 50% of the output area. -->
<Rectangle
  Width="200" Height="150"
  Stroke="LimeGreen" StrokeThickness="1">
  <Rectangle.Fill>
    <ImageBrush
      Viewport="0,0,0.5,0.5"
      TileMode="Tile"
      ImageSource="sampleImages\cherries_larger.jpg" />
  </Rectangle.Fill>
</Rectangle>

次の例では、ImageBrush を作成し、その Viewport を 0,0,25,25 に、また ViewportUnits を Absolute に設定して、そのイメージ ブラシを使用して別の四角形を塗りつぶします。 結果として、幅が 25 ピクセルで高さが 25 ピクセルのタイルが生成されます。

この例が生成する出力を次の図に示します。

'
' Create an ImageBrush and set the size of each
' tile to 25 by 25 pixels. 
' 
Dim absoluteTileSizeImageBrush As New ImageBrush()
absoluteTileSizeImageBrush.ImageSource = New BitmapImage(New Uri("sampleImages\cherries_larger.jpg", UriKind.Relative))
absoluteTileSizeImageBrush.TileMode = TileMode.Tile

' Specify that the Viewport is to be interpreted as
' an absolute value. 
absoluteTileSizeImageBrush.ViewportUnits = BrushMappingMode.Absolute

' Set the size of the base tile. Had we left ViewportUnits set
' to RelativeToBoundingBox (the default value), 
' each tile would be 25 times the size of the area being
' painted. Because ViewportUnits is set to Absolute,
' the following line creates tiles that are 25 by 25 pixels.
absoluteTileSizeImageBrush.Viewport = New Rect(0, 0, 25, 25)

' Create a rectangle and paint it with the ImageBrush.
Dim absoluteTileSizeExampleRectangle As New Rectangle()
With absoluteTileSizeExampleRectangle
    .Width = 200
    .Height = 150
    .Stroke = Brushes.LimeGreen
    .StrokeThickness = 1
    .Fill = absoluteTileSizeImageBrush
End With

//
// Create an ImageBrush and set the size of each
// tile to 25 by 25 pixels. 
// 
ImageBrush absoluteTileSizeImageBrush = new ImageBrush();
absoluteTileSizeImageBrush.ImageSource =
     new BitmapImage(new Uri(@"sampleImages\cherries_larger.jpg", UriKind.Relative));
absoluteTileSizeImageBrush.TileMode = TileMode.Tile;

// Specify that the Viewport is to be interpreted as
// an absolute value. 
absoluteTileSizeImageBrush.ViewportUnits = BrushMappingMode.Absolute;

// Set the size of the base tile. Had we left ViewportUnits set
// to RelativeToBoundingBox (the default value), 
// each tile would be 25 times the size of the area being
// painted. Because ViewportUnits is set to Absolute,
// the following line creates tiles that are 25 by 25 pixels.
absoluteTileSizeImageBrush.Viewport = new Rect(0, 0, 25, 25);

// Create a rectangle and paint it with the ImageBrush.
Rectangle absoluteTileSizeExampleRectangle = new Rectangle();
absoluteTileSizeExampleRectangle.Width = 200;
absoluteTileSizeExampleRectangle.Height = 150;
absoluteTileSizeExampleRectangle.Stroke = Brushes.LimeGreen;
absoluteTileSizeExampleRectangle.StrokeThickness = 1;
absoluteTileSizeExampleRectangle.Fill = absoluteTileSizeImageBrush;

<!-- The ImageBrush's tiles are set to 25 by 25 pixels. -->
<Rectangle
  Width="200" Height="150"
  Stroke="LimeGreen" StrokeThickness="1">
  <Rectangle.Fill>
    <ImageBrush
      Viewport="0,0,25,25"
      ViewportUnits="Absolute"
      TileMode="Tile"
      ImageSource="sampleImages\cherries_larger.jpg" />
  </Rectangle.Fill>
</Rectangle>

前の例は、大きなサンプルの一部です。 サンプル全体については、ImageBrush のサンプルを参照してください。

この例では ImageBrush クラスを使用していますが、Viewport プロパティと ViewportUnits プロパティは、他の TileBrush オブジェクト、つまり DrawingBrush と VisualBrush に対してもまったく同じように動作します。 ImageBrush およびその他の TileBrush オブジェクトの詳細については、「イメージ、描画、およびビジュアルによる塗りつぶし」を参照してください。

参照

処理手順

方法 : TileBrush を使用してさまざまなタイル パターンを作成する

参照

TileBrush

概念

イメージ、描画、およびビジュアルによる塗りつぶし