Comparison of four values for the stretch property of an image control in Silverlight

You can control the display of a picture by setting the value of the stretch property of the image control:

Included values: None, Fill, Uniform, UniformToFill

1  <Gridx:name= "LayoutRoot"Background= "White"Height= "489"Width= "603">2         <ImageHeight= "Max"HorizontalAlignment= "Left"Name= "Image1"Stretch= "None"VerticalAlignment= "Top"Width= "$"Source= "/silverlightapplication1;component/images/2009011911345229.jpg"Margin= "10,14,0,0" />3         <ImageHeight= "Max"HorizontalAlignment= "Left"Margin= "325,14,0,0"Name= "Image2"Stretch= "Fill"VerticalAlignment= "Top"Width= "$"Source= "/silverlightapplication1;component/images/2009011911345229.jpg"Grid.columnspan= "3" />4         <ImageHeight= "Max"HorizontalAlignment= "Left"Margin= "10,239,0,0"Name= "Image3"Stretch= "Uniform"VerticalAlignment= "Top"Width= "$"Source= "/silverlightapplication1;component/images/2009011911345229.jpg"  />5         <ImageHeight= "Max"HorizontalAlignment= "Left"Margin= "325,239,0,0"Name= "Image4"Stretch= "UniformToFill"VerticalAlignment= "Top"Width= "$"Source= "/silverlightapplication1;component/images/2009011911345229.jpg"Grid.columnspan= "3" />6         <TextBlockHeight= " the"HorizontalAlignment= "Left"Margin= "12,166,0,0"Name= "TextBlock1"VerticalAlignment= "Top"Width= "207"textwrapping= "Wrap">7             <Textblock.text>8 None: The picture is loaded directly into the image control without stretching, if the image control is 100x100 and the size of the picture is 1000x1000 only the top 100x100 is displayed9             </Textblock.text>Ten         </TextBlock> One         <TextBlockHeight= " the"HorizontalAlignment= "Left"Margin= "325,166,0,0"Name= "TextBlock2"VerticalAlignment= "Top"Width= "$"textwrapping= "Wrap"Grid.columnspan= "3"> A             <Textblock.text> - Fill: The picture will stretch or shrink to fit the image control's aspect ratio may change -             </Textblock.text> the         </TextBlock> -         <TextBlockHeight= " the"HorizontalAlignment= "Left"Margin= "12,395,0,0"Name= "TextBlock3"textwrapping= "Wrap"VerticalAlignment= "Top"Width= "$" > -             <Textblock.text> - Uniform: The picture stretches to the optimal size (not necessarily filled with the entire image control) to keep the aspect ratio constant +             </Textblock.text> -         </TextBlock> +         <TextBlockHeight= " the"HorizontalAlignment= "Left"Margin= "325,395,0,0"Name= "TextBlock4"VerticalAlignment= "Top"Width= "$"textwrapping= "Wrap"Grid.columnspan= "3"> A UniformToFill: The picture will stretch without changing the aspect ratio, it will fill the entire image control but may be trimmed at         </TextBlock> -     </Grid>