All geek questions in one place

Silverlight 2.0 DataGrid How to remove mouse effect

I am just starting with SL and WPF. I am using a DataGrid control and I need to remove the mouseover effect (I really need to make more settings than this). How should I do it. I think I need to do this using a management template, but I don’t know how to do it. Now I study and read. Any help would be appreciated.

+3
source share
2 answers

The short answer is to use styles. The long answer is as follows:

There are two style properties in datagrid Silverlight 2.0 that should solve your problem. The first is CellStyle, and the second is RowStyle. The CellStyle property is one that will remove the light blue highlighting around the currently selected cell. The RowStyle property is the one where you can remove the light blue hue denoting the selected row. The CellStyle I used is as follows:

    <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>

If you notice, I commented on the storyboard, which changed the transparency value of the FocusVisual rectangle. This was done so that the FocusVisual rectangle is displayed when a cell is selected. (Note: you cannot remove FocusVisual Element, as CellPresenter expects this element, and not detecting the element will result in an error.)

The RowStyle used by me is as follows:

    <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>

, . MouseOver VisualState, Normal Selected, MouseOver Selected Unfocused Selected.

( : , , .)

: ( XAML, 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

, .

,

+3

, Style ControlTemplate, XAML? Blend - .

ControlTemplate ListBox, , DatGrid. , DataGrid - UIElements, .

MouseOver. VSM, , <vsm:VisualState x:Name="MouseOver">, .

+2

Source: https://habr.com/ru/post/1697759/

More articles:


All Articles