Notitie
Voor toegang tot deze pagina is autorisatie vereist. U kunt proberen u aan te melden of de directory te wijzigen.
Voor toegang tot deze pagina is autorisatie vereist. U kunt proberen de mappen te wijzigen.
TileBrush objecten bieden u veel controle over hoe een gebied wordt geschilderd met een afbeelding, Drawingof Visual. In dit onderwerp wordt beschreven hoe u TileBrush-functies kunt gebruiken om meer controle te krijgen over hoe een ImageBrush, DrawingBrush, of VisualBrush een gebied opmaakt.
Vereiste voorwaarden
Als u dit onderwerp wilt begrijpen, is het handig om te begrijpen hoe u de basisfuncties van de ImageBrush, DrawingBrushof VisualBrush klasse gebruikt. Zie het schilderij met afbeeldingen, tekeningen en visuals voor een inleiding tot deze typen.
Een gebied met tegels schilderen
ImageBrush, DrawingBrushzijn VisualBrush typen TileBrush objecten. Tegelborstels geven u veel controle over hoe een gebied wordt uitgebeeld met een afbeelding, tekening of visuele representatie. In plaats van alleen een gebied met één uitgerekte afbeelding te schilderen, kunt u bijvoorbeeld een gebied schilderen met een reeks afbeeldingtegels die een patroon maken.
Het schilderen van een gebied met een tegelborstel omvat drie onderdelen: inhoud, de basistegel en het uitvoergebied.
Onderdelen van een TileBrush met één tegel
Onderdelen van een TileBrush met een TileMode of Tile
Het outputgebied is het gebied dat wordt geschilderd, zoals het Fill van een Ellipse of het Background van een Button. In de volgende secties worden de andere twee onderdelen van een TileBrush.
Inhoud van de Kwast
Er zijn drie verschillende soorten van TileBrush en elk type schildert met een ander soort inhoud.
Indien het kwast een ImageBrush is, is deze inhoud een afbeelding. De ImageSource eigenschap geeft de inhoud van de ImageBrush weer.
Als het penseel een DrawingBrush is, is deze inhoud een tekening. De Drawing eigenschap geeft de inhoud van de DrawingBrush.
Als het penseel een VisualBrush is, is deze inhoud visuele inhoud. De Visual eigenschap geeft de inhoud van de VisualBrush.
U kunt de positie en afmetingen van de TileBrush inhoud opgeven met behulp van de Viewbox eigenschap, hoewel het gebruikelijk is om de Viewbox instelling op de standaardwaarde te laten staan. Standaard is de Viewbox configuratie zo geconfigureerd dat deze volledig de inhoud van de borstel bevat. Zie de Viewbox-eigenschappenpagina voor meer informatie over het configureren van de Viewbox.
De basistegel
Een TileBrush projecteert de inhoud ervan op een basistegel. De Stretch eigenschap bepaalt hoe TileBrush inhoud wordt uitgerekt om de basistegel te vullen. De eigenschap Stretch accepteert de volgende waarden, gedefinieerd door de opsomming Stretch:
None: De penseelinhoud wordt niet vergroot om de tegel te vullen.
Fill: De inhoud van het penseel wordt aangepast aan de tegel. Omdat de hoogte en breedte van de inhoud onafhankelijk van elkaar worden geschaald, blijft de oorspronkelijke hoogte-breedteverhouding van de inhoud mogelijk niet behouden. Dat wil zeggen, de inhoud van de borstel kan worden vervormd om de uitvoertegel volledig te vullen.
Uniform: De inhoud van het penseel wordt geschaald zodat deze volledig binnen de tegel past. De hoogte-breedteverhouding van de inhoud blijft behouden.
UniformToFill: De inhoud van het penseel wordt geschaald zodat het het uitvoergebied volledig vult terwijl de oorspronkelijke hoogte-breedteverhouding van de inhoud behouden blijft.
In de volgende afbeelding ziet u de verschillende Stretch instellingen.
In het volgende voorbeeld wordt de inhoud van een ImageBrush zo ingesteld, zodat deze niet wordt uitgerekt om het outputgebied te vullen.
<Rectangle
Width="125" Height="175"
Stroke="Black"
StrokeThickness="1"
Margin="0,0,5,0">
<Rectangle.Fill>
<ImageBrush
Stretch="None"
ImageSource="sampleImages\testImage.gif"/>
</Rectangle.Fill>
</Rectangle>
// Create a rectangle.
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 125;
myRectangle.Height = 175;
myRectangle.Stroke = Brushes.Black;
myRectangle.StrokeThickness = 1;
myRectangle.Margin = new Thickness(0,5,0,0);
// Load the image.
BitmapImage theImage =
new BitmapImage(
new Uri("sampleImages\\testImage.gif", UriKind.Relative));
ImageBrush myImageBrush = new ImageBrush(theImage);
// Configure the brush so that it
// doesn't stretch its image to fill
// the rectangle.
myImageBrush.Stretch = Stretch.None;
// Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush;
' Create a rectangle.
Dim myRectangle As New Rectangle()
With myRectangle
.Width = 125
.Height = 175
.Stroke = Brushes.Black
.StrokeThickness = 1
.Margin = New Thickness(0, 5, 0, 0)
End With
' Load the image.
Dim theImage As New BitmapImage(New Uri("sampleImages\testImage.gif", UriKind.Relative))
Dim myImageBrush As New ImageBrush(theImage)
' Configure the brush so that it
' doesn't stretch its image to fill
' the rectangle.
myImageBrush.Stretch = Stretch.None
' Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush
Standaard genereert een TileBrush een enkele tegel (de basistegel), en wordt die tegel uitgerekt om het uitvoergebied helemaal te vullen. U kunt de grootte en positie van de basistegel wijzigen door de Viewport en ViewportUnits eigenschappen in te stellen.
Grootte van basistegel
De Viewport eigenschap bepaalt de grootte en positie van de basistegel en de ViewportUnits eigenschap bepaalt of de Viewport eigenschap is opgegeven met absolute of relatieve coördinaten. Als de coördinaten relatief zijn, zijn ze relatief ten opzichte van de grootte van het uitvoergebied. Het punt (0,0) vertegenwoordigt de linkerbovenhoek van het uitvoergebied en (1,1) staat rechtsonder in het uitvoergebied. Als u wilt opgeven dat de Viewport eigenschap absolute coördinaten gebruikt, stelt u de ViewportUnits eigenschap in op Absolute.
In de volgende afbeelding ziet u het verschil in output tussen een TileBrush met relatief versus absoluut ViewportUnits. U ziet dat in de illustraties elk een tegelpatroon wordt weergegeven; in de volgende sectie wordt beschreven hoe u een tegelpatroon opgeeft.
In het volgende voorbeeld wordt een afbeelding gebruikt om een tegel met een breedte en hoogte van 50%te maken. De basistegel bevindt zich op (0,0) van het uitvoergebied.
<Rectangle
Width="50" Height="100">
<Rectangle.Fill>
<!-- Paints an area with 4 tiles. -->
<ImageBrush ImageSource="sampleImages\cherries_larger.jpg"
Viewport="0,0,0.5,0.5"
ViewportUnits="RelativeToBoundingBox"
TileMode="Tile" />
</Rectangle.Fill>
</Rectangle>
// Create a rectangle.
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 50;
myRectangle.Height = 100;
// Load the image.
BitmapImage theImage =
new BitmapImage(
new Uri("sampleImages\\cherries_larger.jpg", UriKind.Relative));
ImageBrush myImageBrush = new ImageBrush(theImage);
// Create tiles that are 1/4 the size of
// the output area.
myImageBrush.Viewport = new Rect(0,0,0.25,0.25);
myImageBrush.ViewportUnits = BrushMappingMode.RelativeToBoundingBox;
// Set the tile mode to Tile.
myImageBrush.TileMode = TileMode.Tile;
// Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush;
' Create a rectangle.
Dim myRectangle As New Rectangle()
myRectangle.Width = 50
myRectangle.Height = 100
' Load the image.
Dim theImage As New BitmapImage(New Uri("sampleImages\cherries_larger.jpg", UriKind.Relative))
Dim myImageBrush As New ImageBrush(theImage)
' Create tiles that are 1/4 the size of
' the output area.
myImageBrush.Viewport = New Rect(0, 0, 0.25, 0.25)
myImageBrush.ViewportUnits = BrushMappingMode.RelativeToBoundingBox
' Set the tile mode to Tile.
myImageBrush.TileMode = TileMode.Tile
' Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush
In het volgende voorbeeld worden de tegels van een ImageBrush ingesteld op 25 bij 25 apparaatonafhankelijke pixels. Omdat de ViewportUnits tegels absoluut zijn, zijn de ImageBrush tegels altijd 25 bij 25 pixels, ongeacht de grootte van het gebied dat wordt geschilderd.
<Rectangle
Width="50" Height="100">
<Rectangle.Fill>
<!-- Paints an area with 25 x 25 tiles. -->
<ImageBrush ImageSource="sampleImages\cherries_larger.jpg"
Viewport="0,0,25,25"
ViewportUnits="Absolute"
TileMode="Tile" />
</Rectangle.Fill>
</Rectangle>
// Create a rectangle.
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 50;
myRectangle.Height = 100;
// Load the image.
BitmapImage theImage =
new BitmapImage(
new Uri("sampleImages\\cherries_larger.jpg", UriKind.Relative));
ImageBrush myImageBrush = new ImageBrush(theImage);
// Create tiles that are 25 x 25, regardless of the size
// of the output area.
myImageBrush.Viewport = new Rect(0, 0, 25, 25);
myImageBrush.ViewportUnits = BrushMappingMode.Absolute;
// Set the tile mode to Tile.
myImageBrush.TileMode = TileMode.Tile;
// Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush;
' Create a rectangle.
Dim myRectangle As New Rectangle()
myRectangle.Width = 50
myRectangle.Height = 100
' Load the image.
Dim theImage As New BitmapImage(New Uri("sampleImages\cherries_larger.jpg", UriKind.Relative))
Dim myImageBrush As New ImageBrush(theImage)
' Create tiles that are 25 x 25, regardless of the size
' of the output area.
myImageBrush.Viewport = New Rect(0, 0, 25, 25)
myImageBrush.ViewportUnits = BrushMappingMode.Absolute
' Set the tile mode to Tile.
myImageBrush.TileMode = TileMode.Tile
' Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush
Tegelgedrag
A TileBrush produceert een tegelpatroon wanneer de basistegel het uitvoergebied niet volledig vult en een andere tegelmodus dan None wordt opgegeven. Wanneer de tegel van een tegelborstel het uitvoergebied niet volledig vult, TileMode geeft de eigenschap ervan aan of de basistegel moet worden gedupliceerd om het uitvoergebied te vullen en, als dat het geval is, hoe de basistegel moet worden gedupliceerd. De eigenschap TileMode accepteert de volgende waarden, gedefinieerd door de opsomming TileMode:
None: Alleen de basistegel wordt getekend.
Tile: De basistegel wordt getekend en het resterende gebied wordt gevuld door de basistegel te herhalen, zodat de rechterrand van de ene tegel grenzend is aan de linkerrand van de volgende, en op dezelfde manier voor onder en boven.
FlipX: Hetzelfde als Tile, maar alternatieve kolommen met tegels worden horizontaal gespiegeld.
FlipY: Hetzelfde als Tile, maar afwisselende tegelrijen worden verticaal omgedraaid.
In de volgende afbeelding ziet u de verschillende tegelmodi.
In het volgende voorbeeld wordt een afbeelding gebruikt om een rechthoek te schilderen die 100 pixels breed en 100 pixels hoog is. Door de borstel op Viewport 0,0,0,25,0,25 in te stellen, wordt de basistegel van de borstel 1/4 van het uitvoergebied. De borstel TileMode is ingesteld op FlipXY. zodat de rechthoek wordt gevuld met rijen met tegels.
<Rectangle
Width="100" Height="100" >
<Rectangle.Fill>
<ImageBrush ImageSource="sampleImages\triangle.jpg"
Viewport="0,0,0.25,0.25"
TileMode="FlipXY"
/>
</Rectangle.Fill>
</Rectangle>
// Create a rectangle.
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 100;
myRectangle.Height = 100;
// Load the image.
BitmapImage theImage =
new BitmapImage(
new Uri("sampleImages\\triangle.jpg", UriKind.Relative));
ImageBrush myImageBrush = new ImageBrush(theImage);
// Create tiles that are 1/4 the size of
// the output area.
myImageBrush.Viewport = new Rect(0,0,0.25,0.25);
// Set the tile mode to FlipXY.
myImageBrush.TileMode = TileMode.FlipXY;
// Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush;
' Create a rectangle.
Dim myRectangle As New Rectangle()
myRectangle.Width = 100
myRectangle.Height = 100
' Load the image.
Dim theImage As New BitmapImage(New Uri("sampleImages\triangle.jpg", UriKind.Relative))
Dim myImageBrush As New ImageBrush(theImage)
' Create tiles that are 1/4 the size of
' the output area.
myImageBrush.Viewport = New Rect(0, 0, 0.25, 0.25)
' Set the tile mode to FlipXY.
myImageBrush.TileMode = TileMode.FlipXY
' Use the ImageBrush to paint the rectangle's background.
myRectangle.Fill = myImageBrush
Zie ook
Met ons samenwerken op GitHub
De bron voor deze inhoud vindt u op GitHub, waar u ook problemen en pull-aanvragen kunt maken en controleren. Bekijk onze gids voor inzenders voor meer informatie.
.NET Desktop feedback