GWT CellTable - 如何将排序箭头从左侧移动到右侧

Question

我想在单元格表格标题中从左到右移动排序箭头，如下图

所示

有任何建议吗？

Answer 1

我花了一段时间才找到，但解决方案非常简单。单元格表使用默认标题生成器，它具有在左侧或右侧呈现排序图标的选项。

DefaultHeaderOrFooterBuilder<Contact> headerBuilder = new DefaultHeaderOrFooterBuilder<>(table, false);
headerBuilder.setSortIconStartOfLine(false);
table.setHeaderBuilder(headerBuilder);

干杯！

Answer 2

我想我有一些你可以玩的原创想法，看看它们是否有帮助：

1. 获取包含箭头img的div的句柄，以添加将在CSS选择器中使用的样式类名[2。你需要的右对齐样式......也许这样的东西会起作用：

   CellTable.getTableHeadElement().addClassName( "myTableHeadersClassname" );
   

2. 如果1.成功获得＆＃34; myTableHeadersClassname＆＃34;在CellTable的thead元素上的classname，然后我认为我们状态良好。我认为这个CSS选择器将起作用：

   .myTableHeadersClassName div div:nth-child(1){
       left: auto;
       right: 0 px;
   }
   

我不确定1.是否会起作用，所以这可能是困难的部分。但想法是在CellTable DOM层次结构中的某处添加一个类名，然后创建CSS选择器。只要您可以应用该类名并制作选择器，您应该只是面对摆弄该选择器的样式（尽管我认为2中选择器内的样式应该在那时起作用）。如果1.不起作用，我认为你总是可以将一个类名放在顶层的CellTable本身，然后让这个稍微复杂的选择器：

.myCellTableClassname thead div div:nth-child(1)

无论你选择哪条路线，左边的风格都应该重写CellTable的内联风格;如果我写的不那样做，那么只需在选择器中添加更多特异性，直到它完成。

希望其中一些有帮助...