WPF or PNG Image shape Path Data

I recently read a post and wrote irregular buttons very well. Hyperlink: http://blog.csdn.net/cmis7645/article/details/7592372#comments

:

Code:

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>

 

The code is not difficult to understand. The key is that the Data in Path is difficult or difficult. According to the author's prompt, using PS and Blend can easily or obtain the data. The detailed process is as follows:

1. Open a PNG Image, press Ctrl, click the layer in the lower right corner, and select the selection area.

2. Select a path, and then select the path generated from the selected area,

3. Select the layer menu and add the layer vector mask, current path,

4. Save it as PSD format.

5. Use Blend to import the PSD file. the Clip of the image is Data.