2014-11-11 3 views
3

У меня есть небольшая проблема, у меня есть элемент группы, который я хочу дать фоновому изображению, которое он должен масштабировать, сохраняя его правильные размеры, но по умолчанию он отображает изображение из левого верхнего угла, я хочу, чтобы изображение центрироваться.Изображение UniformFill centered

enter image description here

это мой код

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="15"/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="180" /> 
     <ColumnDefinition Width="300" /> 
    </Grid.ColumnDefinitions> 
    <Border BorderThickness="2" Width="180" Height="101" Grid.RowSpan="2" VerticalAlignment="Top"> 
     <Image Source="{Binding Imageurl} Width="180" Height="101" Grid.Column="0" Grid.RowSpan="2" HorizontalAlignment="Left" Stretch="UniformToFill"></Image> 
    </Border> 
    <TextBlock Text="Example1" Grid.Column="1" Grid.Row="0" VerticalAlignment="Top" /> 
    <TextBlock Text="Example2" Grid.Column="1" Grid.Row="1" VerticalAlignment="Bottom" /> 

ответ

4

Вы должны удалить Ширина и Высоты ваших изображений - вы хотите, чтобы заполнить контейнер таким образом это следует использовать свойства контейнера. Также, если вы хотите, чтобы он был центрирован, вам необходимо определить VerticalAlignment (и, возможно, горизонтальный). Я думаю, что вы ищете:

<Border BorderThickness="2" Width="180" Height="101" Grid.RowSpan="2" VerticalAlignment="Top"> 
    <Image Source="{Binding Imageurl}" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="UniformToFill"/> 
</Border> 

Вам также не нужно Grid.Column="0" Grid.RowSpan="2" в Image - эти свойства не будут иметь эффект - контейнер изображений является Border (который находится внутри Сетка) и там вы должны определить Столбец/RowSpan.

+0

Есть ли конкретная причина, по которой это больше не работает в UWP? –

+0

@ Gold.strike Что здесь не работает? – Romasz

+0

В моем случае источник не настроен через URL-адрес, а через BitmapImage, созданный из массива байтов. Таким образом, изображение остается «левым», а не центрированным ... –