如何將圖像插入CellTable（GWT）的列標題中？

如果我們使用文本標題，那麼它可能需要一些空間，所以我希望標題有一個圖標（如刪除圖標），這樣我就可以爲標題保存一些空間。如何將圖像插入CellTable（GWT）的列標題中？

我試圖

myCellTable.addColumn(deleteColumn,new SafeHtmlHeader(SafeHtmlUtils.fromSafeConstant 
("<img width=\"30px\" height=\"30px\" src=\"image/icon/delete.png\">")));

它顯示的圖像，但圖像約（10px的 - 10px的）非常小，它具有圖像周圍難看的邊界。

SOmeone表示使用CUstom標題，但我無法覆蓋getHeaderStyleNames()。例如：

class DeleteHeader extends Header{ 
    @Override 
    public String getHeaderStyleNames(){ 
     return "css style"; 
    } 
}

它說我必須重寫超類型的東西....！

那麼如何解決它呢？

來源

2014-03-28 Tum

試試這個：

header.setHeaderStyleNames("deleteHeader");

不要在此標題渲染圖像。例如，您可以使用標準的TextHeader。

在CSS中定義這種風格與圖像作爲背景。

來源

2014-03-28 04:52:56

嗨awsome解決方案，但如何樣式標題，因爲圖像佔據整個標題列甚至我設置小尺寸。 .columnHeader { \t background：url（'/ images/icon/delete.png'）; \t background-size :: 16px 16px; } – Tum

它似乎沒問題，但如何集中圖像？文本對齊：中心沒有工作。該圖像對齊了標題 – Tum

的左側，我固定了「background-position：center;」。再次，非常感謝您的回答。這是將圖片放入標題的最優雅的解決方案。 – Tum

如何將圖像插入CellTable（GWT）的列標題中？

回答

相關問題