Re: Is there any way to remove the sort arrow decorator in a header of a CellTable?
I don't think this will work, the arrow icon is added by wrapping the
header Cell in an
IconCellDecoratorhttp://google-web-toolkit.googlecode.com/svn/javadoc/latest/com/google/gwt/cell/client/IconCellDecorator.html(in
AbstractCellTable.getSortDecorator(), which is called in
AbstractCellTable.createHeaders(), both private methods).
I have a similar issue in that I want to move the icon to the right of the
label, so I also need to target the icon. Xavier, you could try using CSS
to hide the icon. Just as you've replaced the icon resources in you
TableResources interface, you can replace and extend the CSS file:
public interface TableResources extends CellTable.Resources {
@Source(up.png)
ImageResource cellTableSortAscending();
@Source(down.png)
ImageResource cellTableSortDescending();
@Source(MyCellTable.css)
CellTable.Style cellTableStyle();
}
And in MyCellTable.css:
...
/* hack to remove sort icon */
.cellTableSortedHeaderAscending div,
.cellTableSortedHeaderDescending div {
padding-left: 0;
}
.cellTableSortedHeaderAscending div div:first-child,
.cellTableSortedHeaderDescending div div:first-child {
display: none;
}
...
The CSS above undoes the cell decorator's padding and hides the icon. If
you need help with getting the CSS to work the first place to look is the
ClientBundle
dev
guidehttps://developers.google.com/web-toolkit/doc/latest/DevGuideClientBundle
.
On Sunday, March 11, 2012 7:33:16 AM UTC-4, Olivier TURPIN wrote:
Hello Xavier
You should take a look at Header class (in
com.google.gwt.user.cellview.client package) by extending it you'll have
access to the Template in use, maybe you can declare your own or just
override render method and inject your code to the SafeHtmlBuilder
@Override
public void render(Context context, SafeHtmlBuilder sb) {
// do what you want with the builder
// sb.append();
}
Olivier.
Le samedi 10 mars 2012 12:35:51 UTC+1, Xavier S. a écrit :
Hello Jose,
Thanks for your answer!
I wasn't aware of the CellTable.Resources classes, it seems to fit my
needs. But (there's always a but :) ).
The generated html code for that sort arrow is the following :
div
style=left:0px;margin-top:-4px;position:absolute;top:50%;line-height:0px;
img onload=this.__gwtLastUnhandledEvent=quot;loadquot;; src=
http://127.0.0.1:/main/clear.cache.gif; style=width: 11px; height:
7px; background: url(data:image/png;base64,SOMEBASE64CODE) no-repeat 0px
0px; border=0
/div
And I would like to change it to something like this :
div style=left:0px;margin-top:-4px;position:absolute;top:
30%;line-height:0px;
i class=icon-arrow-up/i
/div
So mostly change the img tag by a i one where I can use twitter
bootstrap css icons and maybe change the top style arg of the enclosing div.
Is there any way to do it with GWT?
Thanks again and best regards,
Xavier
On Saturday, March 10, 2012 6:15:45 AM UTC+1, JoseM wrote:
You can control what to show for that with the CellTable Resources. You
would have to pass in your own resources to the CellTable constructor that
overrides the sort style to display what you want.
On Sunday, March 11, 2012 7:33:16 AM UTC-4, Olivier TURPIN wrote:
Hello Xavier
You should take a look at Header class (in
com.google.gwt.user.cellview.client package) by extending it you'll have
access to the Template in use, maybe you can declare your own or just
override render method and inject your code to the SafeHtmlBuilder
@Override
public void render(Context context, SafeHtmlBuilder sb) {
// do what you want with the builder
// sb.append();
}
Olivier.
Le samedi 10 mars 2012 12:35:51 UTC+1, Xavier S. a écrit :
Hello Jose,
Thanks for your answer!
I wasn't aware of the CellTable.Resources classes, it seems to fit my
needs. But (there's always a but :) ).
The generated html code for that sort arrow is the following :
div
style=left:0px;margin-top:-4px;position:absolute;top:50%;line-height:0px;
img onload=this.__gwtLastUnhandledEvent=quot;loadquot;; src=
http://127.0.0.1:/main/clear.cache.gif; style=width: 11px; height:
7px; background: url(data:image/png;base64,SOMEBASE64CODE) no-repeat 0px
0px; border=0
/div
And I would like to change it to something like this :
div style=left:0px;margin-top:-4px;position:absolute;top:
30%;line-height:0px;
i class=icon-arrow-up/i
/div
So mostly change the img tag by a i one where I can use twitter
bootstrap css icons and maybe change the top style arg of the enclosing div.
Is there any way to do it with GWT?
Thanks again and best regards,
Xavier
On Saturday, March 10, 2012 6:15:45 AM UTC+1, JoseM wrote:
You can control what to show for that with the CellTable Resources. You
would have to pass in your own resources to the CellTable constructor that
overrides the sort style to display what you want.
--
You received this message because you are subscribed to the
Re: Is there any way to remove the sort arrow decorator in a header of a CellTable?
Sorry, you need to added !important because the styles you're overriding
are defined inline:
/* hack to remove sort icon */
.
cellTableSortedHeaderAscending div,
.cellTableSortedHeaderDescending div {
padding-left: 0* !important*;
}
.cellTableSortedHeaderAscending div div:first-child,
.cellTableSortedHeaderDescending div div:first-child {
display: none* !important*;
}
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/HkaaW7oebKMJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: Is there any way to remove the sort arrow decorator in a header of a CellTable?
Hello Xavier
You should take a look at Header class (in
com.google.gwt.user.cellview.client package) by extending it you'll have
access to the Template in use, maybe you can declare your own or just
override render method and inject your code to the SafeHtmlBuilder
@Override
public void render(Context context, SafeHtmlBuilder sb) {
// do what you want with the builder
// sb.append();
}
Olivier.
Le samedi 10 mars 2012 12:35:51 UTC+1, Xavier S. a écrit :
Hello Jose,
Thanks for your answer!
I wasn't aware of the CellTable.Resources classes, it seems to fit my
needs. But (there's always a but :) ).
The generated html code for that sort arrow is the following :
div
style=left:0px;margin-top:-4px;position:absolute;top:50%;line-height:0px;
img onload=this.__gwtLastUnhandledEvent=quot;loadquot;; src=
http://127.0.0.1:/main/clear.cache.gif; style=width: 11px; height:
7px; background: url(data:image/png;base64,SOMEBASE64CODE) no-repeat 0px
0px; border=0
/div
And I would like to change it to something like this :
div style=left:0px;margin-top:-4px;position:absolute;top:
30%;line-height:0px;
i class=icon-arrow-up/i
/div
So mostly change the img tag by a i one where I can use twitter
bootstrap css icons and maybe change the top style arg of the enclosing div.
Is there any way to do it with GWT?
Thanks again and best regards,
Xavier
On Saturday, March 10, 2012 6:15:45 AM UTC+1, JoseM wrote:
You can control what to show for that with the CellTable Resources. You
would have to pass in your own resources to the CellTable constructor that
overrides the sort style to display what you want.
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/QRfhQR0C6Y0J.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: Is there any way to remove the sort arrow decorator in a header of a CellTable?
Hello Jose, Thanks for your answer! I wasn't aware of the CellTable.Resources classes, it seems to fit my needs. But (there's always a but :) ). The generated html code for that sort arrow is the following : div style=left:0px;margin-top:-4px;position:absolute;top:50%;line-height:0px; img onload=this.__gwtLastUnhandledEvent=quot;loadquot;; src=http://127.0.0.1:/main/clear.cache.gif; style=width: 11px; height: 7px; background: url(data:image/png;base64,SOMEBASE64CODE) no-repeat 0px 0px; border=0 /div And I would like to change it to something like this : div style=left:0px;margin-top:-4px;position:absolute;top: 30%;line-height:0px; i class=icon-arrow-up/i /div So mostly change the img tag by a i one where I can use twitter bootstrap css icons and maybe change the top style arg of the enclosing div. Is there any way to do it with GWT? Thanks again and best regards, Xavier On Saturday, March 10, 2012 6:15:45 AM UTC+1, JoseM wrote: You can control what to show for that with the CellTable Resources. You would have to pass in your own resources to the CellTable constructor that overrides the sort style to display what you want. -- You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/ATKOCZenY7IJ. To post to this group, send email to google-web-toolkit@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
Re: Is there any way to remove the sort arrow decorator in a header of a CellTable?
For now, I used separated pngs in the img tag by doing the following :
public interface TableResources extends CellTable.Resources {
@Source(up.png)
ImageResource cellTableSortAscending();
@Source(down.png)
ImageResource cellTableSortDescending();
}
But I still would like to use the i tag rather than the img one, any
idea?
Regards,
Xavier
On Saturday, March 10, 2012 12:35:51 PM UTC+1, Xavier S. wrote:
Hello Jose,
Thanks for your answer!
I wasn't aware of the CellTable.Resources classes, it seems to fit my
needs. But (there's always a but :) ).
The generated html code for that sort arrow is the following :
div
style=left:0px;margin-top:-4px;position:absolute;top:50%;line-height:0px;
img onload=this.__gwtLastUnhandledEvent=quot;loadquot;; src=
http://127.0.0.1:/main/clear.cache.gif; style=width: 11px; height:
7px; background: url(data:image/png;base64,SOMEBASE64CODE) no-repeat 0px
0px; border=0
/div
And I would like to change it to something like this :
div style=left:0px;margin-top:-4px;position:absolute;top:
30%;line-height:0px;
i class=icon-arrow-up/i
/div
So mostly change the img tag by a i one where I can use twitter
bootstrap css icons and maybe change the top style arg of the enclosing div.
Is there any way to do it with GWT?
Thanks again and best regards,
Xavier
On Saturday, March 10, 2012 6:15:45 AM UTC+1, JoseM wrote:
You can control what to show for that with the CellTable Resources. You
would have to pass in your own resources to the CellTable constructor that
overrides the sort style to display what you want.
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/2B6bWv1Jd6AJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: Is there any way to remove the sort arrow decorator in a header of a CellTable?
Maybe you can do it by subclassing CellTable and overriding the code which renders that piece but I'm not sure if that can be easily done. Or create your own version of CellTable that renders it as an i tag. -- You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/jMBNpKyjnlYJ. To post to this group, send email to google-web-toolkit@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
Is there any way to remove the sort arrow decorator in a header of a CellTable?
Hello, I would like to remove the sort arrow from headers of a CellTable but I still want to keep the sorting capabilities of the CellTable. (the one in the red circle) https://lh6.googleusercontent.com/-cOU7_lWO7uo/T1pF9sz17vI/AvA/Tj3cdU949EE/s1600/Capture%2520d%25E2%2580%2599%25C3%25A9cran%25202012-03-09%2520%25C3%25A0%252018.49.34.png Is it possible? And how? Regards, Xavier -- You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/CyG-Sg1LgJIJ. To post to this group, send email to google-web-toolkit@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
Is there any way to remove the sort arrow decorator in a header of a CellTable?
You can control what to show for that with the CellTable Resources. You would have to pass in your own resources to the CellTable constructor that overrides the sort style to display what you want. -- You received this message because you are subscribed to the Google Groups Google Web Toolkit group. To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/qPY0Iep7nRsJ. To post to this group, send email to google-web-toolkit@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
