gwt-ext icons, how to use?

[superdx23]

Hey all,

I am trying to get icons to display in certain places, and the icon
files that come with the ext-2.02 package are perfectly fine. However
I can't figure for the life of me what I'm missing. Following are
snippets of my code:


Java:
Panel settingsPanel = new Panel();
settingsPanel.setTitle("Settings");
settingsPanel.setAutoScroll(true);
settingsPanel.setBorder(false);
settingsPanel.setIconCls("x-tool-gear"); // <--- trying to call the
icon here

HTML (linking the css & js):

<script type="text/javascript" src="js/ext/ext-all.js"></script>
<link href="js/ext/resources/css/ext-all.css" rel="stylesheet"
type="text/css" />



But when it renders... no icon is displayed... any help would be
appreciated. I have double checked that the /css folders and /image
folders all exist in my package's public folder:

com.mycompany.mypackage directory has:
js > ext > resources > css
js > ext > resources > images

[Dariusz Borowski]

Almost there...

Java -> OK
Path -> Wrong

In your module you need to call your file.css, which goes into your public folder.

Dariusz

[rajasekhar911]

Hi

I am also having the same problem.
did u guys solve this?

On Sep 24, 2:56 am, "Dariusz Borowski" <darius...@gmail.com> wrote:
> Almost there...
>
> Java -> OK
> Path -> Wrong
>

> In your module you need to call your *file.css*, which goes into your public
> folder.
>
> Dariusz

[Dariusz Borowski]

Here is an example:

Take a look at the structure (attachment).

Inside the grid.css (your own css file) you can have such an entry:

1. .db_icon
2. {
3.         background-image: url(../js/ext/resources/icons/database.gif) !important;
4.         padding-right: 5px;
5.         margin: 0 !important;
6. }
   
   
   

And in your module, you need to call your css file as well for example like this:

1. <module>
2.  
3.         <!– Inherit the core Web Toolkit stuff. –>
4.         <inherits name='com.google.gwt.user.User'/>
5.         <!– Inherit the GWTExt Toolkit library configuration. –>
6.         <inherits name='com.gwtext.GwtExt' />
7.  
8.         <!– Set our own css file –>
9.         <stylesheet src="css/grid.css" />
10.  
11.  
12.         <stylesheet src="js/ext/resources/css/ext-all.css" />
13.         <script src="js/ext/adapter/ext/ext-base.js" />
14.         <script src="js/ext/ext-all.js" />
15.  
16. </module>

Finally, you can start using it in your backend:

For example in your grid:

1.       GridPanel grid = new GridPanel();
2.       grid.setIconCls( "db_icon" );

I hope this helps.

[rajasekhar911]

hey darius

thanks for your help man..
the icons are displaying..:-)
thnx..