2011-10-13 75 views
4

我有一個網格與各種子元素,如Grid,Stackpanel,圖片 ...是否有可能以一種裁剪所有內容的方式四捨五入網格的角落?此外,根網格的大小可能會有所不同,因此無法進行硬編碼。Silverlight舍入角落

編輯:經過大量的搜索後,我發現這個問題的最佳解決方案是使用ClippingBehavior作爲@wdavo的抱怨,謝謝!真正的問題是不知道圖像的尺寸。如果您知道尺寸,那麼現在有許多簡單的現成解決方案。

回答

1

您可以使用這條新聞的行爲

http://expressionblend.codeplex.com/SourceControl/changeset/view/61176#494852

你需要安裝Expression Blend SDK

<UserControl 
x:Class="RoundedCorners.MainPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
xmlns:behaviors="clr-namespace:Expression.Samples.Interactivity" 
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" 
mc:Ignorable="d" 
d:DesignHeight="800" 
d:DesignWidth="800"> 
<Grid 
    x:Name="LayoutRoot" 
    Background="White" 
    Margin="50"> 
    <Grid 
     Background="LightGreen"> 
     <Grid.RowDefinitions> 
      <RowDefinition /> 
      <RowDefinition 
       Height="Auto" /> 
     </Grid.RowDefinitions> 
     <i:Interaction.Behaviors> 
      <behaviors:ClippingBehavior 
       CornerRadius="30" /> 
     </i:Interaction.Behaviors> 
     <Image 
      Grid.Row="0" 
      Stretch="Fill" 
      Source="Image.JPG" /> 
     <StackPanel 
      Grid.Row="1"> 
      <TextBlock 
       Text="Hello" /> 
      <TextBlock 
       Text="World" /> 
     </StackPanel> 
    </Grid> 
</Grid> 

0

你可以通過電網或堆疊面板插入到邊境控制,就像下面的代碼:

  <Border CornerRadius="5,5,0,5" BorderThickness="2" BorderBrush="Black" HorizontalAlignment="Center" Width="100" Height="100" VerticalAlignment="Center"> 
      <StackPanel> 
       <StackPanel.Background> 
        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
         <GradientStop Color="Black" Offset="0"/> 
         <GradientStop Color="#FF030FC6" Offset="0.2"/> 
        </LinearGradientBrush> 
       </StackPanel.Background> 
      </StackPanel> 

     </Border> 
     <Border CornerRadius="5,5,0,5" BorderThickness="2" BorderBrush="Black" HorizontalAlignment="Left" Width="100" Height="100" VerticalAlignment="Center" Margin="68.833,0,0,0"> 
      <Border.Background> 
       <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
        <GradientStop Color="Black" Offset="0"/> 
        <GradientStop Color="#FFE90D0D" Offset="1"/> 
       </LinearGradientBrush> 
      </Border.Background> 
      <Grid/> 
     </Border> 
+0

-1如果容器中有圖像標籤,那麼它不會被裁剪,這是問題的重要組成部分。這就是爲什麼我讓圖像變得粗體。感謝您的刺! – Craig