Thursday, March 27, 2014

Re: How to insert Image into Column Header of CellTable (GWT)?

Found the answer, using the background-image strategy

In css:

.columnHeader{
 background
-image:url('/images/icon/delete.png');
 background
-size:16px 16px;
 background
-repeat:no-repeat;
 background
-position:center;
 
}


in Java
TextHeader deleteHeader=new TextHeader("");
deleteHeader
.setHeaderStyleNames(getView().getRes().css().columnHeader());
myCellTable
.addColumn(deleteColumn,deleteHeader);




On Friday, March 28, 2014 3:22:27 PM UTC+11, Tom wrote:
If we use Text for the header then it may take some space, so I want the Header have an icon(like Delete Icon) so I can save some space for the Header.

So I tried

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

It showed the image but the Image is very small about (10px - 10px) and it has a ugly border around the image.


Someone said using CUstom Header, but I couldn't override getHeaderStyleNames(). Ex:

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

It said i have to override supertype something....!!

So how to fix it?

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

No comments:

Post a Comment