加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > Windows > 正文

使用带Stretch的图像控制= UniformToFill – WP7

发布时间:2020-12-14 02:09:28 所属栏目:Windows 来源:网络整理
导读:我在页面上放置了一个图像,如下所示 Grid x:Name="LayoutRoot" Background="Transparent" Grid.RowDefinitions RowDefinition Height="Auto"/ RowDefinition Height="*"/ /Grid.RowDefinitionsImage Name="im" Source="/images/hqdefault.jpg" Height="250"
我在页面上放置了一个图像,如下所示

<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从底部裁剪图像的内容,因为我期望它从顶部和底部均匀地裁剪,并保持图像内容在图像控制中居中.

HOpe我已经明确表示,如果不是,请考虑从提供的代码中提取样本.非常感谢.

解决方法

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

<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;
    }

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读