scatterview项目的圆角 - Microsoft Surface SDK

发布于 2024-09-29 19:15:45 字数 1388 浏览 3 评论 0原文

我有一个图像覆盖在 scatterview 项目上。 scatterview 项目包含堆栈面板和一些文本块。在覆盖主窗口的背景并将其设置为透明时，我仍然可以看到与图像不能很好地融合的角落。

我正在使用 surfaceusercontrol 在 scatterview 中添加表面项目。代码如下：

<s:SurfaceUserControl x:Class="Models.ModelItemControl"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:s="http://schemas.microsoft.com/surface/2008" Width="110" Background="Transparent">

  <Grid>
    <Grid.Background>
      <ImageBrush ImageSource="pack://application:,,,/Resources/models_card_150-01.png" Opacity="1.0" Stretch="Fill" />
    </Grid.Background>
    <Viewbox >
    <StackPanel MaxWidth="250" MinHeight="300">
    <TextBlock Name="ItemTitle" Margin="5,5,5,5" TextWrapping="Wrap" Visibility="Visible" Padding="2" />
    <Image Name="ItemImage" Margin="5,5,5,5"  Visibility="Visible" MaxHeight="100"/>
    <TextBlock Name="ItemDesc"  Margin="5,5,5,0" TextWrapping="Wrap" Visibility="Visible" Padding="2" />
    <s:SurfaceToggleButton Checked="ItemInfo_Checked" Unchecked="ItemInfo_Unchecked" Margin="5,0,5,0" HorizontalAlignment="Center" VerticalAlignment="Center">Display more info</s:SurfaceToggleButton>
    </StackPanel>
    </Viewbox>
    </Grid>
</s:SurfaceUserControl>

我想要一种将角剪成圆形而不是矩形的方法。

原文

I have an image overlaid on the scatterview item. The scatterview item contains stackpanel and few textblocks. On overlaying and putting the main window's background as transparent, I can still see the corners which do not gel well with the image.

I am using surfaceusercontrol to add surface items in scatterview. The code is below:

<s:SurfaceUserControl x:Class="Models.ModelItemControl"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:s="http://schemas.microsoft.com/surface/2008" Width="110" Background="Transparent">

  <Grid>
    <Grid.Background>
      <ImageBrush ImageSource="pack://application:,,,/Resources/models_card_150-01.png" Opacity="1.0" Stretch="Fill" />
    </Grid.Background>
    <Viewbox >
    <StackPanel MaxWidth="250" MinHeight="300">
    <TextBlock Name="ItemTitle" Margin="5,5,5,5" TextWrapping="Wrap" Visibility="Visible" Padding="2" />
    <Image Name="ItemImage" Margin="5,5,5,5"  Visibility="Visible" MaxHeight="100"/>
    <TextBlock Name="ItemDesc"  Margin="5,5,5,0" TextWrapping="Wrap" Visibility="Visible" Padding="2" />
    <s:SurfaceToggleButton Checked="ItemInfo_Checked" Unchecked="ItemInfo_Unchecked" Margin="5,0,5,0" HorizontalAlignment="Center" VerticalAlignment="Center">Display more info</s:SurfaceToggleButton>
    </StackPanel>
    </Viewbox>
    </Grid>
</s:SurfaceUserControl>

I want a method to clip the corners to round shape instead of rectangular.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

一世旳自豪 2024-10-06 19:15:45

您看到的可能是 ScatterViewItems 阴影，而不是您的 UserControl。您可以使用以下方法删除代码隐藏中的阴影：

item.ApplyTemplate();
item.Background = new SolidColorBrush(Colors.Transparent);
item.ShowsActivationEffects = false;
Microsoft.Surface.Presentation.Generic.SurfaceShadowChrome ssc;
ssc = item.Template.FindName("shadow", item) as Microsoft.Surface.Presentation.Generic.SurfaceShadowChrome;
ssc.Visibility = Visibility.Hidden;

这假设 item 是您的 ScatterViewItem。查看 SDK 中的 ScatterViewPuzzle，了解如何为 ScatterViewItem 创建自定义形状。

Possibly what you see is the ScatterViewItems shadow and not your UserControl. You can remove the shadow in code-behind using this:

item.ApplyTemplate();
item.Background = new SolidColorBrush(Colors.Transparent);
item.ShowsActivationEffects = false;
Microsoft.Surface.Presentation.Generic.SurfaceShadowChrome ssc;
ssc = item.Template.FindName("shadow", item) as Microsoft.Surface.Presentation.Generic.SurfaceShadowChrome;
ssc.Visibility = Visibility.Hidden;

This assumes item being your ScatterViewItem. Have a look at the ScatterViewPuzzle from the SDK to see how to make a custom shape for a ScatterViewItem.

回复收藏 0 原文