Практическое руководство. Использование элемента изображения
В данном примере показывается способ включения изображений в приложение с помощью элемента Image.
Пример
В следующем примере показано, как отобразить изображение шириной 200 точек. В этом примере Extensible Application Markup Language (XAML) для задания изображения используется синтаксис атрибута и синтаксис тега свойства. Дополнительные сведения о синтаксисе атрибута и синтаксисе свойства см. в разделе Общие сведения о свойствах зависимости. BitmapImage используется для определения источника данных изображения и явно задается для примера синтаксиса тега свойства. Кроме того, для DecodePixelWidth BitmapImage устанавливается такая же ширина, как и для Width Image. Это сделано для минимизации объема памяти при визуализации изображения.
.gif "Примечание") Примечание |
|---|
Как правило, если требуется указать размер визуализируемого изображения, устанавливается только Width или Height, но не оба сразу.Если задано одно свойство, то пропорции изображения сохраняются.В противном случае изображение может оказаться растянутым или перекошенным.Для управления растяжением изображения используются свойства Stretch и StretchDirection. |
| Примечание |
|---|
При указании размера изображения с помощью Width или Height следует также задать для DecodePixelWidth, либо DecodePixelHeight тот же соответствующий размер. |
Свойство Stretch определяет, как изображение источника имиджа растягивается для заполнения элемента изображения. Дополнительные сведения см. в разделе Stretch.
<!-- Simple image rendering. However, rendering an image this way may not
result in the best use of application memory. See markup below which
creates the same end result but using less memory. -->
<Image Width="200"
Source="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Water Lilies.jpg"/>
<Image Width="200">
<Image.Source>
<!-- To save significant application memory, set the DecodePixelWidth or
DecodePixelHeight of the BitmapImage value of the image source to the desired
height and width of the rendered image. If you don't do this, the application will
cache the image as though it were rendered as its normal size rather then just
the size that is displayed. -->
<!-- Note: In order to preserve aspect ratio, only set either DecodePixelWidth
or DecodePixelHeight but not both. -->
<BitmapImage DecodePixelWidth="200"
UriSource="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Water Lilies.jpg" />
</Image.Source>
</Image>
В следующем примере показано, как отобразить изображение шириной 200 точек с помощью кода.
| Примечание |
|---|
Установка свойств BitmapImage должна быть выполнена внутри блока BeginInit и EndInit. |
' Create Image Element
Dim myImage As New Image()
myImage.Width = 200
' Create source
Dim myBitmapImage As New BitmapImage()
' BitmapImage.UriSource must be in a BeginInit/EndInit block
myBitmapImage.BeginInit()
myBitmapImage.UriSource = New Uri("C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Water Lilies.jpg")
' To save significant application memory, set the DecodePixelWidth or
' DecodePixelHeight of the BitmapImage value of the image source to the desired
' height or width of the rendered image. If you don't do this, the application will
' cache the image as though it were rendered as its normal size rather then just
' the size that is displayed.
' Note: In order to preserve aspect ratio, set DecodePixelWidth
' or DecodePixelHeight but not both.
myBitmapImage.DecodePixelWidth = 200
myBitmapImage.EndInit()
'set image source
myImage.Source = myBitmapImage
// Create Image Element
Image myImage = new Image();
myImage.Width = 200;
// Create source
BitmapImage myBitmapImage = new BitmapImage();
// BitmapImage.UriSource must be in a BeginInit/EndInit block
myBitmapImage.BeginInit();
myBitmapImage.UriSource = new Uri(@"C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Water Lilies.jpg");
// To save significant application memory, set the DecodePixelWidth or
// DecodePixelHeight of the BitmapImage value of the image source to the desired
// height or width of the rendered image. If you don't do this, the application will
// cache the image as though it were rendered as its normal size rather then just
// the size that is displayed.
// Note: In order to preserve aspect ratio, set DecodePixelWidth
// or DecodePixelHeight but not both.
myBitmapImage.DecodePixelWidth = 200;
myBitmapImage.EndInit();
//set image source
myImage.Source = myBitmapImage;