自定義控件樣式/觸發器

Question

我試圖讓一個由幾個按鈕和一對夫婦的標籤，自定義控制，但按鍵都應該是不可見的，只顯示在其中的內容。通過將它們設置爲透明，我可以擺脫邊框，背景等。但是，每當我將鼠標懸停在默認窗口懸停效果上時，再次顯示整個按鈕。我已經嘗試過很多關於自定義控件的指南，但最終無法弄清楚如何覆蓋它。基本上我的問題歸結爲，其中有多少可以被放置在generic.xaml文件，什麼組織我有該文件中使用，以及是否有任何其他地方，這些造型應該走呢？我意識到這是一個非常基本的問題，但這只是讓我無法弄清楚具體的答案。謝謝！

電流XAML：

<Style TargetType="{x:Type local:TimePicker}"> 
    <Setter Property="Background" Value="Transparent" /> 
    <Setter Property="BorderBrush" Value="Transparent" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type local:TimePicker}"> 
       <Border Background="{TemplateBinding Background}" 
         BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}" 
         Height="{TemplateBinding Height}" 
         Width="{TemplateBinding Width}"> 
        <StackPanel Orientation="Horizontal"> 
         <StackPanel x:Name="PART_Root" 
            Orientation="Horizontal" 
            HorizontalAlignment="Center"> 
          <ToggleButton x:Name="PART_HourButton" 
              HorizontalAlignment="Center" 
              VerticalAlignment="Center" 
              Margin="0" 
              Background="Transparent" 
              BorderBrush="Transparent" 
              BorderThickness="0" 
              Height="{Binding ElementName=PART_IncDecPanel, Path=ActualHeight}" 
              Width="{Binding ElementName=PART_HourButton, Path=ActualHeight}" 
              Content="{Binding RelativeSource={RelativeSource TemplatedParent},Path=Hour}"> 
                    <ToggleButton.Triggers> 
            <Trigger Property="IsMouseOver" Value="True"> 
             <Setter Property="Background" Value="Transparent" /> 
            </Trigger> 
           </ToggleButton.Triggers> 
          </ToggleButton> 
          <Label x:Name="PART_HourMinSeparator" 
            HorizontalAlignment="Center" 
            VerticalAlignment="Center" 
            Margin="0" 
            Content=":" /> 
          <ToggleButton x:Name="PART_MinButton" 
              HorizontalAlignment="Center" 
              VerticalAlignment="Center" 
              Margin="0" 
              Background="Transparent" 
              BorderBrush="Transparent" 
              BorderThickness="0" 
              Height="{Binding ElementName=PART_HourButton, Path=ActualHeight}" 
              Width="{Binding ElementName=PART_HourButton, Path=ActualWidth}" 
              Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Minute}" /> 
          <StackPanel x:Name="PART_IncDecPanel" HorizontalAlignment="Center" VerticalAlignment="Center"> 
           <Button x:Name="PART_IncreaseTime" 
             Background="Transparent" 
             BorderBrush="Transparent" 
             BorderThickness="0" 
             HorizontalAlignment="Center" 
             HorizontalContentAlignment="Center" 
             VerticalAlignment="Center" 
             VerticalContentAlignment="Center" 
             Margin="0" 
             Padding="0" 
             Width="22" 
             Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IncreaseImage.ActualHeight}"> 
            <Image Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IncreaseImage}" /> 
           </Button> 
           <Button x:Name="PART_DecreaseTime" 
             Background="Transparent" 
             BorderBrush="Transparent" 
             BorderThickness="0" 
             HorizontalContentAlignment="Center" 
             HorizontalAlignment="Center" 
             VerticalAlignment="Center" 
             VerticalContentAlignment="Center" 
             Margin="0" 
             Padding="0" 
             Height="{Binding ElementName=PART_IncreaseTime, Path=ActualHeight}" 
             Width="{Binding ElementName=PART_IncreaseTime, Path=ActualWidth}"> 
            <Image Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=DecreaseImage}" /> 
           </Button> 
          </StackPanel> 
         </StackPanel> 
        </StackPanel> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 1

WPF使用「無外觀的控制，」這基本上意味着你可以改變整個視覺部分（在設計 - 或運行時）的控制，而無需改變其代碼或該代碼的行爲。您已經在使用此概念爲您的TimePicker控件創建默認樣式。如果要從該樣式中刪除ControlTemplate，則在運行時不會看到任何內容，因爲控件本身只是C＃或VB代碼中定義的行爲。

因爲它聽起來就像你要保持你的按鈕的行爲，而是完全改變它的外表，這是重新模板的理想方案。這裏是一個非常簡單的例子，將只顯示內容（在ContentPresenter）：

<Button Content="Hello Template"> 
    <Button.Template> 
     <ControlTemplate TargetType="{x:Type Button}"> 
      <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
           VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
     </ControlTemplate> 
    </Button.Template> 
</Button> 

你可能會想一些更添加到模板，就像一個透明邊框捕捉鼠標輸入，也許一些觸發器。你試圖使用一個觸發切換按鈕在您的示例的方式不正確（FrameworkElement的Triggers集合只適用於EventTriggers），但一個控件模板或樣式裏面，這個模式會奏效。

如果你想在同一樣式應用到您的TimePicker控件模板內的每個按鈕可以添加一個默認的按鈕樣式到您的ControlTemplate資源集合：

<ControlTemplate TargetType="{x:Type MyControl}"> 
    <ControlTemplate.Resources> 
     <Style TargetType="{x:Type Button}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type Button}"> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </ControlTemplate.Resources> 
    ... 
</ControlTemplate>