2013-07-26 160 views
1

我想創建一個WPF用戶控件使用XAML它是一箇舊的時尚複選框控件和下面的代碼在屏幕上看起來ok,但爲了讓控件改變狀態,你必須單擊路徑沒有在盒子裏的任何地方我做錯了什麼?XAML WPF用戶控件更改狀態

正如你可以正確看到我有點nooob當涉及到WPF所以如果有什麼事情我真的很糟糕請評論。

<UserControl 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" 
x:Class="BFCheckBoxTest.BFCheckBox" 
x:Name="UserControl" 
d:DesignWidth="55" d:DesignHeight="55"> 
<UserControl.Resources> 
    <SolidColorBrush x:Key="CheckBoxFillNormal" Color="#F4F4F4"/> 
    <SolidColorBrush x:Key="CheckBoxStroke" Color="#8E8F8F"/> 
    <Style x:Key="EmptyCheckBoxFocusVisual"> 
     <Setter Property="Control.Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Rectangle Margin="1" SnapsToDevicePixels="true" Stroke="Black" StrokeThickness="1" StrokeDashArray="1 2"/> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
    <Style x:Key="BFCheckBoxStyle" TargetType="{x:Type CheckBox}"> 
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="Background" Value="{StaticResource CheckBoxFillNormal}"/> 
     <Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="FocusVisualStyle" Value="{StaticResource EmptyCheckBoxFocusVisual}"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type CheckBox}"> 
        <Grid x:Name="Controlgrid" Height="{TemplateBinding ActualHeight}" Width="{TemplateBinding ActualWidth}"> 
         <Border x:Name="border" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" Height="{Binding ActualHeight, ElementName=Controlgrid}" VerticalAlignment="Bottom" Width="{Binding ActualWidth, ElementName=Controlgrid}" Grid.ColumnSpan="1" RenderTransformOrigin="0.518,0.127" d:IsLocked="True"/> 
         <Viewbox x:Name="CrossViewbox" HorizontalAlignment="Left" Height="Auto" VerticalAlignment="Top" Width="Auto" Margin="4" Visibility="Hidden"> 
          <Path x:Name="Cross" Data="M0,55 L55,0 M0,0 L55,55" HorizontalAlignment="Left" Height="{Binding ActualHeight, ElementName=border}" Margin="0" Stretch="Fill" Stroke="Red" StrokeThickness="2" VerticalAlignment="Bottom" Width="{Binding ActualWidth, ElementName=border}" Grid.ColumnSpan="1" Focusable="False"/> 
         </Viewbox> 
         <Viewbox x:Name="TickViewBox" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="4" RenderTransformOrigin="0.373,0.225" Visibility="Visible"> 
          <Path x:Name="Tick" Data="M0,35 L20,55 L55,0" HorizontalAlignment="Left" Height="{Binding ActualHeight, ElementName=border}" Margin="0" Stretch="Fill" Stroke="Green" StrokeThickness="2" VerticalAlignment="Bottom" Width="{Binding ActualWidth, ElementName=border}" Grid.ColumnSpan="1" Focusable="False"/> 
         </Viewbox> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <EventTrigger RoutedEvent="ButtonBase.Click"/> 
         <Trigger Property="IsChecked" Value="true"> 
          <Setter Property="Visibility" TargetName="TickViewBox" Value="Visible" /> 
          <Setter Property="Visibility" TargetName="CrossViewbox" Value="Hidden" /> 
         </Trigger> 
         <Trigger Property="IsChecked" Value="false"> 
          <Setter Property="Visibility" TargetName="TickViewBox" Value="Hidden" /> 
          <Setter Property="Visibility" TargetName="CrossViewbox" Value="Visible" /> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</UserControl.Resources> 

<CheckBox Content="CheckBox" HorizontalAlignment="Left" VerticalAlignment="Top" Style="{DynamicResource BFCheckBoxStyle}" Height="{Binding ActualHeight, ElementName=UserControl}" Width="{Binding ActualWidth, ElementName=UserControl}"/> 

我其實是在移植一個iPad應用到WPF,並在iPad上我用了一個animationlayer動畫路徑的過程,就好像它是由手工繪製的是你只是提供了非常簡單它有一個路徑和持續時間和IOS的照顧剩下的是有一些類似的WPF中的事情,或者你會如何在WPF中實現它?

問候基督教ArildStœr安徒生

回答

1

的原因是因爲你沒有在你的控件模板背景畫筆綁定。 因此使這一變化在您的XAML控件模板

<Grid x:Name="Controlgrid" Background="{TemplateBinding Background}"> 

以外,你不需要爲布爾屬性兩個觸發通話所以只是一個觸發將做的工作適合你。

<Trigger Property="IsChecked" Value="true"> 
    <Setter Property="Visibility" TargetName="TickViewBox" Value="Visible" /> 
    <Setter Property="Visibility" TargetName="CrossViewbox" Value="Hidden" /> 
</Trigger> 
+0

太棒了!我最近開始注意到WPF中的這種行爲。即使是一個背景=「透明」也足以使整個控制符合點擊測試 – Vanlalhriata

+0

是的。它將感應鼠標事件,因爲Transparent在那裏被用作Brush。 – Nitesh

+0

可能值得一提的是,每個使用此模板的「CheckBox」都必須設置「Background」屬性。否則,空白區仍然會失敗hit-tests – Vanlalhriata