1. 程式人生 > >WPF繪圖的工程應用:為按鈕或自定義按鈕新增向量圖作為背景,該向量圖來自Blend或Design設計的Path資料。

WPF繪圖的工程應用:為按鈕或自定義按鈕新增向量圖作為背景,該向量圖來自Blend或Design設計的Path資料。

例1 :Button+Drawing繫結+GeometryDrawing

功能描述:為Button新增簡單的向量圖作為背景。

<Window x:Class="Drawing.Drawings"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Drawings" Height="300" Width="600"
    >
    <Window.Resources>

        <GeometryDrawing x:Key="Drawing" Brush="Yellow" >
            <GeometryDrawing.Pen>
                <Pen Brush="Blue" Thickness="3"></Pen>
            </GeometryDrawing.Pen>
            <GeometryDrawing.Geometry>
                <PathGeometry>
                    <PathFigure IsClosed="True" StartPoint="10,100">
                        <LineSegment Point="100,100" />
                        <LineSegment Point="100,50" />
                    </PathFigure>
                </PathGeometry>
            </GeometryDrawing.Geometry>
        </GeometryDrawing>

    </Window.Resources>

    <StackPanel Orientation="Horizontal" Margin="5">
        <Button Width="30" Height="30">
            <Image>
                <Image.Source>
                    <DrawingImage Drawing="{StaticResource Drawing}">
                    </DrawingImage>
                </Image.Source>
            </Image>
        </Button>
    </StackPanel>
</Window>

效果圖:

例1 :Button+Content繫結+Canvas+Path資料

功能描述:為Button新增複雜的向量圖作為背景。

<Window x:Class="Drawing.Drawings"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Drawings" Height="300" Width="600"
    >
    <Window.Resources>
        <Canvas x:Shared="False" x:Key="Drawing2" HorizontalAlignment="Center" Height="33.7549" UseLayoutRounding="False" VerticalAlignment="Center" Width="43.5">
            <Path Data="F1M22.75,0L19.15,5.251 0,5.25 0,28.504 0.75,28.504 7.501,10.501 35.255,10.501 35.255,0z" Fill="White" Height="28.504" Canvas.Left="0.75" Canvas.Top="0.75" Width="35.255"/>
            <Path Clip="M0,0L43.505,0 43.505,33.755 0,33.755z" Data="M19.1,5.251C14.544,5.251 5.2,5.239 0.75,5.251 0.485,5.251 0,5.736 0,6.001L0,33.755 36.755,33.755 43.505,11.251 36.755,11.251 36.755,0 24,0C22.204,0,20.895,5.251,19.1,5.251 M24.4,0.751L35.254,0.751C35.519,0.751,36.005,1.235,36.005,1.501L36.005,11.251C36.005,11.251 15.263,11.239 8.251,11.251 7.729,11.252 6.656,12.614 6.356,13.052 3.981,16.521 1.5,29.254 1.5,29.254L0.75,29.254 0.75,6.751C0.75,6.486,1.235,6.001,1.5,6.001L19.8,6.001C21.595,6.001,22.604,0.751,24.4,0.751" Fill="#FFECBF7C" Height="33.755" Canvas.Left="0" Canvas.Top="0" Width="43.5"/>
        </Canvas>
    </Window.Resources>
    
    <StackPanel Orientation="Horizontal" Margin="5">
        <Button Width="122" Height="52" Content="{StaticResource Drawing2}"/>
    </StackPanel>
</Window>

效果圖