如何更改鼠标悬停突出显示? [英] How do you change the mouse over highlighting?

问题描述

在 GWT 中，我使用的是 CellTable.

In GWT, I am using CellTable.

当您将鼠标悬停在 CellTable 上时，它会突出显示每一行.

When you mouse over the CellTable it highlights each row.

如何改变鼠标悬停时突出显示的行为?具体来说:

• 更改突出显示的颜色
• 禁用/启用
• 使其仅突出显示光标处的特定网格项(而不是整行)

(我目前的 hack 是创建一堆 1 列宽的 CellTables 并将它们添加到 VerticalPanel 布局中...创造一种错觉，即有一个 CellTable 并根据您的光标突出显示每个网格.这很糟糕吗?为什么? 性能?)

( The current hack I have is to create a bunch of 1 column wide CellTables and add them to a VerticalPanel layout... creating the illusion that there is one CellTable and it highlights each grid according to your cursor. Is this bad? Why? performance? )

推荐答案

你会注意到 CellTable 使用了一个 ResourceBundle，这意味着所有的 css 样式都被混淆了......这使得覆盖样式变得更加困难.

You will notice the CellTable uses a ResourceBundle, which means all the css styles get obfuscated ... this makes it more difficult to override styles.

CellTable 构造函数实际上允许您覆盖默认的 ResourceBundle.因此，首先，您需要像这样创建自己的资源包:

The CellTable constructor will actually allow you to override the default ResourceBundle. So first, you need to create your own resource bundle like this:

public interface CellTableResources extends Resources {

        public CellTableResources INSTANCE =
                GWT.create(CellTableResources.class);

        /**
         * The styles used in this widget.
         */
        @Source("CellTable.css")
        CellTable.Style cellTableStyle();
}

然后您需要创建自己的 CSS 文件.我建议将 CellTable 样式直接复制到您的项目中，并将其用作起点.你可以在这里找到它:http://code.google.com/p/google-web-toolkit/source/browse/trunk/user/src/com/google/gwt/user/cellview/client/CellTable.css

Then you need to create your own CSS file. I recommend copying the CellTable style directly into your project and use that as a starting point. You can find it here: http://code.google.com/p/google-web-toolkit/source/browse/trunk/user/src/com/google/gwt/user/cellview/client/CellTable.css

确保首先注入样式，然后像这样将其提供给 CellTable 的构造函数:

Make sure the style is injected first, and then you just feed it into the CellTable's constructor like this:

   CellTableResources.INSTANCE.cellTableStyle().ensureInjected();
   myCellTable = new CellTable<T>(Integer.MAX_VALUE,CellTableResources.INSTANCE);

具体来说，您需要调整这些样式:

Specifically, you'll want to tweak these styles:

• cellTableKeyboardSelectedRow
• cellTableKeyboardSelectedRowCell
• cellTableSelectedRow
• cellTableSelectedRowCell
• cellTableKeyboardSelectedCell

需要注意的是，单元格表区分了选定行"和键盘选定行".选定的行是实际选定的行(即通过 SelectionModel).键盘选中的行是指当用户按下向上/向下键时突出显示的行，但并不意味着该行被实际选中(如果有意义的话).

It is important to note that the cell table differentiates between the 'selected row' and the 'keyboard selected row'. The selected row is the actual row selected (ie via SelectionModel). The keyboard selected row refers to what is highlighted when the user is pressing the up / down key, but does not mean the row is actually selected (if that makes sense).

这篇关于如何更改鼠标悬停突出显示?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！