2012-03-12 4 views
1

Это последующая деятельность до Overriding button background in WPF on Aero и до некоторой степени Custom Control Styling/Triggers.Элемент управления/триггеры для индивидуального управления Часть II - Переопределение Aero

При попытке сохранить функциональность ToggleButton, но избавиться от стиля кнопки, я следил за процессом первой ссылки выше. Она в основном работает, хотя и с незначительной модификацией изменения RenderMouseOver и RenderPressed к false (В противном случае он почуяв мышь находиться над любой точке окна, а не только тогда, когда над ToggleButton.

Так что теперь моя проблема, с разметка ниже, триггер IsMouseOver не меняет фон на всех. Есть идеи, глядя на XAML?

на стороне записки, я пытался использовать BitmapEffect, чтобы буквы светятся при переключении, но независимо от того, какие настройки я использую, похоже, не имеет никакого эффекта. Кто-нибудь знает руководство, которое конкретно касается этого?

<Style TargetType="{x:Type local:TimePicker}"> 
    <Setter Property="Height" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Height}" /> 
    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Width}" /> 
    <Setter Property="HorizontalAlignment" Value="Center" /> 
    <Setter Property="VerticalAlignment" Value="Center" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate> 
       <Border Background="{TemplateBinding Background}" 
         BorderBrush="Black" 
         BorderThickness="1"> 
        <StackPanel Orientation="Horizontal" 
           HorizontalAlignment="Center" 
           VerticalAlignment="{TemplateBinding VerticalAlignment}"> 
         <ToggleButton VerticalAlignment="{TemplateBinding VerticalAlignment}" 
             Margin="0" 
             Background="{TemplateBinding Background}" 
             BorderBrush="Transparent" 
             Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Hour}"> 
          <ToggleButton.Template> 
           <ControlTemplate TargetType="{x:Type ToggleButton}"> 
            <Aero:ButtonChrome SnapsToDevicePixels="True" 
                 Background="{TemplateBinding Background}" 
                 BorderBrush="{TemplateBinding BorderBrush}" 
                 RenderMouseOver="False" 
                 RenderPressed="False"> 
             <ContentPresenter VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                  SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
                  /> 
            </Aero:ButtonChrome> 
           </ControlTemplate> 
          </ToggleButton.Template> 
          <ToggleButton.Style> 
           <Style TargetType="ToggleButton"> 
            <Style.Triggers> 
             <Trigger Property="IsMouseOver" Value="True"> 
              <Setter Property="OverridesDefaultStyle" Value="True" /> 
              <Setter Property="Background" Value="LightGray" /> 
             </Trigger> 
             <Trigger Property="IsChecked" Value="True"> 
              <Setter Property="Foreground" Value="Red" /> 
              <Setter Property="FontWeight" Value="Bold" />             
              <Setter Property="BitmapEffect"> 
               <Setter.Value> 
                <OuterGlowBitmapEffect GlowColor="Red" GlowSize="30" /> 
               </Setter.Value> 
              </Setter> 
             </Trigger> 
            </Style.Triggers> 
           </Style> 
          </ToggleButton.Style> 
         </ToggleButton> 
         <Label HorizontalContentAlignment="{TemplateBinding HorizontalAlignment}" 
           VerticalContentAlignment="{TemplateBinding VerticalAlignment}" 
           Content=":"/> 
         <ToggleButton VerticalAlignment="{TemplateBinding VerticalAlignment}" 
             Margin="0" 
             Background="{TemplateBinding Background}" 
             BorderBrush="Transparent" 
             Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Minute}" /> 

        </StackPanel> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

ответ

1

Может быть, что фон вашего контроля установлен в {x:Null} по умолчанию, попробуйте установить <Setter Property="Background" Value="Transparent"/> {х: Null не обнаружит мышь, Transparent волю.

Edit (дополнение):

OverridesDefaultStyle = True должен быть в style.setters не в триггере.

Пример:

<ToggleButton Content="ToggleButton" Height="30" Width="110" > 
    <ToggleButton.Style> 
    <Style TargetType="ToggleButton"> 
     <Setter Property="SnapsToDevicePixels" Value="True"/> 
     <Setter Property="UseLayoutRounding" Value="True"/> 
     <Setter Property="OverridesDefaultStyle" Value="True"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="Background"> 
     <Setter.Value> 
      <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> 
      <GradientStop Offset="0" Color="#FFFFFF"/> 
      <GradientStop Offset="0.48" Color="#DDDDDD"/> 
      <GradientStop Offset="0.5" Color="#CCCCCC"/> 
      <GradientStop Offset="0.52" Color="#BBBBBB"/> 
      <GradientStop Offset="1" Color="#CCCCCC"/> 
      </LinearGradientBrush> 
     </Setter.Value> 
     </Setter> 
     <Setter Property="BorderBrush"> 
     <Setter.Value> 
      <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> 
      <GradientStop Offset="0" Color="#DDDDDD"/> 
      <GradientStop Offset="0.48" Color="#BBBBBB"/> 
      <GradientStop Offset="0.5" Color="#AAAAAA"/> 
      <GradientStop Offset="0.52" Color="#999999"/> 
      <GradientStop Offset="1" Color="#AAAAAA"/> 
      </LinearGradientBrush> 
     </Setter.Value> 
     </Setter> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="ToggleButton"> 
      <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" 
        CornerRadius="2" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" UseLayoutRounding="{TemplateBinding UseLayoutRounding}"> 
       <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
      </Border> 
      <ControlTemplate.Triggers> 
       <MultiTrigger> 
       <MultiTrigger.Conditions> 
        <Condition Property="IsMouseOver" Value="True"/> 
        <Condition Property="IsChecked" Value="False"/> 
       </MultiTrigger.Conditions> 
       <Setter Property="Background"> 
        <Setter.Value> 
        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> 
         <GradientStop Offset="0" Color="#FFFFFF"/> 
         <GradientStop Offset="0.48" Color="#EEEEEE"/> 
         <GradientStop Offset="0.5" Color="#DDDDDD"/> 
         <GradientStop Offset="0.52" Color="#CCCCCC"/> 
         <GradientStop Offset="1" Color="#DDDDDD"/> 
        </LinearGradientBrush> 
        </Setter.Value> 
       </Setter> 
       </MultiTrigger> 
       <MultiTrigger> 
       <MultiTrigger.Conditions> 
        <Condition Property="IsMouseOver" Value="True"/> 
        <Condition Property="IsChecked" Value="True"/> 
       </MultiTrigger.Conditions> 
       <Setter Property="BorderBrush" Value="#666666"/> 
       <Setter Property="BorderThickness" Value="2,2,1,1"/> 
       <Setter Property="Background"> 
        <Setter.Value> 
        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> 
         <GradientStop Offset="0" Color="#AAAAAA"/> 
         <GradientStop Offset="0.48" Color="#999999"/> 
         <GradientStop Offset="0.5" Color="#AAAAAA"/> 
         <GradientStop Offset="0.52" Color="#BBBBBB"/> 
         <GradientStop Offset="1" Color="#DDDDDD"/> 
        </LinearGradientBrush> 
        </Setter.Value> 
       </Setter> 
       </MultiTrigger> 
       <MultiTrigger> 
       <MultiTrigger.Conditions> 
        <Condition Property="IsChecked" Value="True"/> 
        <Condition Property="IsMouseOver" Value="False"/> 
       </MultiTrigger.Conditions> 
       <Setter Property="BorderBrush" Value="#333333"/> 
       <Setter Property="BorderThickness" Value="2,2,1,1"/> 
       <Setter Property="Background"> 
        <Setter.Value> 
        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> 
         <GradientStop Offset="0" Color="#999999"/> 
         <GradientStop Offset="0.48" Color="#888888"/> 
         <GradientStop Offset="0.5" Color="#999999"/> 
         <GradientStop Offset="0.52" Color="#AAAAAA"/> 
         <GradientStop Offset="1" Color="#CCCCCC"/> 
        </LinearGradientBrush> 
        </Setter.Value> 
       </Setter> 
       </MultiTrigger> 
      </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
     </Setter> 
    </Style> 
    </ToggleButton.Style> 
</ToggleButton> 

Что касается свечения:

Замените ContentPresenter полностью с этим:

  <Grid> 
      <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
      <ContentPresenter x:Name="ContentPart" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
           TextBlock.Foreground="#5588FF" Visibility="Collapsed"> 
       <ContentPresenter.Effect> 
       <BlurEffect /> 
       </ContentPresenter.Effect> 
      </ContentPresenter> 
      </Grid> 

и добавить этот простой триггер:

<Trigger Property="IsChecked" Value="True"> 
        <Setter TargetName="ContentPart" Property="Visibility" Value="Visible"/> 
        </Trigger> 
+0

Только что попробовал: не работал. Я пробовал это на каждом фоне заявления там и ничего. :) –

+1

Если вы действительно заинтересованы в создании стилей и контрольных шаблонов, то проверьте этот сайт, полный примеров: http://msdn.microsoft.com/en-us/library/ms752043.aspx Я всегда избегал использования тем при условии, что Areo и другие 5 или 6, потому что они вас не учат :) – Silvermind

+0

У меня возникло 2 проблемы с этим. Во-первых, функция OverridesDefaultStyle не устраняет проблему фонового наведения. Во-вторых, что касается эффекта размытия, VS не позволит мне установить TargetName в настройке стиля. Я не знаю, имеет ли это значение, но это внутри файла generic.xaml для настраиваемого элемента управления. О, и я действительно очень ценю помощь. –

1

Просто изнуренный чтобы опубликовать окончательную разметку для этого, в случае, если кто-либо когда-либо ищет то же самое.

<Style TargetType="{x:Type local:TimePicker}"> 
    <Setter Property="Height" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Height}" /> 
    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Width}" /> 
    <Setter Property="HorizontalAlignment" Value="Center" /> 
    <Setter Property="VerticalAlignment" Value="Center" /> 
    <Setter Property="FontSize" Value="14" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate> 
       <Border Background="{TemplateBinding Background}" 
         BorderBrush="Transparent" 
         BorderThickness="1"> 
        <StackPanel Orientation="Horizontal" 
           HorizontalAlignment="Center" 
           VerticalAlignment="{TemplateBinding VerticalAlignment}"> 
         <ToggleButton VerticalAlignment="{TemplateBinding VerticalAlignment}" 
             Margin="0"           
             BorderBrush="Transparent" 
             BorderThickness="0" 
             Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Hour}"> 
          <ToggleButton.Template> 
           <ControlTemplate TargetType="{x:Type ToggleButton}"> 
            <Aero:ButtonChrome SnapsToDevicePixels="True"               
                 Background="{TemplateBinding Background}" 
                 BorderBrush="{TemplateBinding BorderBrush}"               
                 RenderDefaulted="False"> 
             <Grid> 
              <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                   VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
              <ContentPresenter x:Name="ContentPart" 
                   HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                   VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                   TextBlock.Foreground="#FF605c" Visibility="Collapsed"> 
               <ContentPresenter.Effect> 
                <BlurEffect /> 
               </ContentPresenter.Effect> 
              </ContentPresenter> 
             </Grid> 
            </Aero:ButtonChrome> 
            <ControlTemplate.Triggers> 
             <Trigger Property="IsMouseOver" Value="True"> 
              <Setter TargetName="ContentPart" Property="Visibility" Value="Visible" /> 
             </Trigger> 
             <Trigger Property="IsChecked" Value="True"> 
              <Setter Property="FontWeight" Value="Bold" /> 
              <Setter TargetName="ContentPart" Property="Visibility" Value="Visible" />             
             </Trigger> 
            </ControlTemplate.Triggers> 
           </ControlTemplate> 
          </ToggleButton.Template> 
          <ToggleButton.Style> 
           <Style TargetType="{x:Type ToggleButton}"> 
            <Setter Property="Background" Value="Transparent" /> 
           </Style> 
          </ToggleButton.Style> 
         </ToggleButton> 
         <Label HorizontalContentAlignment="{TemplateBinding HorizontalAlignment}" 
           VerticalContentAlignment="{TemplateBinding VerticalAlignment}" 
           Content=":"/> 
         <ToggleButton VerticalAlignment="{TemplateBinding VerticalAlignment}" 
             Margin="0" 
             Background="{TemplateBinding Background}" 
             BorderBrush="Transparent" 
             Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Minute}" /> 

        </StackPanel> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
+0

Просто обнаружил еще одну вещь: Если вы удалите разделы '

Смежные вопросы