Gewusst wie: Beibehalten des Seitenverhältnisses bei einem als Hintergrund verwendeten Bild
In diesem Beispiel wird gezeigt, wie mithilfe der Stretch-Eigenschaft eines ImageBrush-Objekts das Seitenverhältnis eines Bildes beibehalten wird.
Wenn Sie mit einem ImageBrush einen Bereich zeichnen, wird dessen Inhalt standardmäßig so gestreckt, dass er den Ausgabebereich vollständig ausfüllt. Wenn der Ausgabebereich und das Bild unterschiedliche Seitenverhältnisse aufweisen, wird das Bild durch dieses Strecken verzerrt.
Damit ein ImageBrush das Seitenverhältnis beibehält, müssen Sie für die Stretch-Eigenschaft Uniform oder UniformToFill festlegen.
Beispiel
Im folgenden Beispiel werden zwei ImageBrush-Objekte verwendet, um zwei Rechtecke zu zeichnen. Jedes Rechteck ist 300 x 150 Pixel groß und enthält jeweils ein 300 x 300 Pixel großes Bild. Für die Stretch-Eigenschaft des ersten Pinsels wird Uniform und für die Stretch-Eigenschaft des zweiten Pinsels UniformToFill festgelegt.
Imports System
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Media.Imaging
Imports System.Windows.Media
Imports System.Windows.Shapes
Namespace Microsoft.Samples.Graphics.UsingImageBrush
''' <summary>
''' Demonstrates different ImageBrush Stretch settings.
''' </summary>
Public Class StretchModes
Inherits Page
Public Sub New()
' Create an ImageBrush with its Stretch
' property set to Uniform. The image it
' contains will be expanded as much as possible
' to fill the output area while still
' preserving its aspect ratio.
Dim uniformBrush As New ImageBrush()
uniformBrush.ImageSource = New BitmapImage(New Uri("sampleImages\square.jpg", UriKind.Relative))
uniformBrush.Stretch = Stretch.Uniform
' Freeze the brush (make it unmodifiable) for performance benefits.
uniformBrush.Freeze()
' Create a rectangle and paint it with the ImageBrush.
Dim rectangle1 As New Rectangle()
With rectangle1
.Width = 300
.Height = 150
.Stroke = Brushes.MediumBlue
.StrokeThickness = 1.0
.Fill = uniformBrush
End With
' Create an ImageBrush with its Stretch
' property set to UniformToFill. The image it
' contains will be expanded to completely fill
' the rectangle, but its aspect ratio is preserved.
Dim uniformToFillBrush As New ImageBrush()
uniformToFillBrush.ImageSource = New BitmapImage(New Uri("sampleImages\square.jpg", UriKind.Relative))
uniformToFillBrush.Stretch = Stretch.UniformToFill
' Freeze the brush (make it unmodifiable) for performance benefits.
uniformToFillBrush.Freeze()
' Create a rectangle and paint it with the ImageBrush.
Dim rectangle2 As New Rectangle()
With rectangle2
.Width = 300
.Height = 150
.Stroke = Brushes.MediumBlue
.StrokeThickness = 1.0
.Margin = New Thickness(0, 10, 0, 0)
.Fill = uniformToFillBrush
End With
Dim mainPanel As New StackPanel()
mainPanel.Children.Add(rectangle1)
mainPanel.Children.Add(rectangle2)
Content = mainPanel
Background = Brushes.White
Margin = New Thickness(20)
Title = "ImageBrush Stretch Modes"
End Sub
End Class
End Namespace
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Imaging;
using System.Windows.Media;
using System.Windows.Shapes;
namespace Microsoft.Samples.Graphics.UsingImageBrush
{
/// <summary>
/// Demonstrates different ImageBrush Stretch settings.
/// </summary>
public class StretchModes : Page
{
public StretchModes()
{
// Create an ImageBrush with its Stretch
// property set to Uniform. The image it
// contains will be expanded as much as possible
// to fill the output area while still
// preserving its aspect ratio.
ImageBrush uniformBrush = new ImageBrush();
uniformBrush.ImageSource =
new BitmapImage(new Uri("sampleImages\\square.jpg", UriKind.Relative));
uniformBrush.Stretch = Stretch.Uniform;
// Freeze the brush (make it unmodifiable) for performance benefits.
uniformBrush.Freeze();
// Create a rectangle and paint it with the ImageBrush.
Rectangle rectangle1 = new Rectangle();
rectangle1.Width = 300;
rectangle1.Height = 150;
rectangle1.Stroke = Brushes.MediumBlue;
rectangle1.StrokeThickness = 1.0;
rectangle1.Fill = uniformBrush;
// Create an ImageBrush with its Stretch
// property set to UniformToFill. The image it
// contains will be expanded to completely fill
// the rectangle, but its aspect ratio is preserved.
ImageBrush uniformToFillBrush = new ImageBrush();
uniformToFillBrush.ImageSource =
new BitmapImage(new Uri("sampleImages\\square.jpg", UriKind.Relative));
uniformToFillBrush.Stretch = Stretch.UniformToFill;
// Freeze the brush (make it unmodifiable) for performance benefits.
uniformToFillBrush.Freeze();
// Create a rectangle and paint it with the ImageBrush.
Rectangle rectangle2 = new Rectangle();
rectangle2.Width = 300;
rectangle2.Height = 150;
rectangle2.Stroke = Brushes.MediumBlue;
rectangle2.StrokeThickness = 1.0;
rectangle2.Margin = new Thickness(0, 10, 0, 0);
rectangle2.Fill = uniformToFillBrush;
StackPanel mainPanel = new StackPanel();
mainPanel.Children.Add(rectangle1);
mainPanel.Children.Add(rectangle2);
Content = mainPanel;
Background = Brushes.White;
Margin = new Thickness(20);
Title = "ImageBrush Stretch Modes";
}
}
}
<!-- Demonstrates different ImageBrush Stretch settings.-->
<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"
Title="ImageBrush Stretch Modes">
<StackPanel>
<!-- The ImageBrush in this example has its
Stretch property set to Uniform. As a result,
the image it contains is expanded as much as possible
to fill the rectangle while
still preserving its aspect ratio.-->
<Rectangle
Width="300" Height="150"
Stroke="MediumBlue" StrokeThickness="1">
<Rectangle.Fill>
<ImageBrush
Stretch="Uniform" ImageSource="sampleImages\square.jpg"
PresentationOptions:Freeze="True" />
</Rectangle.Fill>
</Rectangle>
<!-- The ImageBrush in this example has its
Stretch property set to UniformToFill. As a result,
the image is expanded to completely fill
the rectangle, but its aspect ratio is preserved.-->
<Rectangle
Width="300" Height="150"
Stroke="MediumBlue" StrokeThickness="1"
Margin="0,10,0,0">
<Rectangle.Fill>
<ImageBrush
Stretch="UniformToFill" ImageSource="sampleImages\square.jpg"
PresentationOptions:Freeze="True" />
</Rectangle.Fill>
</Rectangle>
</StackPanel>
</Page>
Die folgende Abbildung zeigt die Ausgabe des ersten Pinsels, bei dem für Stretch der Wert Uniform festgelegt ist.
.jpg "ImageBrush mit Uniform-Dehnung")
Die nächste Abbildung zeigt die Ausgabe des zweiten Pinsels, bei dem für Stretch der Wert UniformToFill festgelegt ist.
.jpg "ImageBrush mit UniformToFill-Dehnung")
Beachten Sie, dass sich die Stretch-Eigenschaft bei den anderen TileBrush-Objekten (d.h. DrawingBrush und VisualBrush) genauso verhält. Weitere Informationen über ImageBrush und die anderen TileBrush-Objekte finden Sie unter Zeichnen mit Bildern, Zeichnungen und visuellen Elementen.
Beachten Sie auch, dass die Stretch-Eigenschaft zwar anzugeben scheint, wie der TileBrush-Inhalt gestreckt wird, damit er in den Ausgabebereich passt, dass sie tatsächlich aber angibt, wie der TileBrush-Inhalt gestreckt wird, damit er die Basisfläche ausfüllt. Weitere Informationen finden Sie unter TileBrush.
Dieses Codebeispiel ist Teil eines umfangreicheren Beispiels für die ImageBrush-Klasse. Das vollständige Beispiel finden Sie unter ImageBrush Sample.