1.首先看下最終的效果

2.達到這種效果的方法是通過對Button的Style進行控制，首先是形狀的控制，程式碼如下：

<Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button" >
                        <Border x:Name="border" BorderThickness="0" BorderBrush="Gray" SnapsToDevicePixels
 
="True">
                            <Border.Background>
                                <DrawingBrush>
                                    <DrawingBrush.Drawing>
                                        <GeometryDrawing Brush="{Binding Brush}">
                                            <
 
GeometryDrawing.Pen>
                                                <Pen  Thickness="3" Brush="Gray"></Pen>
                                            </GeometryDrawing.Pen>
                                            <GeometryDrawing.Geometry >
                                                <
 
PathGeometry  Figures="m-70 -80 L200 -80 L230 0 L200 80  L-70 80 A 10,10 0 0 1 -80,70  L-80 70 L-80 -70  A 10,10 0 0 1 -70,-80"></PathGeometry>
                                            </GeometryDrawing.Geometry>
                                        </GeometryDrawing>
                                    </DrawingBrush.Drawing>
                                </DrawingBrush>
                            </Border.Background>
                            <TextBlock Text="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>

其中

<GeometryDrawing.Pen>
         <Pen  Thickness="3" Brush="Gray"></Pen>
</GeometryDrawing.Pen>

這是對外輪廓的屬性設定 ；

<GeometryDrawing.Geometry >
         <PathGeometry  Figures="m-70 -80 L200 -80 L230 0 L200 80  
          L-70 80 A 10,10 0 0 1 -80,70  L-80 70 L-80 -70  A 10,10 0 0 
          1 -70,-80">
         </PathGeometry>
</GeometryDrawing.Geometry>

這邊是對輪廓的點的設定，這邊簡單解釋一下：

M 是值起始點（Move移動到某一個位置）大寫的 M 指示 startPoint 是絕對值；小寫的 m 指示 startPoint 是相對於上一個點的偏移量。

L是繪製一條直線（Line 當前點到指定點的一條直線）

Q / T(平滑)是二次貝塞爾曲線，有兩個點：一個控制點，一個結束點

C / S(平滑)是三次方貝塞爾曲線，有三個點：兩個控制點，一個結束點

H / V 分別是水平直線和垂直直線。

A建立一條橢圓弧線，這個就比較複雜了，Asize（弧線的 x 軸半徑和 y 軸半徑） rotationAngle（橢圓的旋轉度數） isLargeArcFlag（如果弧線的角度應大於或等於 180 度，則設定為 1；否則設定為 0） sweepDirectionFlag（如果弧線按照正角方向繪製，則設定為 1；否則設定為 0） endPoint（結束點）

Z 結束。

其他詳細引數：路徑標記語法

這邊是在倒角處繪製了圓弧，因為用button自帶的倒角屬性CornerRadius會導致顯示不全。

3.最後就是設定陰影

<Setter Property="Effect">
                <Setter.Value>
                    <DropShadowEffect Color="Gray"  Direction="315" ShadowDepth="10" Opacity="10"/>
                </Setter.Value>
            </Setter>

Color是顏色；Direction是陰影的放下，x軸方向為0逆時針增加角度，這邊是右下所以是315；ShadowDepth是偏移的距離；Opacit是透明度