2008-10-01 10 views
3

Je ne fais que commencer avec SL et WPF. J'utilise le contrôle DataGrid et j'ai besoin de supprimer l'effet mouseover (en fait, je vais devoir faire plus de personnalisations que cela). Comment puis-je faire cela. Je pense que je dois le faire avec un modèle de contrôle, mais je ne sais pas comment. Je fais des recherches et je lis en ce moment. Toute aide serait appréciée.Silverlight 2.0 DataGrid Comment supprimer l'effet mouseover

Répondre

2

Ouais Vous devez changer le Style et ControlTemplate, mais utilisez-vous experssion blend pour éditer XAML? Le mélange est l'outil le plus simple pour cela. Essayez de changer ControlTemplate pour un bouton standard ou ListBox et une fois que vous êtes à l'aise, passez à DatGrid. Pourquoi je suggère que DataGrid est une combinaison complexe de différents UIElements, de sorte que le modèle de contrôle sera difficile à comprendre pour un débutant.

spécifique pour l'élimination mouseOver effet - Il y aura une étiquette VSM dans le modèle de contrôle qui a quelques storyboards, retirer le premier avec <vsm:VisualState x:Name="MouseOver"> et vous êtes bon pour aller.

3

La réponse courte est d'utiliser des styles. La réponse longue est la suivante:

Il existe deux propriétés de style dans la grille de données Silverlight 2.0 qui devraient résoudre votre problème. Le premier est CellStyle et le second est RowStyle. La propriété CellStyle est celle qui supprimera la surbrillance bleue de la cellule actuellement sélectionnée. La propriété RowStyle est celle dans laquelle vous pouvez supprimer la nuance bleu clair indiquant la ligne sélectionnée. Le CellStyle que j'est la suivante:

<Style x:Key="CellStyle" TargetType="local:DataGridCell"> 
     <Setter Property="Background" Value="Transparent" /> 
     <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
     <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
     <Setter Property="Cursor" Value="Arrow" /> 
     <Setter Property="IsTabStop" Value="False" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="local:DataGridCell"> 
        <Grid Name="Root" Background="Transparent"> 
         <vsm:VisualStateManager.VisualStateGroups> 
          <vsm:VisualStateGroup x:Name="CurrentStates" > 
           <vsm:VisualStateGroup.Transitions> 
            <vsm:VisualTransition GeneratedDuration="0" /> 
           </vsm:VisualStateGroup.Transitions> 

           <vsm:VisualState x:Name="Regular" /> 
           <vsm:VisualState x:Name="Current" /> 
            <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="FocusVisual" Storyboard.TargetProperty="Opacity" To="1" Duration="0" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
          </vsm:VisualStateGroup> 
         </vsm:VisualStateManager.VisualStateGroups> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="*" /> 
          <ColumnDefinition Width="Auto" /> 
         </Grid.ColumnDefinitions> 
         <Rectangle Name="FocusVisual" Stroke="#FF6DBDD1" StrokeThickness="1" Fill="#66FFFFFF" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsHitTestVisible="false" Opacity="0" /> 
         <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Cursor="{TemplateBinding Cursor}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" /> 
         <Rectangle Name="RightGridLine" Grid.Column="1" VerticalAlignment="Stretch" Width="1" /> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Si vous remarquerez, je commenté le story-board qui a changé la valeur d'opacité du rectangle FocusVisual. Ce que cela faisait était de définir le rectangle FocusVisual à afficher sur la sélection de cellule. (S'il vous plaît Note: Vous ne pouvez pas supprimer l'élément FocusVisual comme CellPresenter attend cet élément, et ne trouvant pas l'élément provoquera une erreur.)

Le RowStyle I utilisé est le suivant:

<Style TargetType="local:DataGridRow" x:Key="MyCustomRow"> 
     <Setter Property="IsTabStop" Value="False" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="local:DataGridRow"> 
        <localprimitives:DataGridFrozenGrid x:Name="Root"> 
         <localprimitives:DataGridFrozenGrid.Resources> 
          <Storyboard x:Key="DetailsVisibleTransition" > 
           <DoubleAnimation Storyboard.TargetName="DetailsPresenter" Storyboard.TargetProperty="ContentHeight" Duration="00:00:0.1" /> 
          </Storyboard> 
         </localprimitives:DataGridFrozenGrid.Resources> 
         <vsm:VisualStateManager.VisualStateGroups> 
          <vsm:VisualStateGroup x:Name="CommonStates" > 
           <vsm:VisualState x:Name="Normal" /> 
           <vsm:VisualState x:Name="Normal AlternatingRow"> 
            <Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="0" /> 
            </Storyboard> 
           </vsm:VisualState> 
           <vsm:VisualState x:Name="MouseOver" /> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To=".5" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
           <vsm:VisualState x:Name="Normal Selected"/> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
           <vsm:VisualState x:Name="MouseOver Selected"/> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
           <vsm:VisualState x:Name="Unfocused Selected"/> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
             <ColorAnimationUsingKeyFrames BeginTime="0" Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"> 
              <SplineColorKeyFrame KeyTime="0" Value="#FFE1E7EC" /> 
             </ColorAnimationUsingKeyFrames> 
            </Storyboard> 
           </vsm:VisualState>--> 
          </vsm:VisualStateGroup> 
         </vsm:VisualStateManager.VisualStateGroups> 
         <localprimitives:DataGridFrozenGrid.RowDefinitions> 
          <RowDefinition Height="*" /> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="Auto" /> 
         </localprimitives:DataGridFrozenGrid.RowDefinitions> 
         <localprimitives:DataGridFrozenGrid.ColumnDefinitions> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="*" /> 
         </localprimitives:DataGridFrozenGrid.ColumnDefinitions> 
         <Rectangle x:Name="BackgroundRectangle" Grid.RowSpan="2" Grid.ColumnSpan="2" Opacity="0" Fill="#FFBADDE9" /> 
         <localprimitives:DataGridRowHeader Grid.RowSpan="3" x:Name="RowHeader" localprimitives:DataGridFrozenGrid.IsFrozen="True" /> 

         <localprimitives:DataGridCellsPresenter x:Name="CellsPresenter" localprimitives:DataGridFrozenGrid.IsFrozen="True"/> 

         <localprimitives:DataGridDetailsPresenter Grid.Row="1" Grid.Column="1" x:Name="DetailsPresenter" /> 
         <Rectangle Grid.Row="2" Grid.Column="1" x:Name="BottomGridLine" HorizontalAlignment="Stretch" Height="1" /> 
        </localprimitives:DataGridFrozenGrid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Comme vous peut voir, j'ai commenté quelques états visuels plus. Vous souhaiterez commenter le story-board de MouseOver VisualState, le storyboard sélectionné Normal, le storyboard de MouseOver Selected et le story-board Selected Unfocused.

(S'il vous plaît Note: Je ne l'ai pas supprimer ces états visuels, je ne commente ce qu'ils faisaient.)

Ceci est mon code dans son intégralité pour référence: (XAML, puis VB)

XAML:

<UserControl x:Class="DataGrid_Mouseover.Page" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" 
    xmlns:local="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" 
    xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" 
    xmlns:primitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows" 
    xmlns:localprimitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows.Controls.Data" 
    xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"> 
<UserControl.Resources> 

    <Style x:Key="CellStyle" TargetType="local:DataGridCell"> 

     <!-- TODO: Remove this workaround to force MouseLeftButtonDown event to be raised when root element is clicked. --> 
     <Setter Property="Background" Value="Transparent" /> 
     <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
     <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
     <Setter Property="Cursor" Value="Arrow" /> 
     <Setter Property="IsTabStop" Value="False" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="local:DataGridCell"> 
        <Grid Name="Root" Background="Transparent"> 
         <vsm:VisualStateManager.VisualStateGroups> 
          <vsm:VisualStateGroup x:Name="CurrentStates" > 
           <vsm:VisualStateGroup.Transitions> 
            <vsm:VisualTransition GeneratedDuration="0" /> 
           </vsm:VisualStateGroup.Transitions> 

           <vsm:VisualState x:Name="Regular" /> 
           <vsm:VisualState x:Name="Current" /> 
            <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="FocusVisual" Storyboard.TargetProperty="Opacity" To="1" Duration="0" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
          </vsm:VisualStateGroup> 
         </vsm:VisualStateManager.VisualStateGroups> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="*" /> 
          <ColumnDefinition Width="Auto" /> 
         </Grid.ColumnDefinitions> 
         <!-- TODO Refactor this if SL ever gets a FocusVisualStyle on FrameworkElement --> 
         <Rectangle Name="FocusVisual" Stroke="#FF6DBDD1" StrokeThickness="1" Fill="#66FFFFFF" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsHitTestVisible="false" Opacity="0" /> 
         <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Cursor="{TemplateBinding Cursor}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" /> 
         <Rectangle Name="RightGridLine" Grid.Column="1" VerticalAlignment="Stretch" Width="1" /> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

    <Style TargetType="local:DataGridRow" x:Key="MyCustomRow"> 
     <Setter Property="IsTabStop" Value="False" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="local:DataGridRow"> 
        <localprimitives:DataGridFrozenGrid x:Name="Root"> 
         <localprimitives:DataGridFrozenGrid.Resources> 
          <Storyboard x:Key="DetailsVisibleTransition" > 
           <DoubleAnimation Storyboard.TargetName="DetailsPresenter" Storyboard.TargetProperty="ContentHeight" Duration="00:00:0.1" /> 
          </Storyboard> 
         </localprimitives:DataGridFrozenGrid.Resources> 
         <vsm:VisualStateManager.VisualStateGroups> 
          <vsm:VisualStateGroup x:Name="CommonStates" > 
           <vsm:VisualState x:Name="Normal" /> 
           <vsm:VisualState x:Name="Normal AlternatingRow"> 
            <Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="0" /> 
            </Storyboard> 
           </vsm:VisualState> 
           <vsm:VisualState x:Name="MouseOver" /> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To=".5" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
           <vsm:VisualState x:Name="Normal Selected"/> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
           <vsm:VisualState x:Name="MouseOver Selected"/> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
            </Storyboard> 
           </vsm:VisualState>--> 
           <vsm:VisualState x:Name="Unfocused Selected"/> 
           <!--<Storyboard> 
             <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1" /> 
             <ColorAnimationUsingKeyFrames BeginTime="0" Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"> 
              <SplineColorKeyFrame KeyTime="0" Value="#FFE1E7EC" /> 
             </ColorAnimationUsingKeyFrames> 
            </Storyboard> 
           </vsm:VisualState>--> 
          </vsm:VisualStateGroup> 
         </vsm:VisualStateManager.VisualStateGroups> 
         <localprimitives:DataGridFrozenGrid.RowDefinitions> 
          <RowDefinition Height="*" /> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="Auto" /> 
         </localprimitives:DataGridFrozenGrid.RowDefinitions> 
         <localprimitives:DataGridFrozenGrid.ColumnDefinitions> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="*" /> 
         </localprimitives:DataGridFrozenGrid.ColumnDefinitions> 
         <Rectangle x:Name="BackgroundRectangle" Grid.RowSpan="2" Grid.ColumnSpan="2" Opacity="0" Fill="#FFBADDE9" /> 
         <localprimitives:DataGridRowHeader Grid.RowSpan="3" x:Name="RowHeader" localprimitives:DataGridFrozenGrid.IsFrozen="True" /> 

         <localprimitives:DataGridCellsPresenter x:Name="CellsPresenter" localprimitives:DataGridFrozenGrid.IsFrozen="True"/> 

         <localprimitives:DataGridDetailsPresenter Grid.Row="1" Grid.Column="1" x:Name="DetailsPresenter" /> 
         <Rectangle Grid.Row="2" Grid.Column="1" x:Name="BottomGridLine" HorizontalAlignment="Stretch" Height="1" /> 
        </localprimitives:DataGridFrozenGrid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</UserControl.Resources> 

<Grid x:Name="LayoutRoot" Background="White"> 
    <local:DataGrid x:Name="TestGrid" 
      HorizontalAlignment="Left" 
      VerticalAlignment="Bottom" 
      AutoGenerateColumns="False" 
      HeadersVisibility="None" 
      RowHeight="55" 
      Background="Transparent" 
      AlternatingRowBackground="Transparent" 
      RowBackground="Transparent" 
      BorderBrush="Transparent" 
      Foreground="Transparent" 
      GridLinesVisibility="None" 
      SelectionMode="Single" 
      CellStyle="{StaticResource CellStyle}" 
      RowStyle="{StaticResource MyCustomRow}"> 

     <local:DataGrid.Columns> 
      <local:DataGridTemplateColumn Header="Clinic"> 
       <local:DataGridTemplateColumn.CellTemplate> 
        <DataTemplate> 
         <Button x:Name="btnClinic" 
         Height="46" 
         Width="580" 
         Content="{Binding Path=Description}" 
         Click="btnClinic_Click" 
         FontSize="24" 
         FontFamily="Tahoma" 
         FontWeight="Bold"> 
          <Button.Background> 
           <LinearGradientBrush EndPoint="0.528,1.144" StartPoint="1.066,1.221"> 
            <GradientStop Color="#FF000000"/> 
            <GradientStop Color="#FFEDC88F" Offset="1"/> 
           </LinearGradientBrush> 
          </Button.Background> 
         </Button> 
        </DataTemplate> 
       </local:DataGridTemplateColumn.CellTemplate> 
      </local:DataGridTemplateColumn> 
     </local:DataGrid.Columns> 
    </local:DataGrid> 
</Grid> 
</UserControl> 

VB:

Partial Public Class Page 
Inherits UserControl 

Public Sub New() 
    InitializeComponent() 
    Dim test As IList(Of String) = New List(Of String) 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 
    test.Add("test1") 

    TestGrid.ItemsSource = test 

End Sub 

Private Sub btnClinic_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) 

End Sub 
End Class 

Hope this helps.

Merci, Scott

Questions connexes