现在的位置: 首页 > 综合 > 正文

WPF 或得PNG图片的外形Path的Data

2012年09月17日 ⁄ 综合 ⁄ 共 2322字 ⁄ 字号 评论关闭

    最近看一个帖子,做不规则按钮,写的非常好。超链接:http://blog.csdn.net/cmis7645/article/details/7592372#comments

效果图:

代码:

View Code

<Window x:Class="WpfApplication1.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="300" Width="300">
    <Window.Resources>
        <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                            <Path x:Name="m_Path" 
                                  Data="F1M9,0C11.666,0.333 14.334,0.667 17,1 22.845,5.421 25.898,
                                  21.658 28,29 27.333,29.333 26.667,29.667 26,30 19.868,25.697 5.596,
                                  23.229 3,19 0.692,16.443 0.29,14.946 0,10 2.591,4.864 4.881,3.405 9,0z"
                                   Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                                <Path.RenderTransform>
                                    <TransformGroup>
                                        <ScaleTransform/>
                                        <SkewTransform/>
                                        <RotateTransform/>
                                        <TranslateTransform/>
                                    </TransformGroup>
                                </Path.RenderTransform>
                                <Path.Effect>
                                    <DropShadowEffect ShadowDepth="0" BlurRadius="15" Color="#FF646464"/>
                                </Path.Effect>
                                <Path.Fill>
                                    <ImageBrush ImageSource="search1_Images\Image.png"/>
                                </Path.Fill>
                            </Path>
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Content=""/>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsFocused" Value="True"/>
                            <Trigger Property="IsDefaulted" Value="True"/>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="RenderTransform" TargetName="m_Path">
                                    <Setter.Value>
                                        <TransformGroup>
                                            <ScaleTransform ScaleX="1.1" ScaleY="1.1"/>
                                            <SkewTransform/>
                                            <RotateTransform/>
                                            <TranslateTransform/>
                                        </TransformGroup>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Effect" TargetName="m_Path">
                                    <Setter.Value>
                                        <DropShadowEffect BlurRadius="15" Color="Red" ShadowDepth="0"/>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False"/>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Content="Button"  Style="{DynamicResource ButtonStyle1}" Height="23" Width="23" Margin="23,24,223,205" />
    </Grid>
</Window>

 

代码不是很难理解,关键是Path的Data比较难或得。根据作者提示,用PS和Blend能够比较轻松的或得这些数据。详细过程如下:

1、打开一张PNG图片,并 按住Ctrl,然后点击右下方的图层,选中选区

2、选择路径,然后选择 从选区生成路径,

3、选择图层菜单,添加图层矢量蒙版,当前路径,

4、保存为PSD格式的就可以了。

5、用Blend导入PSD文件,图片的Clip就是Data数据。

 

抱歉!评论已关闭.