image - 使用带有 Stretch = UniformToFill 的图像控件 - WP7

标签 image windows-phone-7.1 vertical-alignment stretch uniform

我在页面上放置了一个图像,如下所示

<Grid x:Name="LayoutRoot" Background="Transparent">
   <Grid.RowDefinitions>
     <RowDefinition Height="Auto"/>
     <RowDefinition Height="*"/>
   </Grid.RowDefinitions>

<Image Name="im" Source="/images/hqdefault.jpg" Height="250" Stretch="UniformToFill"  VerticalAlignment="Center"/>
    </Grid>

这是整个页面的XAML,图片可以从http://i.ytimg.com/vi/wNKKCHv-oOw/hqdefault.jpg下载

后面的代码包含一些处理 PageOrientation_Change 的逻辑
 private void PhoneApplicationPage_OrientationChanged(object sender, OrientationChangedEventArgs e)
 {
    if (Orientation == PageOrientation.Landscape ||
        Orientation == PageOrientation.LandscapeLeft ||
        Orientation == PageOrientation.LandscapeRight)
    {
       im.Height = Application.Current.Host.Content.ActualWidth;
       im.Width = Application.Current.Host.Content.ActualHeight;

       im.VerticalAlignment = System.Windows.VerticalAlignment.Bottom;
       im.HorizontalAlignment = System.Windows.HorizontalAlignment.Right;
     }
     else
     {
       im.Height = 250;
       im.Width = Application.Current.Host.Content.ActualWidth;
     }
  }

如果有人可能会尝试这个,他/她可能会发现 StrechToFill 从底部裁剪图像的内容,正如我所期望的那样,它可以从顶部和底部同等地裁剪它,并将图像内容保持在图像控件的中心。

希望我已经明确表示,如果不是,请考虑使用提供的代码制作示例。非常感谢。

最佳答案

主要问题是在图像控件上设置高度或宽度,我现在很清楚不要在图像控件或媒体元素上提供高度或宽度。如果您需要一个固定的高度,例如在纵向模式下,您可以将其放在网格控件中并设置其高度或宽度。以下是对我有用的代码。

<Grid Name="grdMedia"
      Grid.Row="1" 
      VerticalAlignment="Stretch" 
      HorizontalAlignment="Stretch"
      Height="250">
<Image Name="imThumbnail" 
       Grid.Row="1" 
       Stretch="UniformToFill" 
       HorizontalAlignment="Center"
       VerticalAlignment="Center"/>
</Grid>

如果您想在横向模式下将此图片更改为全屏,请使用以下代码
    private void SetUIInLandscape()
    {
        SystemTray.IsVisible = false;

       //Do not change the height or width of image control nor its alignments 
       //Hide every thing else

        grdMedia.Height = Application.Current.Host.Content.ActualWidth;
        grdMedia.Width = Application.Current.Host.Content.ActualHeight;

    }

    private void SetUIInPortrait()
    {
        SystemTray.IsVisible = true;

        //Do not change the height or width of image control nor its alignments
        //Make every thing else visible

        grdMedia.Height = 250;
        grdMedia.Width = Application.Current.Host.Content.ActualWidth;
    }

关于image - 使用带有 Stretch = UniformToFill 的图像控件 - WP7,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8540385/

相关文章:

php - 如何使用 PHP 从数据库中检索图像

windows-phone-7 - 锁定屏幕中的芒果提醒

wcf - Windows Phone 7.1 (Mango) 上的 NetTcpBinding

android - 在android TextView中垂直对齐后缀与制表符空间

html - 在列方向上的 flexbox 中的内联 block

Javascript 图像大小和定位

image - 使用 ImageMagick 将不同的图像格式批量转换/调整大小为特定分辨率的 JPEG

image - 水平和垂直一维高斯滤波器

windows-phone-7 - Windows Phone 应用程序栏的图标颜色

css - 如何垂直居中对齐背景图像与文本?