2014-06-27 1 views
2

Je veux styler les BlackoutDates du calendrier WPF. La visualisation par défaut est une croix grise au-dessus du numéro de date. Comment ne les griser que par exemple?Comment styliser les BlackoutDates du calendrier WPF

+0

Vous devez creuser dans le défaut massif [ 'ControlTemplate' pour la classe' Calendar'] (http://msdn.microsoft.com/en-us/library/ff468218 (v = vs.110) .aspx) et modifiez-le selon vos besoins. – Sheridan

+0

@aDoubleSo créer un modèle personnalisé pour 'CalendarDayButton' en changeant' Calendar.CalendarDayButtonStyle' qui gère l'état visuel 'BlackoutDay' comme vous le souhaitez. Notez que vous devrez également gérer d'autres états – dkozl

Répondre

5

Ici, vous allez

<Calendar> 
    <Calendar.CalendarDayButtonStyle> 
     <Style TargetType="CalendarDayButton" BasedOn="{StaticResource {x:Type CalendarDayButton}}"> 
      <Style.Triggers> 
       <Trigger Property="IsBlackedOut" Value="True"> 
        <Setter Property="Background" Value="LightGray"/> 
       </Trigger> 
      </Style.Triggers> 
     </Style> 
    </Calendar.CalendarDayButtonStyle> 
    <Calendar.BlackoutDates> 
     <CalendarDateRange Start="24-June-2014" End="25-June-2014"/> 
    </Calendar.BlackoutDates> 
</Calendar> 

j'avoir spécifié un style personnalisé pour CalendarDayButtonStyle et dans ce style que je défini un déclencheur sur IsBlackedOut et régler le Background-LightGray

résultat

result

vous pouvez choisir de manipuler autre propriété s selon vos besoins

Retirer le black-out existante

pour enlever panne existante, vous avez des options de définition d'un modèle personnalisé pour le bouton jour de calendrier, mais l'inconvénient est que vous aurez à maintenir pour chaque thème par exemple Luna, classique etc

Je vais proposer une solution qui vous aider à utiliser le modèle existant donc pas besoin de se soucier de ces questions

je les propriétés attachées à même

classe CalenderHelper

namespace CSharpWPF 
{ 
    class CalenderHelper : DependencyObject 
    { 
     public static bool GetIsBlackOutDisabled(DependencyObject obj) 
     { 
      return (bool)obj.GetValue(IsBlackOutDisabledProperty); 
     } 

     public static void SetIsBlackOutDisabled(DependencyObject obj, bool value) 
     { 
      obj.SetValue(IsBlackOutDisabledProperty, value); 
     } 

     // Using a DependencyProperty as the backing store for IsBlackOutDisabled. This enables animation, styling, binding, etc... 
     public static readonly DependencyProperty IsBlackOutDisabledProperty = 
      DependencyProperty.RegisterAttached("IsBlackOutDisabled", typeof(bool), typeof(CalenderHelper), new PropertyMetadata(false, OnIsBlackOutDisabledChanged)); 

     private static void OnIsBlackOutDisabledChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) 
     { 
      CalendarDayButton dayButton = d as CalendarDayButton; 
      if (dayButton.IsLoaded) 
      { 
       SetBlackout(dayButton, (bool)e.NewValue); 
      } 
      else 
      { 
       dayButton.Loaded += (s, ee) => 
       { 
        SetBlackout(dayButton, (bool)e.NewValue); 
       }; 
      } 
     } 

     static void SetBlackout(CalendarDayButton dayButton, bool collapsed) 
     { 
      ControlTemplate template = dayButton.Template; 
      Path blackoutPath = template.FindName("Blackout", dayButton) as Path; 
      if (collapsed) 
       blackoutPath.Visibility = System.Windows.Visibility.Collapsed; 
      else 
       blackoutPath.Visibility = System.Windows.Visibility.Visible; 
     } 
    } 
} 

J'ai créé une classe CalenderHelper avec une propriété attachée IsBlackOutDisabled qui cache l'élément d'occultation dans le modèle existant

XAML

<Calendar x:Name="cal" xmlns:l="clr-namespace:CSharpWPF"> 
    <Calendar.CalendarDayButtonStyle> 
     <Style TargetType="CalendarDayButton" BasedOn="{StaticResource {x:Type CalendarDayButton}}"> 
      <Style.Triggers> 
       <Trigger Property="IsBlackedOut" Value="True"> 
        <Setter Property="Background" Value="LightGray"/> 
        <Setter Property="l:CalenderHelper.IsBlackOutDisabled" Value="True"/> 
       </Trigger> 
      </Style.Triggers> 
     </Style> 
    </Calendar.CalendarDayButtonStyle> 
    <Calendar.BlackoutDates> 
     <CalendarDateRange Start="24-June-2014" End="25-June-2014"/> 
    </Calendar.BlackoutDates> 
</Calendar> 

J'ai permis à mon nouveau a créé la propriété l:CalenderHelper.IsBlackOutDisabled dans le déclencheur, qui à son tour masquera le visuel d'occultation par défaut

résultat

result

cette approche rendent souple pour beaucoup faire, vous pouvez coder pour d'autres fonctions de sophisticate qui ne sont pas facilement réalisable via XAML simple,

+0

* La visualisation par défaut est une croix grise au-dessus du numéro de date. Comment ne les griser par exemple? * Je crois que cela signifie, * Comment puis-je griser les dates au lieu de les avoir barrées *? – Sheridan

+0

@Sheridan merci de souligner, laissez-moi apporter cela aussi. – pushpraj

Questions connexes