DataGrid实现鼠标放到某行改变背景色

最新推荐文章于 2020-12-06 04:14:11 发布
原创 最新推荐文章于 2020-12-06 04:14:11 发布 · 920 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#datagrid #object

本文介绍如何使用ASP.NET中的DataGrid控件实现当鼠标悬停在表格项上时背景颜色发生变化的效果，并对每一个单元格设置相似的鼠标悬停样式。
private void DataGrid_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
        {
            if(e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
            {
                e.Item.Attributes.Add("onmouseover","this.oldcolor=this.style.backgroundColor;this.style.backgroundColor='Gainsboro'");
                e.Item.Attributes.Add("onmouseout", "this.style.backgroundColor=this.oldcolor");
                for (int i=0;i<GridAdSite.Columns.Count;i++)
                {
                    e.Item.Cells[i].Attributes.Add("onmouseover","this.oldcolor=this.style.backgroundColor;this.style.backgroundColor='OldLace'");
                    e.Item.Cells[i].Attributes.Add("onmouseout", "this.style.backgroundColor=this.oldcolor");
                }

            }

        }
 
C#实现DataGridView选中单元格时整个行背景变色（附完整源码）
希望我的博客，能帮上你解决学习中工作中所遇到的问题
06-26 874
C#实现DataGridView选中单元格时整个行背景变色（附完整源码）
实现DataGrid的某一行随着鼠标的移入移出而改变颜色
李豹
08-24 1113
private void DataGrid1_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e){   if(e.Item.ItemIndex!=-1)  //鼠标在DataGrid中移动时，选中的那一行显示颜色   {e.Item.Attributes.Add("onmouseover","t
在Web DataGrid中当鼠标移到某行与离开时行的颜色发生改变(结合javascript)
嗨！您好！Welcome my blog
10-11 705
在head中添加javascript 代码如下: function sel(i) // 鼠标移上去后执行 {  eval(i+".style.background=#CCCC66"); // 更改行的颜色  eval(i+".style.cursor=hand"); // 鼠标移上去后变为手形 } function unsel(i) // 鼠标离开后执行 {  eval(i+".style
DataGrid 技巧：更改某一行的背景色
剪裁人生 的专栏
04-30 801
DataGrid 技巧：更改某一行的背景色10月 11th, 2006 — Dreamer 在Peter Ent那里看到一个关于DataGrid的技巧，很有用。文章比较短，直接翻译在这里好了。原文地址：http://weblogs.macromedia.com/pent/archives/2006/10/datagrid_tip_ro.cfmDataGrid 技巧：行的背景色
DataGrid中鼠标点击、移动后行颜色改变效果
思索的蜗牛的专栏
04-16 2463
 效果一：鼠标点击DataGrid一行，就让该行换个颜色，跟鼠标移动效果的区别是，这种点击后即使鼠标移走了，被点击那行照样保持改变后的颜色，这样用户编辑的时候，这一行就和其他各行区别开了。效果二：鼠标移动到DataGrid某行，就让该行换个颜色。但是这种效果是，随着鼠标移动而改变行颜色。效果图如下： 第一种鼠标点击行颜色改变效果前台代码是：只要为DataGrid添加一个属性
winform datagridview 鼠标hover行背景_常用数据行变色操作方法
weixin_39673037的博客
12-06 859
概述如上格式的报表，当数据行数多了，在核对数据的时候，能够看不错行还是挺有难度的眼力活儿。 所以，为了避免这种考眼力的情况发生，还是要给报表加点小技巧的。常见的方式是增加隔行异色的功能，这部分不论是哪个报表工具，基本都有介绍，比如润乾报表： 报表设计技巧之隔行异色 ](http://c.raqsoft.com.cn/article/1533022149478?r=bubblegum) 。这种方式虽...
WPF 设置DataGrid 鼠标移动改变行颜色样式
mukunping的专栏
07-21 6282
//设置每行的颜色为蓝色 //设置鼠标移至行上方 //设置行背景颜色会变为灰色
【easyui】 datagrid动态改变某一行的颜色
柠檬加冰
11-15 1万+
直接上代码：$(function () { dataGridAccept = $('#dataGridAccept').datagrid({ fit: true, fitColumns: false, border: false, paginatio
System.UnauthorizedAccessException: 对路径“**”的访问被拒绝。
热门推荐
也许有错 专栏
08-08 2万+
根据异常详细信息: ASP.NET 未被授权访问所请求的资源。请考虑授予 ASP.NET 请求标识访问此资源的权限。ASP.NET 有一个在应用程序没有模拟时使用的基进程标识(通常，在 IIS 5 上为 {MACHINE}/ASPNET，在 IIS 6 上为网络服务)。如果应用程序正在通过 模拟，则标识将为匿名用户(通常为 IUSR_MACHINENAME)或经过身份验证的请求用户。 要将
Sys.WebForms.PageRequestManagerServerErrorException: An unknown error occurred while processing the request on the server. The s
也许有错 专栏
06-03 8348
最近做一个页面部份数据定时自动刷新功能，并且不出现刷屏效果时，用到 Ajax 控件时出现了Sys.WebForms.PageRequestManagerServerErrorException: An unknown error occurred while processing the request on the server. The status code returned from th
后台管理导航菜单及模板
也许有错 专栏
03-18 3879
最近帮一些学校做了几个网站，整理出易想商城后台管理系统的导航模板，只需要修改下文字及连接便可以使用，其中有母版页可由子页引用以便统一风格。需要的朋友可以去下载。  下载地址：http://download.youkuaiyun.com/source/1121016
操作文件访问被拒绝的解决办法
也许有错 专栏
12-13 3807
 对硬盘是用NTFS格式化的，操作文件时会被拒绝访问，可以用下面方法解决(如果用 FAT32 一般不会出现这种情况)选择站点文件夹在安全选项卡添加 Authenticated Users 用户，并且设置允许 修改和写入这样问题就可以解决了 
Ajax无刷新实现定时更新数据
也许有错 专栏
06-05 2358
1、引用 ajax.dll 实现走动时间显示来查看效果前台代码          //定时更新时间          function refresh()          {               var div = document.all("divTime");                              var strTime = Default1.GetAllOn
DataGrid 实现批量删除
也许有错 专栏
04-23 2090
今天做了一个批量删除的功能,有很多东西都还是不明确的呀.原理是清楚的,但实现起来有点问题呀.在朋友的帮助处终于实现了。可以多选，并取消多选。希望在这里和大家分享一下：HTML代码   // 判断多选是否与选中项（没有选中的返回false）    function slcNo_click()    {        if (document.form1.checkboxname.le
C#获取CPU的利用率
也许有错 专栏
07-16 2069
        [STAThread]        public static void Main()        {            string path = AppDomain.CurrentDomain.BaseDirectory;  //获取基目录                      PerformanceCounter pc            = new Perfo
RadioButtonList绑定图片
也许有错 专栏
05-23 1793
 用 RaidoButtonList 绑定数据表中的图片,这是前台绑定代码asp:RadioButtonList id="fdsf".... DataTextField="IconPicID" DataTextFormatString="".../> //显示绑定图片 
当前代码 鼠标放在单元格上会显示其他颜色 如何设置鼠标悬浮不做任何改变
最新发布
06-11
<think>我们讨论的是WPFDataGrid，具体是如何在DataGridTemplateColumn中设置单元格在鼠标悬浮时不改变样式（比如背景颜色）。在DataGrid中，当鼠标悬浮在行或单元格上时，默认会有样式变化（如背景色）。如果希望取消这种效果，我们需要修改DataGrid的样式。注意：用户希望针对DataGridTemplateColumn的单元格设置，但实际上是整个DataGrid的行或单元格的样式。解决方案：1.我们可以通过设置DataGrid的RowStyle来取消行的悬浮效果。2.或者通过设置CellStyle来取消单元格的悬浮效果。关键点：重写DataGridCell的ControlTemplate，或者修改样式中的触发器。具体步骤：在DataGrid的CellStyle中，我们可以覆盖默认的鼠标悬停效果。通常，默认的悬停效果是通过触发器实现的，因此我们可以在样式中定义新的触发器或者去除触发器。示例：创建一个样式，将DataGridCell的悬停背景设置为透明（或者不变）以及同样处理选中状态。以下是实现单元格在鼠标悬停时不变色的样式：```xaml<DataGrid><DataGrid.Resources><StyleTargetType="DataGridCell"><SetterProperty="Background"Value="Transparent"/><SetterProperty="BorderBrush"Value="Transparent"/><SetterProperty="Template"><Setter.Value><ControlTemplateTargetType="DataGridCell"><BorderBackground="{TemplateBindingBackground}"BorderBrush="{TemplateBindingBorderBrush}"BorderThickness="{TemplateBindingBorderThickness}"><ContentPresenterVerticalAlignment="Center"/></Border></ControlTemplate></Setter.Value></Setter><Style.Triggers><!--这里可以自定义触发器，或者我们不想改变，可以去掉默认的触发器--><!--默认情况下，DataGridCell有鼠标悬停和选中状态的触发器--><!--如果我们希望鼠标悬停时不改变背景，就不写Trigger--><!--如果我们希望选中状态也不改变，可以同样处理Selected触发器--></Style.Triggers></Style></DataGrid.Resources><!--列定义--></DataGrid>```但注意，这样只是设置了单元格的样式，去除了原有的模板（该模板可能包含悬停效果）。实际上，默认的DataGridCell样式中有Trigger，但我们这里没有写Trigger，所以就不会有鼠标悬停的效果。另外，如果我们只想针对某一列（例如DataGridTemplateColumn）来设置，那么我们可以在该列中设置CellStyle，覆盖整个DataGrid的默认样式。但是，我们也要注意，DataGrid的行也有悬停效果（RowStyle中的鼠标悬停效果）。所以，如果要去除行的悬停效果，我们还需要设置RowStyle。所以，完整的解决方案如下：1.设置DataGrid的RowStyle，覆盖悬停效果（设置背景绑定不变）2.设置DataGrid的CellStyle，覆盖单元格的悬停效果示例：去除行的悬停效果```xaml<DataGrid><DataGrid.RowStyle><StyleTargetType="DataGridRow"><SetterProperty="Background"Value="Transparent"/><!--可选：设置选中状态--><Style.Triggers><TriggerProperty="IsMouseOver"Value="True"><!--将悬停时的背景设为和普通状态一样--><SetterProperty="Background"Value="Transparent"/></Trigger><TriggerProperty="IsSelected"Value="True"><SetterProperty="Background"Value="{DynamicResource{x:StaticSystemColors.HighlightBrushKey}}"/><SetterProperty="Foreground"Value="{DynamicResource{x:StaticSystemColors.HighlightTextBrushKey}}"/></Trigger></Style.Triggers></Style></DataGrid.RowStyle><DataGrid.CellStyle><StyleTargetType="DataGridCell"><SetterProperty="Background"Value="Transparent"/><SetterProperty="BorderBrush"Value="Transparent"/><SetterProperty="Template"><Setter.Value><ControlTemplateTargetType="DataGridCell"><BorderBackground="{TemplateBindingBackground}"BorderBrush="{TemplateBindingBorderBrush}"BorderThickness="{TemplateBindingBorderThickness}"><ContentPresenterVerticalAlignment="Center"/></Border></ControlTemplate></Setter.Value></Setter><Style.Triggers><!--可以覆盖选中状态，如果要保留选中状态就不覆盖--><TriggerProperty="IsSelected"Value="True"><SetterProperty="Background"Value="{DynamicResource{x:StaticSystemColors.HighlightBrushKey}}"/><SetterProperty="Foreground"Value="{DynamicResource{x:StaticSystemColors.HighlightTextBrushKey}}"/></Trigger></Style.Triggers></Style></DataGrid.CellStyle></DataGrid>```这样，鼠标悬停在行或单元格上时，背景就不会变化了（除了选中状态）。但是，如果希望完全没有任何效果（包括选中状态），则可以删除选中状态的触发器，或者将选中状态的背景也设置为透明。注意：这样设置会影响整个DataGrid的所有列。如果只想针对某些列（比如DataGridTemplateColumn），我们可以只在该列中设置CellStyle，覆盖全局的CellStyle。例如，对于DataGridTemplateColumn：```xaml<DataGridTemplateColumn><DataGridTemplateColumn.CellStyle><StyleTargetType="DataGridCell"BasedOn="{StaticResource{x:TypeDataGridCell}}"><!--去除触发器等--><SetterProperty="Background"Value="Transparent"/><Style.Triggers><!--覆盖所有触发器，不设置任何变化--></Style.Triggers></Style></DataGridTemplateColumn.CellStyle><!--其他定义--></DataGridTemplateColumn>```但是，如果全局已经设置了行样式，那么行的悬停效果可能还会存在。因此，如果我们只想单独设置某一列中的单元格，那么需要同时处理行样式和该列的单元格样式。由于DataGrid的行样式是针对整行的，无法在列中单独设置，所以如果我们希望只是某一列没有悬停效果，其他列有，那么就需要更复杂的处理。这可能不是用户想要的，用户的问题是针对DataGridTemplateColumn，我们通常理解为该列不改变，但实际上悬浮是作用于整行的。所以，如果用户希望悬浮在整行时，只有某些列（例如DataGridTemplateColumn）没有变化，而其他列有变化，这是无法直接做到的，因为悬浮效果是作用在整行上的。也就是说，当鼠标悬停在某一行时，该行的所有单元格都会改变（除非我们修改行样式不改变，或者修改该单元格的样式覆盖行样式带来的改变）。因此，我们需要理解用户的需求：是希望整个DataGrid都没有悬浮效果，还是希望某一列在悬浮时不变？如果是后者，那么需要权衡，因为行样式是整体的。但是，我们可以这样：在行样式中不设置背景，然后只在每一列中通过单元格样式来设置悬停效果。这样，我们就可以单独控制某一列在悬停时不变。然而，默认情况下，DataGrid的悬停效果是通过行样式实现的。所以，如果我们去除了行样式的悬停效果，然后只在需要悬停效果的列中设置单元格的悬停效果，这样就能实现单独控制。步骤：1.设置行样式中鼠标悬停时背景透明（或者不变）2.在需要悬停效果的列中，在CellStyle中添加触发器，当行被悬停时改变单元格背景（需要绑定到行的IsMouseOver属性，这很复杂）这可能会变得非常复杂。因此，更常见的做法是全局取消悬停效果，或者全局保留。综上所述，如果用户希望整个DataGrid都没有悬停效果，那么按照上述全局样式设置即可。如果希望只是某一列没有悬停效果，目前没有直接的方法，因为悬停效果是作用在行上的。但我们可以尝试通过以下方式：在单元格样式中，通过触发器监听行的IsMouseOver，然后忽略它（始终设置背景为正常状态）来实现该列在行悬停时不变。示例：我们首先在行样式中，设置一个当IsMouseOver为True时，背景改变，但是我们在特定列的单元格样式中，覆盖这个背景，强行设置为正常状态的背景。但是，这需要知道行样式中设置的值（正常状态的背景）是什么，可能是Transparent或者某个颜色。例如：```xaml<DataGrid.RowStyle><StyleTargetType="DataGridRow"><SetterProperty="Background"Value="Transparent"/><Style.Triggers><TriggerProperty="IsMouseOver"Value="True"><!--默认行悬停背景色--><SetterProperty="Background"Value="LightBlue"/></Trigger></Style.Triggers></Style></DataGrid.RowStyle><!--然后，在不需要悬停效果的列中，这样设置：--><DataGridTemplateColumn><DataGridTemplateColumn.CellStyle><StyleTargetType="DataGridCell"><!--正常状态背景--><SetterProperty="Background"Value="Transparent"/><Style.Triggers><!--当行处于悬停状态时，我们设置该单元格的背景为正常状态（覆盖行悬停设置给该单元格的背景）--><DataTriggerBinding="{BindingIsMouseOver,RelativeSource={RelativeSourceAncestorType=DataGridRow}}"Value="True"><SetterProperty="Background"Value="Transparent"/><!--或者你想要的颜色，比如如果是交错行，可能还需要绑定到交替行的背景色，这很复杂--></DataTrigger></Style.Triggers></Style></DataGridTemplateColumn.CellStyle></DataGridTemplateColumn>```但是，这样就会使得该列在行悬停时保持透明（不变）。注意，这里我们无法直接知道行的正常背景色（因为可能是交替行），所以我们可以使用绑定：```xaml<SetterProperty="Background"Value="{BindingBackground,RelativeSource={RelativeSourceAncestorType=DataGridRow},Mode=OneWay}"/>```但是，在行悬停时，行的背景变成了LightBlue，而我们希望该列保持行原来的背景（非悬停状态），这样就需要获取行在非悬停状态时的背景，这很困难。因此，建议如果不需要悬停效果，整个DataGrid都去除，或者接受全局的悬停效果。总结：根据需求，如果用户希望整个DataGrid都没有悬停效果，可以使用第一种全局样式设置。如果只是针对某个列，我们可以尝试第二种方法，但可能会比较复杂且不完美。因此，我给出一个假设：用户希望整个DataGrid都不显示鼠标悬停效果。那么我们可以设置行和单元格样式，去除悬停触发器。下面给出一个全局去除悬停效果的示例：```xaml<DataGrid><!--设置行样式，去除悬停效果--><DataGrid.RowStyle><StyleTargetType="DataGridRow"><SetterProperty="Background"Value="Transparent"/><!--也可以设置一个固定的背景色--><!--不设置IsMouseOver的触发器--><!--但是可能需要设置IsSelected的触发器--><Style.Triggers><TriggerProperty="IsSelected"Value="True"><SetterProperty="Background"Value="{DynamicResource{x:StaticSystemColors.HighlightBrushKey}}"/><SetterProperty="Foreground"Value="{DynamicResource{x:StaticSystemColors.HighlightTextBrushKey}}"/></Trigger></Style.Triggers></Style></DataGrid.RowStyle><!--设置单元格样式，去除悬停效果--><DataGrid.CellStyle><StyleTargetType="DataGridCell"><SetterProperty="Background"Value="Transparent"/><SetterProperty="BorderBrush"Value="Transparent"/><Style.Triggers><TriggerProperty="IsSelected"Value="True"><SetterProperty="Background"Value="{DynamicResource{x:StaticSystemColors.HighlightBrushKey}}"/><SetterProperty="Foreground"Value="{DynamicResource{x:StaticSystemColors.HighlightTextBrushKey}}"/></Trigger></Style.Triggers></Style></DataGrid.CellStyle><!--列定义--></DataGrid>```这样，鼠标悬停在行或单元格上时，背景色不会改变，但选中状态会改变（如果需要去掉选中状态的变化，删除触发器即可）。如果用户希望针对某个特定的列（比如DataGridTemplateColumn）做去除悬停效果，而其他列保留，那么需要更复杂的处理。在此，由于问题中没有明确，我们给出一个全局去除的方案。最后，请注意，如果用户希望完全去除所有效果，包括焦点效果等，可能还需要设置其他属性，比如FocusVisualStyle等。希望这能解决用户的问题。§§相关问题§§1.如何在WPFDataGrid中设置鼠标选中行的样式？2.如何设置WPFDataGrid的交错行的背景色？3.WPFDataGrid中如何自定义行的样式？</think> ### 如何禁用 WPF DataGrid 单元格的鼠标悬停样式 要禁用 DataGrid 中单元格（包括 `DataGridTemplateColumn`）的鼠标悬停效果，您需要重写控件的默认样式。以下是详细解决方案： #### 完整解决方案 ```xaml <DataGrid> <DataGrid.Resources> <!-- 重写单元格样式 --> <Style TargetType="DataGridCell"> <Setter Property="Background" Value="Transparent"/> <Setter Property="BorderBrush" Value="Transparent"/> <!-- 移除所有鼠标交互效果 --> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" Value="Transparent"/> <Setter Property="BorderBrush" Value="Transparent"/> </Trigger> <Trigger Property="IsSelected" Value="True"> <Setter Property="Background" Value="Transparent"/> <Setter Property="BorderBrush" Value="Transparent"/> </Trigger> </Style.Triggers> </Style> <!-- 重写行样式 --> <Style TargetType="DataGridRow"> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" Value="Transparent"/> </Trigger> </Style.Triggers> </Style> </DataGrid.Resources> <!-- 列定义（包含 DataGridTemplateColumn） --> <DataGrid.Columns> <DataGridTemplateColumn> <!-- 自定义内容 --> </DataGridTemplateColumn> <!-- 其他列 --> </DataGrid.Columns> </DataGrid> ``` #### 关键实现点 1. **禁用单元格悬停效果**： ```xaml <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" Value="Transparent"/> </Trigger> ``` 2. **禁用选中状态效果**： ```xaml <Trigger Property="IsSelected" Value="True"> <Setter Property="Background" Value="Transparent"/> </Trigger> ``` 3. **禁用行悬停效果**： ```xaml <Style TargetType="DataGridRow"> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" Value="Transparent"/> </Trigger> </Style.Triggers> </Style> ``` 4. **特殊场景处理**： ```xaml <!-- 对于需要保留某些交互的列 --> <DataGridTemplateColumn.CellStyle> <Style BasedOn="{StaticResource {x:Type DataGridCell}}"> <!-- 自定义行为 --> </Style> </DataGridTemplateColumn.CellStyle> ``` #### 原理说明 WPF DataGrid 的悬停效果是通过内置样式触发器实现的： - `DataGridCell` 默认有 `IsMouseOver` 触发器 - `DataGridRow` 有独立的悬停效果 - 通过将所有相关属性设置为 `Transparent` 即可禁用视觉效果[^4] 此方法完全兼容 `DataGridTemplateColumn`，且不需要修改列内模板。 ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值