[英]Shadow without "spill"
正如您在左側和右側看到的那樣,陰影正在“溢出”,但我希望陰影只是 go 向上而不是兩側。 我怎樣才能做到這一點? 這是我到目前為止的代碼:
<UserControl x:Class="Client.Views.CartItemToolBar"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:ctrl="clr-namespace:Client.Controls"
xmlns:local="clr-namespace:Client.Views"
mc:Ignorable="d">
<Grid Height="56" Background="{StaticResource color_white}" Margin="2,0">
<Border Background="Transparent" BorderBrush="{Binding Path=Background, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Grid}}" BorderThickness="0,10,0,0">
<Border.Effect>
<DropShadowEffect ShadowDepth="0" BlurRadius="16" Direction="90" />
</Border.Effect>
</Border>
<StackPanel Orientation="Horizontal" Background="{Binding Path=Background, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Grid}}">
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="CartItem/Minus">
<ctrl:IconViewbox IconData="{StaticResource IconPathNumericNegative1}" IconSize="20" RenderTransformOrigin="0.5,0.5" >
<ctrl:IconViewbox.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform X="-4" Y="-4"/>
</TransformGroup>
</ctrl:IconViewbox.RenderTransform>
</ctrl:IconViewbox>
</ctrl:TestButton>
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="CartItem/Plus" >
<ctrl:IconViewbox IconData="{StaticResource IconPathNumericPositive1}" IconSize="20" RenderTransformOrigin="0.5,0.5" >
<ctrl:IconViewbox.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform X="-4" Y="-4"/>
</TransformGroup>
</ctrl:IconViewbox.RenderTransform>
</ctrl:IconViewbox>
</ctrl:TestButton>
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" Content="Change Price" PosAction="CartItem/ChangePrice" />
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="UI/SwitchTo/CartItemDiscount">
<Grid>
<Label Margin="0" Padding="0">Pos Discount</Label>
</Grid>
</ctrl:TestButton>
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="CartItem/Remove">
<ctrl:IconViewbox IconData="{StaticResource IconPathTrashCan}" IconSize="20" />
</ctrl:TestButton>
</StackPanel>
</Grid>
感謝 Clemens 的評論,經過一番嘗試,我找到了答案。 我忘記了負邊距可以在邊界“之外”顯示控件。
<UserControl x:Class="Client.Views.CartItemToolBar"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:ctrl="clr-namespace:Client.Controls"
xmlns:local="clr-namespace:Client.Views"
mc:Ignorable="d">
<Grid Margin="2,0,0,0">
<Rectangle Margin="0,-12,0,56">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0.5,1" EndPoint="0.5,0">
<GradientStop Color="#DDDDDD" Offset="0" />
<GradientStop Color="Transparent" Offset="1" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Grid Height="56" Background="{StaticResource color_white}">
<StackPanel Orientation="Horizontal" Background="{Binding Path=Background, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Grid}}">
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="CartItem/Minus">
<ctrl:IconViewbox IconData="{StaticResource IconPathNumericNegative1}" IconSize="20" RenderTransformOrigin="0.5,0.5" >
<ctrl:IconViewbox.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform X="-4" Y="-4"/>
</TransformGroup>
</ctrl:IconViewbox.RenderTransform>
</ctrl:IconViewbox>
</ctrl:TestButton>
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="CartItem/Plus" >
<ctrl:IconViewbox IconData="{StaticResource IconPathNumericPositive1}" IconSize="20" RenderTransformOrigin="0.5,0.5" >
<ctrl:IconViewbox.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform X="-4" Y="-4"/>
</TransformGroup>
</ctrl:IconViewbox.RenderTransform>
</ctrl:IconViewbox>
</ctrl:TestButton>
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" Content="Change Price" PosAction="CartItem/ChangePrice" />
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="UI/SwitchTo/CartItemDiscount">
<Grid>
<Label Margin="0" Padding="0">Pos Discount</Label>
</Grid>
</ctrl:TestButton>
<ctrl:TestButton Style="{StaticResource ButtonCartPositionAction}" PosAction="CartItem/Remove">
<ctrl:IconViewbox IconData="{StaticResource IconPathTrashCan}" IconSize="20" />
</ctrl:TestButton>
</StackPanel>
</Grid>
</Grid>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.