图片随着窗口的大小变化而变化，Why???

Question

为了兼容分辨率，页面使用“ Grid ”  +  " * " 进行布局，详细XAML如下：

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="SLGridFramework.MainPage"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400"
>

<Grid x:Name="LayoutRoot" Background="DarkGreen" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"  >
<Grid.RowDefinitions>
<RowDefinition Height="143" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
        <Grid Margin="0" Height="Auto" Width="Auto"  Background="Red" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="497*"  />
<ColumnDefinition Width="486*"/>
                <ColumnDefinition Width="383*"/>
</Grid.ColumnDefinitions>
<Image Source="/SLGridFramework;component/Images/6_01.jpg"  Height="143"  Grid.Row="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
            <Image Source="/SLGridFramework;component/Images/6_02.jpg"  Height="143"  Grid.Row="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
        </Grid>

</Grid>
</UserControl>

问题一：为什么图片没能填满“Grid”控件的第一列和第三列，怎样让它们填满？？？   设置了"Stretch"为什么不起作用？？？   效果如下图：

问题二：怎样为“Grid”的每一列设置不同的颜色？？？  它一共三列，背景为红色。。。

问题三：这两个图片随着窗口的大小而自动变化，怎么样它们不变呢？？？

      当修改浏览器窗口宽度，将其缩小时，图片的高度也会跟着缩小。效果如下图。

      

      当修改浏览器窗口高度，将其缩小时，图片的宽也会跟着缩小。效果如下图（见回复，每帖只能发两张图。）。

       

      怎样确保无论窗口的高度和宽度怎样变？？？   图片都能填充满“Grid”对应的列。。。应该怎样做？？？用“CompositeTransform”吗？？？

不甚感激。。。

      

---

Science and technology is my lover.

Answer 1

---

Science and technology is my lover.

Answer 2

你好，

图片有个

<Image Stretch="UniformToFill"/>
和
<Image Stretch="Fill"/>

你可以尝试下