1. 程式人生 > >WPF學習(17)-控制元件模板

WPF學習(17)-控制元件模板

        在我們構建程式外觀的時候,總會出於美觀或者業務邏輯的需求,需要定製更加酷炫或者複雜的控制元件,樣式,已經允許我們更改控制元件或者元素的外觀了,但是有一個問題,如果我們需要更大範圍的更改,比如一個按鈕,可以通過樣式修改背景,前景,圓角,甚至特殊幾何形狀,字型等屬性,但是如果我們需求是隻要保留按鈕的使用邏輯,就是點選處理某些事情,但是需要內部更加複雜,裡面擁有列表等,這個時候模板就應運而生了。

       控制元件模板:每個控制元件都有一個內建的方法,用於確定如何渲染控制元件(作為一組更基礎的元素)。該方法稱為控制元件模板(control template),是用xaml標記塊定義的。

        下面這個例子,自己做了一個針對button的模板,簡單的改了下外觀

<Window x:Class="WpfApplication10.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <ControlTemplate x:Key="mybutton" TargetType="Button">
            <Border BorderBrush="Pink" BorderThickness="3" CornerRadius="3" Background="AliceBlue" TextBlock.Foreground="Red" TextBlock.TextAlignment="Center" >
                <ContentPresenter RecognizesAccessKey="True" Margin="{TemplateBinding Padding}">
                </ContentPresenter>
            </Border>
        </ControlTemplate>
    </Window.Resources>
    <Grid>
        <StackPanel>
            <Button Margin="5" Template="{StaticResource mybutton}">我是一個按鈕</Button>   
        </StackPanel>
    </Grid>
</Window>

     當然,我們也可以對模板使用觸發器,比如下面這個例子,我們就實現了獲得焦點,顯示紅色的框,失去焦點,紅色框消失。

<Window x:Class="WpfApplication10.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <ControlTemplate x:Key="mybutton" TargetType="Button">
            <Border >
                <Grid>
                    <Rectangle Name="rect" Visibility="Hidden" Stroke="Red" StrokeThickness="3"></Rectangle>
                    <ContentPresenter RecognizesAccessKey="True" Margin="{TemplateBinding Padding}">
                    </ContentPresenter>
                </Grid>
                
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsKeyboardFocused" Value="true">
                    <Setter TargetName="rect" Property="Visibility" Value="Visible"></Setter>  
                </Trigger>
                <Trigger Property="IsKeyboardFocused" Value="false">
                    <Setter TargetName="rect" Property="Visibility" Value="Hidden"></Setter>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Window.Resources>
    <Grid>
        <StackPanel>
            <Button  Margin="5" Template="{StaticResource mybutton}">我是一個按鈕</Button>
            <Button Content="Button"/>
        </StackPanel>
    </Grid>
</Window>

    既然可以放觸發器,那麼當然可以放事件觸發器了,既然可以放事件觸發器,就可以通過事件觸發動畫了,既然可以搞事件觸發器,當然可以搞樣式觸發啦,反正是隻要是xaml中有的東西,都可以放到模板中,因為模板本來就是xaml構建的。