如何在 wpf 中对 TextBlock 应用投影、内阴影、渐变叠加效果答案

【问题标题】：How to apply Drop Shadow , Inner Shadow , Gradient Overlay Effect to TextBlock in wpf如何在 wpf 中对 TextBlock 应用投影、内阴影、渐变叠加效果
【发布时间】：2013-10-25 12:40:32
【问题描述】：

我的 PSD 有以下效果：-

==============阴影=============

-混合模式：- 相乘

-颜色：-黑色

-不透明度：- 50%

-天使：- 90

=========内影=================

-混合模式：- 正常

-颜色：- 白色

-不透明度：- 62%

-天使：- 120

=======渐变叠加===============

-混合模式：- 正常

-不透明度：- 100%

-天使：- 90

-开始颜色：-#8a8a8a

-结束颜色：- #ffffff

以下图片来自psd

如何应用到 Textblack 我已经应用了以下代码：-

<TextBlock x:Name="lblTitle" Margin="5" Foreground="#FFFFFFFF" FontWeight="Bold" FontSize="20" FontFamily="Arial Bold"
                            TextOptions.TextFormattingMode="Display"  TextAlignment="Left" TextWrapping="Wrap" Text="Tournament: $3 + $0.30 KO Sit and Go">
                                    <TextBlock.Effect>
                                        <DropShadowEffect Color="Black" Opacity="50" Direction="-90" RenderingBias="Quality" ShadowDepth="2" >

 </DropShadowEffect>
    </TextBlock.Effect>
     </TextBlock>

【问题讨论】：

标签： wpf wpf-controls

【解决方案1】：

Hi we can add the  Inner Shadow as follows

<Grid Height="100" Width="600" Margin="100,100,100,100">
        <Border Background="LightGray" BorderBrush="DarkGray" 
           BorderThickness="1" ClipToBounds="True">
            <Border Background="Transparent" BorderBrush="Black" 
              BorderThickness="1" Margin="-2">
                <Border.Effect>
                    <DropShadowEffect ShadowDepth="0" BlurRadius="10">
                    </DropShadowEffect>
                </Border.Effect>

            <TextBlock x:Name="lblTitle" Margin="5" Foreground="#FFFFFFFF" FontWeight="Bold" FontSize="20" FontFamily="Arial Bold"
        TextOptions.TextFormattingMode="Display"  TextAlignment="Left" TextWrapping="Wrap" Text="Tournament: $3 + $0.30 KO Sit and Go">
            <TextBlock.Effect>
                <DropShadowEffect Color="Black" Opacity="50" Direction="-90" RenderingBias="Quality" ShadowDepth="2" >

                </DropShadowEffect>

            </TextBlock.Effect>

        </TextBlock>
            </Border>
        </Border> 

    </Grid>

【讨论】：

【解决方案2】：

    Hi  this may help you in adding inner shadow and gradient overlay effect to TextBlock                                                                                          


  <Grid Height="100" Width="600" Margin="100,100,100,100">
        <Border Background="LightGray" BorderBrush="DarkGray" 
           BorderThickness="1" ClipToBounds="True">
            <Border Background="Transparent" BorderBrush="Black" 
              BorderThickness="1" Margin="-2">
                <Border.Effect>
                    <DropShadowEffect ShadowDepth="0" BlurRadius="10">
                    </DropShadowEffect>
                </Border.Effect>

            <TextBlock x:Name="lblTitle" Margin="5"  FontWeight="Bold" FontSize="20" FontFamily="Arial Bold"
        TextOptions.TextFormattingMode="Display"  TextAlignment="Left" TextWrapping="Wrap" Text="Tournament: $3 + $0.30 KO Sit and Go">
                    <TextBlock.Foreground>
                        <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
                            <GradientStop Color="White" Offset="0"/>
                            <GradientStop x:Name="WhiteOffset" Color="White" Offset="1"/>
                            <GradientStop x:Name="GrayOffset" Color="Gray" Offset="1"/>
                        </LinearGradientBrush>
                    </TextBlock.Foreground>
                    <TextBlock.Triggers>
                        <EventTrigger RoutedEvent="Loaded">
                            <BeginStoryboard>
                                <Storyboard Storyboard.TargetProperty="Offset" Duration="0:0:1" RepeatBehavior="Forever">
                                    <DoubleAnimation Storyboard.TargetName="WhiteOffset" From="0" To="1" />
                                    <DoubleAnimation Storyboard.TargetName="GrayOffset" From="0" To="1" />
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                    </TextBlock.Triggers>
                    <TextBlock.Effect>
                <DropShadowEffect Color="Black" Opacity="50" Direction="-90" RenderingBias="Quality" ShadowDepth="2" >

                </DropShadowEffect>

            </TextBlock.Effect>

        </TextBlock>
            </Border>
        </Border> 

    </Grid>

【讨论】：