Dela via


Måla med bilder, ritningar och visuella objekt

Det här avsnittet beskriver hur du använder ImageBrush, DrawingBrushoch VisualBrush objekt för att måla ett område med en bild, en Drawingeller en Visual.

Förutsättningar

För att förstå det här avsnittet bör du känna till de olika typerna av penslar som Windows Presentation Foundation (WPF) tillhandahåller och deras grundläggande funktioner. En introduktion finns i översikten över WPF-penslar.

Måla ett område med en bild

En ImageBrush målar ett område med en ImageSource. Den vanligaste typen av ImageSource som ska användas med en ImageBrush är en BitmapImage, som beskriver en bitmappsgrafik. Du kan använda en DrawingImage för att måla med hjälp av ett Drawing objekt, men det är enklare att använda en DrawingBrush i stället. Mer information om ImageSource objekt finns i Imaging Overview.

Om du vill måla med en ImageBrushskapar du en BitmapImage och använder den för att läsa in bitmappsinnehållet. Använd sedan BitmapImage för att ange egenskapen ImageSource för ImageBrush. Tillämpa slutligen ImageBrush på det objekt som du vill måla. I XAML (Extensible Application Markup Language) kan du också ange egenskapen ImageSource för ImageBrush med sökvägen till bilden som ska läsas in.

Precis som alla Brush objekt kan en ImageBrush användas för att måla objekt som former, paneler, kontroller och text. Följande bild visar några effekter som kan uppnås med en ImageBrush.

Exempel på ImageBrush-utdata
Objekt målade av en ImageBrush

Standardmässigt sträcker en ImageBrush ut sin bild för att helt fylla det område som målas, vilket kan förvränga bilden om det målade området har en annan proportion än bilden. Du kan ändra det här beteendet genom att ändra egenskapen Stretch från standardvärdet Fill till None, Uniformeller UniformToFill. Eftersom ImageBrush är en typ av TileBrushkan du ange exakt hur en bildborste fyller utdataområdet och till och med skapa mönster. Mer information om avancerade TileBrush funktioner finns i TileBrush Overview.

Exempel: Måla ett objekt med en bitmappsbild

I följande exempel används en ImageBrush för att måla Background för en Canvas.

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="Microsoft.Samples.BrushExamples.ImageBrushExample"
  WindowTitle="ImageBrush Example"
  Background="White">

  <StackPanel>

    <Canvas
      Height="200" Width="300">
      <Canvas.Background>
        <ImageBrush ImageSource="sampleImages\Waterlilies.jpg" />
      </Canvas.Background>
    </Canvas>

    
  </StackPanel>
</Page>
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Imaging;

namespace Microsoft.Samples.BrushExamples
{

    public class ImageBrushExample : Page
    {

        public ImageBrushExample()
        {

            StackPanel mainPanel = new StackPanel();
            canvasBackgroundExample(mainPanel);
            this.Content = mainPanel;
        }

        private void canvasBackgroundExample(Panel mainPanel)
        {

            BitmapImage theImage = new BitmapImage
                (new Uri("sampleImages\\Waterlilies.jpg", UriKind.Relative));

            ImageBrush myImageBrush = new ImageBrush(theImage);

            Canvas myCanvas = new Canvas();
            myCanvas.Width = 300;
            myCanvas.Height = 200;
            myCanvas.Background = myImageBrush;

            mainPanel.Children.Add(myCanvas);
        }
    }
}

Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Media
Imports System.Windows.Media.Imaging

Namespace Microsoft.Samples.BrushExamples

    Public Class ImageBrushExample
        Inherits Page

        Public Sub New()

            Dim mainPanel As New StackPanel()
            canvasBackgroundExample(mainPanel)
            Me.Content = mainPanel

        End Sub


        Private Sub canvasBackgroundExample(ByVal mainPanel As Panel)

            Dim theImage As New BitmapImage(New Uri("sampleImages\Waterlilies.jpg", UriKind.Relative))

            Dim myImageBrush As New ImageBrush(theImage)

            Dim myCanvas As New Canvas()
            myCanvas.Width = 300
            myCanvas.Height = 200
            myCanvas.Background = myImageBrush

            mainPanel.Children.Add(myCanvas)


        End Sub

    End Class

End Namespace

Måla ett område med en ritning

Med en DrawingBrush kan du måla ett område med former, text, bilder och video. Formerna i sig själva i en målarpensel kan målas med en solid färg, färggradient, bild eller till och med en annan DrawingBrush. Följande bild visar vissa användningsområden för en DrawingBrush.

DrawingBrush-utdataexempel
Objekt målade av en DrawingBrush

En DrawingBrush målar ett område med ett Drawing objekt. Ett Drawing-objekt beskriver synligt innehåll, till exempel en form, bitmapp, video eller en textrad. Olika typer av ritningar beskriver olika typer av innehåll. Följande är en lista över de olika typerna av ritade objekt.

För mer information om Drawing-objekt, se Översikt över ritobjekt.

Precis som en ImageBrush, expanderar en DrawingBrush sin Drawing för att fylla dess utdataområde. Du kan åsidosätta det här beteendet genom att ändra egenskapen Stretch från standardinställningen Fill. Mer information finns i egenskapen Stretch.

Exempel: Måla ett objekt med en ritning

I följande exempel visas hur du målar ett objekt med en ritning med tre ellipser. En GeometryDrawing används för att beskriva ellipserna.

<Button Content="A Button">
  <Button.Background>
    <DrawingBrush>
      <DrawingBrush.Drawing>
        <GeometryDrawing Brush="LightBlue">
          <GeometryDrawing.Geometry>
            <GeometryGroup>
              <EllipseGeometry RadiusX="12.5" RadiusY="25" Center="25,50" />
              <EllipseGeometry RadiusX="12.5" RadiusY="25" Center="50,50" />
              <EllipseGeometry RadiusX="12.5" RadiusY="25" Center="75,50" />
            </GeometryGroup>
          </GeometryDrawing.Geometry>
          <GeometryDrawing.Pen>
            <Pen Thickness="1" Brush="Gray" />
          </GeometryDrawing.Pen>
        </GeometryDrawing>
      </DrawingBrush.Drawing>
    </DrawingBrush>
  </Button.Background>
</Button>
// Create a DrawingBrush.
DrawingBrush myDrawingBrush = new DrawingBrush();

// Create a drawing.
GeometryDrawing myGeometryDrawing = new GeometryDrawing();
myGeometryDrawing.Brush = Brushes.LightBlue;
myGeometryDrawing.Pen = new Pen(Brushes.Gray, 1);
GeometryGroup ellipses = new GeometryGroup();
ellipses.Children.Add(new EllipseGeometry(new Point(25,50), 12.5, 25));
ellipses.Children.Add(new EllipseGeometry(new Point(50,50), 12.5, 25));
ellipses.Children.Add(new EllipseGeometry(new Point(75,50), 12.5, 25));

myGeometryDrawing.Geometry = ellipses;
myDrawingBrush.Drawing = myGeometryDrawing;

Button myButton = new Button();
myButton.Content = "A Button";

// Use the DrawingBrush to paint the button's background.
myButton.Background = myDrawingBrush;
' Create a DrawingBrush.
Dim myDrawingBrush As New DrawingBrush()

' Create a drawing.
Dim myGeometryDrawing As New GeometryDrawing()
myGeometryDrawing.Brush = Brushes.LightBlue
myGeometryDrawing.Pen = New Pen(Brushes.Gray, 1)
Dim ellipses As New GeometryGroup()
ellipses.Children.Add(New EllipseGeometry(New Point(25,50), 12.5, 25))
ellipses.Children.Add(New EllipseGeometry(New Point(50,50), 12.5, 25))
ellipses.Children.Add(New EllipseGeometry(New Point(75,50), 12.5, 25))

myGeometryDrawing.Geometry = ellipses
myDrawingBrush.Drawing = myGeometryDrawing

Dim myButton As New Button()
myButton.Content = "A Button"

' Use the DrawingBrush to paint the button's background.
myButton.Background = myDrawingBrush

Måla ett område med ett visuellt objekt

Den mest mångsidiga och kraftfulla av alla penslar, målar VisualBrush ett område med en Visual. En Visual är en grafisk typ på låg nivå som fungerar som föregångare till många användbara grafiska komponenter. Till exempel är klasserna Window, FrameworkElementoch Control alla typer av Visual objekt. Med hjälp av en VisualBrushkan du måla områden med nästan alla grafiska objekt i Windows Presentation Foundation (WPF).

Not

Även om VisualBrush är en typ av Freezable-objekt, kan det inte frysas (skrivskyddas) om dess egenskap Visual anges till ett annat värde än null.

Det finns två sätt att ange innehållet i Visual i en VisualBrush.

När du definierar en ny Visual för en VisualBrush och Visual är en UIElement (till exempel en panel eller kontroll), körs layoutsystemet på UIElement och dess underordnade element när egenskapen AutoLayoutContent är inställd på true. Roten UIElement är dock i stort sett isolerad från resten av systemet: formatmallar och extern layout kan inte genomsyra den här gränsen. Därför bör du uttryckligen ange storleken på roten UIElementeftersom dess enda överordnade är VisualBrush och därför inte automatiskt kan storleksanpassa sig till det område som målas. Mer information om layout i Windows Presentation Foundation (WPF) finns i Layout.

Precis som ImageBrush och DrawingBrushsträcker en VisualBrush ut sitt innehåll för att fylla sitt utdataområde. Du kan åsidosätta det här beteendet genom att ändra egenskapen Stretch från standardinställningen Fill. Mer information finns i egenskapen Stretch.

Exempel: Måla ett objekt med en visuell representation

I följande exempel används flera kontroller och en panel för att måla en rektangel.

<Rectangle Width="150" Height="150" Stroke="Black" Margin="5,0,5,0">
  <Rectangle.Fill>
    <VisualBrush>
      <VisualBrush.Visual>
        <StackPanel Background="White">
          <Rectangle Width="25" Height="25" Fill="Red" Margin="2" />
          <TextBlock FontSize="10pt" Margin="2">Hello, World!</TextBlock>
          <Button Margin="2">A Button</Button>
        </StackPanel>
      </VisualBrush.Visual>
    </VisualBrush>
  </Rectangle.Fill>
</Rectangle>
VisualBrush myVisualBrush = new VisualBrush();

// Create the visual brush's contents.
StackPanel myStackPanel = new StackPanel();
myStackPanel.Background = Brushes.White;

Rectangle redRectangle = new Rectangle();
redRectangle.Width = 25;
redRectangle.Height =25;
redRectangle.Fill = Brushes.Red;
redRectangle.Margin = new Thickness(2);
myStackPanel.Children.Add(redRectangle);

TextBlock someText = new TextBlock();
FontSizeConverter myFontSizeConverter = new FontSizeConverter();
someText.FontSize = (double)myFontSizeConverter.ConvertFrom("10pt");
someText.Text = "Hello, World!";
someText.Margin = new Thickness(2);
myStackPanel.Children.Add(someText);

Button aButton = new Button();
aButton.Content = "A Button";
aButton.Margin = new Thickness(2);
myStackPanel.Children.Add(aButton);

// Use myStackPanel as myVisualBrush's content.
myVisualBrush.Visual = myStackPanel;

// Create a rectangle to paint.
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 150;
myRectangle.Height = 150;
myRectangle.Stroke = Brushes.Black;
myRectangle.Margin = new Thickness(5,0,5,0);

// Use myVisualBrush to paint myRectangle.
myRectangle.Fill = myVisualBrush;

Dim myVisualBrush As New VisualBrush()

' Create the visual brush's contents.
Dim myStackPanel As New StackPanel()
myStackPanel.Background = Brushes.White

Dim redRectangle As New Rectangle()
With redRectangle
    .Width = 25
    .Height = 25
    .Fill = Brushes.Red
    .Margin = New Thickness(2)
End With
myStackPanel.Children.Add(redRectangle)

Dim someText As New TextBlock()
Dim myFontSizeConverter As New FontSizeConverter()
someText.FontSize = CDbl(myFontSizeConverter.ConvertFrom("10pt"))
someText.Text = "Hello, World!"
someText.Margin = New Thickness(2)
myStackPanel.Children.Add(someText)

Dim aButton As New Button()
aButton.Content = "A Button"
aButton.Margin = New Thickness(2)
myStackPanel.Children.Add(aButton)

' Use myStackPanel as myVisualBrush's content.
myVisualBrush.Visual = myStackPanel

' Create a rectangle to paint.
Dim myRectangle As New Rectangle()
With myRectangle
    .Width = 150
    .Height = 150
    .Stroke = Brushes.Black
    .Margin = New Thickness(5, 0, 5, 0)
End With

' Use myVisualBrush to paint myRectangle.
myRectangle.Fill = myVisualBrush

Exempel: Skapa en reflektion

Föregående exempel visade hur du skapar en ny Visual för användning som bakgrund. Du kan också använda en VisualBrush för att visa ett befintligt visuellt objekt. Med den här funktionen kan du skapa intressanta visuella effekter, till exempel reflektioner och förstoring. I följande exempel används en VisualBrush för att skapa en återspegling av en Border som innehåller flera element. Följande bild visar de utdata som det här exemplet ger.

Ett reflekterat visuellt objekt
Ett reflekterat visuellt objekt

using System;
using System.Windows;
using System.Windows.Data;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Effects;
using System.Windows.Media.Imaging;
using System.IO;
using System.Collections.ObjectModel;
using System.Windows.Shapes;
namespace SDKSample
{
    public partial class ReflectionExample : Page
    {
        public ReflectionExample()
        {
            // Create a name scope for the page.
            NameScope.SetNameScope(this, new NameScope());

            this.Background = Brushes.Black;
            StackPanel myStackPanel = new StackPanel();
            myStackPanel.Margin = new Thickness(50);

            Border myReflectedBorder = new Border();
            this.RegisterName("ReflectedVisual", myReflectedBorder);

            // Create a gradient background for the border.
            GradientStop firstStop = new GradientStop();
            firstStop.Offset = 0.0;
            Color firstStopColor = new Color();
            firstStopColor.R = 204;
            firstStopColor.G = 204;
            firstStopColor.B = 255;
            firstStopColor.A = 255;
            firstStop.Color = firstStopColor;
            GradientStop secondStop = new GradientStop();
            secondStop.Offset = 1.0;
            secondStop.Color = Colors.White;

            GradientStopCollection myGradientStopCollection = new GradientStopCollection();
            myGradientStopCollection.Add(firstStop);
            myGradientStopCollection.Add(secondStop);

            LinearGradientBrush myLinearGradientBrush = new LinearGradientBrush();
            myLinearGradientBrush.StartPoint = new Point(0, 0.5);
            myLinearGradientBrush.EndPoint = new Point(1, 0.5);
            myLinearGradientBrush.GradientStops = myGradientStopCollection;

            myReflectedBorder.Background = myLinearGradientBrush;

            // Add contents to the border.
            StackPanel borderStackPanel = new StackPanel();
            borderStackPanel.Orientation = Orientation.Horizontal;
            borderStackPanel.Margin = new Thickness(10);

            TextBlock myTextBlock = new TextBlock();
            myTextBlock.TextWrapping = TextWrapping.Wrap;
            myTextBlock.Width = 200;
            myTextBlock.Text = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit." +
                               " Suspendisse vel ante. Donec luctus tortor sit amet est." +
                               " Nullam pulvinar odio et wisi." +
                               " Pellentesque quis magna. Sed pellentesque." +
                               " Nulla euismod." +
                               "Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.";

            borderStackPanel.Children.Add(myTextBlock);

            StackPanel ellipseStackPanel = new StackPanel();

            Ellipse ellipse1 = new Ellipse();
            ellipse1.Margin = new Thickness(10);
            ellipse1.Height = 50;
            ellipse1.Width = 50;
            ellipse1.Fill = Brushes.Black;
            ellipseStackPanel.Children.Add(ellipse1);
            Ellipse ellipse2 = new Ellipse();
            ellipse2.Margin = new Thickness(10);
            ellipse2.Height = 50;
            ellipse2.Width = 50;
            ellipse2.Fill = Brushes.Black;
            ellipseStackPanel.Children.Add(ellipse2);
            Ellipse ellipse3 = new Ellipse();
            ellipse3.Margin = new Thickness(10);
            ellipse3.Height = 50;
            ellipse3.Width = 50;
            ellipse3.Fill = Brushes.Black;
            ellipseStackPanel.Children.Add(ellipse3);
            borderStackPanel.Children.Add(ellipseStackPanel);

            myReflectedBorder.Child = borderStackPanel;

            // Create divider rectangle
            Rectangle dividerRectangle = new Rectangle();
            dividerRectangle.Height = 1;
            dividerRectangle.Fill = Brushes.Gray;
            dividerRectangle.HorizontalAlignment = HorizontalAlignment.Stretch;

            // Create the object to contain the reflection.
            Rectangle reflectionRectangle = new Rectangle();

            // Bind the height of the rectangle to the border height.
            Binding heightBinding = new Binding();
            heightBinding.ElementName = "ReflectedVisual";
            heightBinding.Path = new PropertyPath(Rectangle.HeightProperty);
            BindingOperations.SetBinding(reflectionRectangle, Rectangle.HeightProperty, heightBinding);

            // Bind the width of the rectangle to the border width.
            Binding widthBinding = new Binding();
            widthBinding.ElementName = "ReflectedVisual";
            widthBinding.Path = new PropertyPath(Rectangle.WidthProperty);
            BindingOperations.SetBinding(reflectionRectangle, Rectangle.WidthProperty, widthBinding);

            // Creates the reflection.
            VisualBrush myVisualBrush = new VisualBrush();
            myVisualBrush.Opacity = 0.75;
            myVisualBrush.Stretch = Stretch.None;
            Binding reflectionBinding = new Binding();
            reflectionBinding.ElementName = "ReflectedVisual";
            BindingOperations.SetBinding(myVisualBrush, VisualBrush.VisualProperty, reflectionBinding);

            ScaleTransform myScaleTransform = new ScaleTransform();
            myScaleTransform.ScaleX = 1;
            myScaleTransform.ScaleY = -1;
            TranslateTransform myTranslateTransform = new TranslateTransform();
            myTranslateTransform.Y = 1;

            TransformGroup myTransformGroup = new TransformGroup();
            myTransformGroup.Children.Add(myScaleTransform);
            myTransformGroup.Children.Add(myTranslateTransform);

            myVisualBrush.RelativeTransform = myTransformGroup;

            reflectionRectangle.Fill = myVisualBrush;

            // Create a gradient background for the border.
            GradientStop firstStop2 = new GradientStop();
            firstStop2.Offset = 0.0;
            Color c1 = new Color();
            c1.R = 0;
            c1.G = 0;
            c1.B = 0;
            c1.A = 255;
            firstStop2.Color = c1;
            GradientStop secondStop2 = new GradientStop();
            secondStop2.Offset = 0.5;
            Color c2 = new Color();
            c2.R = 0;
            c2.G = 0;
            c2.B = 0;
            c2.A = 51;
            firstStop2.Color = c2;
            GradientStop thirdStop = new GradientStop();
            thirdStop.Offset = 0.75;
            Color c3 = new Color();
            c3.R = 0;
            c3.G = 0;
            c3.B = 0;
            c3.A = 0;
            thirdStop.Color = c3;

            GradientStopCollection myGradientStopCollection2 = new GradientStopCollection();
            myGradientStopCollection2.Add(firstStop2);
            myGradientStopCollection2.Add(secondStop2);
            myGradientStopCollection2.Add(thirdStop);

            LinearGradientBrush myLinearGradientBrush2 = new LinearGradientBrush();
            myLinearGradientBrush2.StartPoint = new Point(0.5, 0);
            myLinearGradientBrush2.EndPoint = new Point(0.5, 1);
            myLinearGradientBrush2.GradientStops = myGradientStopCollection2;

            reflectionRectangle.OpacityMask = myLinearGradientBrush2;

            BlurBitmapEffect myBlurBitmapEffect = new BlurBitmapEffect();
            myBlurBitmapEffect.Radius = 1.5;

            reflectionRectangle.BitmapEffect = myBlurBitmapEffect;

            myStackPanel.Children.Add(myReflectedBorder);
            myStackPanel.Children.Add(dividerRectangle);
            myStackPanel.Children.Add(reflectionRectangle);
            this.Content = myStackPanel;
        }
        /*
    <Rectangle
      Height="{Binding Path=ActualHeight, ElementName=ReflectedVisual}"
      Width="{Binding Path=ActualWidth, ElementName=ReflectedVisual}">

      <Rectangle.OpacityMask>
        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
          <GradientStop Color="#FF000000" Offset="0.0" />
          <GradientStop Color="#33000000" Offset="0.5" />
          <GradientStop Color="#00000000" Offset="0.75" />
        </LinearGradientBrush>
      </Rectangle.OpacityMask>

      <Rectangle.BitmapEffect>
        <BlurBitmapEffect Radius="1.5" />
      </Rectangle.BitmapEffect>

    </Rectangle>
  </StackPanel>
</Page>

*/
    }
}

Imports System.Windows
Imports System.Windows.Data
Imports System.Windows.Controls
Imports System.Windows.Media
Imports System.Windows.Media.Effects
Imports System.Windows.Media.Imaging
Imports System.IO
Imports System.Collections.ObjectModel
Imports System.Windows.Shapes
Namespace SDKSample
    Partial Public Class ReflectionExample
        Inherits Page
        Public Sub New()
            ' Create a name scope for the page.
            NameScope.SetNameScope(Me, New NameScope())

            Me.Background = Brushes.Black
            Dim myStackPanel As New StackPanel()
            myStackPanel.Margin = New Thickness(50)

            Dim myReflectedBorder As New Border()
            Me.RegisterName("ReflectedVisual", myReflectedBorder)

            ' Create a gradient background for the border.
            Dim firstStop As New GradientStop()
            firstStop.Offset = 0.0
            Dim firstStopColor As New Color()
            firstStopColor.R = 204
            firstStopColor.G = 204
            firstStopColor.B = 255
            firstStopColor.A = 255
            firstStop.Color = firstStopColor
            Dim secondStop As New GradientStop()
            secondStop.Offset = 1.0
            secondStop.Color = Colors.White

            Dim myGradientStopCollection As New GradientStopCollection()
            myGradientStopCollection.Add(firstStop)
            myGradientStopCollection.Add(secondStop)

            Dim myLinearGradientBrush As New LinearGradientBrush()
            myLinearGradientBrush.StartPoint = New Point(0, 0.5)
            myLinearGradientBrush.EndPoint = New Point(1, 0.5)
            myLinearGradientBrush.GradientStops = myGradientStopCollection

            myReflectedBorder.Background = myLinearGradientBrush

            ' Add contents to the border.
            Dim borderStackPanel As New StackPanel()
            borderStackPanel.Orientation = Orientation.Horizontal
            borderStackPanel.Margin = New Thickness(10)

            Dim myTextBlock As New TextBlock()
            myTextBlock.TextWrapping = TextWrapping.Wrap
            myTextBlock.Width = 200
            myTextBlock.Text = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit." & " Suspendisse vel ante. Donec luctus tortor sit amet est." & " Nullam pulvinar odio et wisi." & " Pellentesque quis magna. Sed pellentesque." & " Nulla euismod." & "Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas."

            borderStackPanel.Children.Add(myTextBlock)

            Dim ellipseStackPanel As New StackPanel()

            Dim ellipse1 As New Ellipse()
            ellipse1.Margin = New Thickness(10)
            ellipse1.Height = 50
            ellipse1.Width = 50
            ellipse1.Fill = Brushes.Black
            ellipseStackPanel.Children.Add(ellipse1)
            Dim ellipse2 As New Ellipse()
            ellipse2.Margin = New Thickness(10)
            ellipse2.Height = 50
            ellipse2.Width = 50
            ellipse2.Fill = Brushes.Black
            ellipseStackPanel.Children.Add(ellipse2)
            Dim ellipse3 As New Ellipse()
            ellipse3.Margin = New Thickness(10)
            ellipse3.Height = 50
            ellipse3.Width = 50
            ellipse3.Fill = Brushes.Black
            ellipseStackPanel.Children.Add(ellipse3)
            borderStackPanel.Children.Add(ellipseStackPanel)

            myReflectedBorder.Child = borderStackPanel

            ' Create divider rectangle
            Dim dividerRectangle As New Rectangle()
            dividerRectangle.Height = 1
            dividerRectangle.Fill = Brushes.Gray
            dividerRectangle.HorizontalAlignment = HorizontalAlignment.Stretch

            ' Create the object to contain the reflection.
            Dim reflectionRectangle As New Rectangle()

            ' Bind the height of the rectangle to the border height.
            Dim heightBinding As New Binding()
            heightBinding.ElementName = "ReflectedVisual"
            heightBinding.Path = New PropertyPath(Rectangle.HeightProperty)
            BindingOperations.SetBinding(reflectionRectangle, Rectangle.HeightProperty, heightBinding)

            ' Bind the width of the rectangle to the border width.
            Dim widthBinding As New Binding()
            widthBinding.ElementName = "ReflectedVisual"
            widthBinding.Path = New PropertyPath(Rectangle.WidthProperty)
            BindingOperations.SetBinding(reflectionRectangle, Rectangle.WidthProperty, widthBinding)

            ' Creates the reflection.
            Dim myVisualBrush As New VisualBrush()
            myVisualBrush.Opacity = 0.75
            myVisualBrush.Stretch = Stretch.None
            Dim reflectionBinding As New Binding()
            reflectionBinding.ElementName = "ReflectedVisual"
            BindingOperations.SetBinding(myVisualBrush, VisualBrush.VisualProperty, reflectionBinding)

            Dim myScaleTransform As New ScaleTransform()
            myScaleTransform.ScaleX = 1
            myScaleTransform.ScaleY = -1
            Dim myTranslateTransform As New TranslateTransform()
            myTranslateTransform.Y = 1

            Dim myTransformGroup As New TransformGroup()
            myTransformGroup.Children.Add(myScaleTransform)
            myTransformGroup.Children.Add(myTranslateTransform)

            myVisualBrush.RelativeTransform = myTransformGroup

            reflectionRectangle.Fill = myVisualBrush

            ' Create a gradient background for the border.
            Dim firstStop2 As New GradientStop()
            firstStop2.Offset = 0.0
            Dim c1 As New Color()
            c1.R = 0
            c1.G = 0
            c1.B = 0
            c1.A = 255
            firstStop2.Color = c1
            Dim secondStop2 As New GradientStop()
            secondStop2.Offset = 0.5
            Dim c2 As New Color()
            c2.R = 0
            c2.G = 0
            c2.B = 0
            c2.A = 51
            firstStop2.Color = c2
            Dim thirdStop As New GradientStop()
            thirdStop.Offset = 0.75
            Dim c3 As New Color()
            c3.R = 0
            c3.G = 0
            c3.B = 0
            c3.A = 0
            thirdStop.Color = c3

            Dim myGradientStopCollection2 As New GradientStopCollection()
            myGradientStopCollection2.Add(firstStop2)
            myGradientStopCollection2.Add(secondStop2)
            myGradientStopCollection2.Add(thirdStop)

            Dim myLinearGradientBrush2 As New LinearGradientBrush()
            myLinearGradientBrush2.StartPoint = New Point(0.5, 0)
            myLinearGradientBrush2.EndPoint = New Point(0.5, 1)
            myLinearGradientBrush2.GradientStops = myGradientStopCollection2

            reflectionRectangle.OpacityMask = myLinearGradientBrush2

            Dim myBlurBitmapEffect As New BlurBitmapEffect()
            myBlurBitmapEffect.Radius = 1.5

            reflectionRectangle.BitmapEffect = myBlurBitmapEffect

            myStackPanel.Children.Add(myReflectedBorder)
            myStackPanel.Children.Add(dividerRectangle)
            myStackPanel.Children.Add(reflectionRectangle)
            Me.Content = myStackPanel

        End Sub
    End Class
End Namespace
<Page  
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  Background="Black">


  <StackPanel Margin="50">

    <!-- The object to reflect. -->
    <Border Name="ReflectedVisual" Width="400">
      <Border.Background>
        <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
          <GradientStop Offset="0.0" Color="#CCCCFF" />
          <GradientStop Offset="1.0" Color="White" />
        </LinearGradientBrush>
      </Border.Background>
      <StackPanel Orientation="Horizontal" Margin="10">        
        <TextBlock TextWrapping="Wrap" Width="200" Margin="10">
          Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
          Suspendisse vel ante. Donec luctus tortor sit amet est.
          Nullam pulvinar odio et wisi.
          Pellentesque quis magna. Sed pellentesque.
          Nulla euismod.
          Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
        </TextBlock>
        <StackPanel>
          <Ellipse Margin="10" Height="50" Width="50" Fill="Black" />
          <Ellipse Margin="10" Height="50" Width="50" Fill="Black" />
          <Ellipse Margin="10" Height="50" Width="50" Fill="Black" />
        </StackPanel>
      </StackPanel>
    </Border>

    <Rectangle Height="1" Fill="Gray" HorizontalAlignment="Stretch" />

    <!-- The object to contain the reflection.-->
    <Rectangle 
      Height="{Binding Path=ActualHeight, ElementName=ReflectedVisual}" 
      Width="{Binding Path=ActualWidth, ElementName=ReflectedVisual}">
      <Rectangle.Fill>

        <!-- Creates the reflection. -->
        <VisualBrush 
          Opacity="0.75" Stretch="None"
          Visual="{Binding ElementName=ReflectedVisual}">
          <VisualBrush.RelativeTransform>

            <!-- Flip the reflection. -->
            <TransformGroup>
              <ScaleTransform ScaleX="1" ScaleY="-1" />
              <TranslateTransform  Y="1" />
            </TransformGroup>
          </VisualBrush.RelativeTransform>
        </VisualBrush>
      </Rectangle.Fill>

      <Rectangle.OpacityMask>
        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
          <GradientStop Color="#FF000000" Offset="0.0" />
          <GradientStop Color="#33000000" Offset="0.5" />
          <GradientStop Color="#00000000" Offset="0.75" />
        </LinearGradientBrush>
      </Rectangle.OpacityMask>

      <Rectangle.BitmapEffect>
        <BlurBitmapEffect Radius="1.5" />
      </Rectangle.BitmapEffect>
      
    </Rectangle>
  </StackPanel>
</Page>

Ytterligare exempel som visar hur du förstorar delar av skärmen och hur du skapar reflektioner finns i VisualBrush Sample.

TileBrush-funktioner

ImageBrush, DrawingBrushoch VisualBrush är typer av TileBrush objekt. TileBrush-objekt ger dig stor kontroll över hur ett område målas med en bild, ritning eller visuellt. I stället för att bara måla ett område med en enda utsträckt bild kan du till exempel måla ett område med en serie bildpaneler som skapar ett mönster.

En TileBrush har tre primära komponenter: innehåll, paneler och utdataområdet.

TileBrush-komponenter
Komponenter i en TileBrush med en enda panel

Komponenter av en kaklad TileBrush
Komponenter i en TileBrush med flera paneler

Mer information om tiling-funktionerna i TileBrush objekt finns i TileBrush Overview.

Se även