PDA

View Full Version : More ExtGWT themes derived from ExtJS ones



Cypher
15 Sep 2008, 7:28 AM
Hi guys,

I have wrapped the ExtJS themes created by madrabaz so they can be used also in ExtGWT.

Themes:
- Black (http://extjs.com/forum/showthread.php?t=15504);
- DarkGray (http://extjs.com/forum/showthread.php?t=15341);
- Olive (http://extjs.com/forum/showthread.php?t=15505);
- Purple (http://extjs.com/forum/showthread.php?t=15377);
- Slickness (http://extjs.com/forum/showthread.php?t=28024);

Usage:

Insert this to your *.gwt.xml file:


<inherits name='ext.ux.theme.black.Black'/>
<inherits name='ext.ux.theme.darkgray.DarkGray'/>
<inherits name='ext.ux.theme.purple.Purple'/>
<inherits name='ext.ux.theme.olive.Olive'/>
<inherits name='ext.ux.theme.slickness.Slickness'/>


Then add the theme JAR files to your classpath.

Then add this to your ExtGWT Java code:


import ext.ux.theme.black.client.Black;
import ext.ux.theme.darkgray.client.DarkGray;
import ext.ux.theme.purple.client.Purple;
import ext.ux.theme.olive.client.Olive;
import ext.ux.theme.slickness.client.Slickness;


And then register the theme as follows:


ThemeManager.register(Black.BLACK);
ThemeManager.register(DarkGray.DARKGRAY);
ThemeManager.register(Olive.OLIVE);
ThemeManager.register(Purple.PURPLE);
ThemeManager.register(Slickness.SLICKNESS);


Enjoy!

Cypher

PS:
The attached ZIP files need to be renamed to JAR and then included in your ExtGWT project.

bjagodzinski
15 Sep 2008, 11:12 PM
As a beginner I have a question concerning adding a theme to the project. I add the module inherited in the xml file, add the jar to the classpath, register the theme and nothing changes with the display..
I suppose I can be placing register line in the wrong place, I paste the line

ThemeManager.register(Slickness.SLICKNESS);in the first line of the onModuleLoad() method of my entry point. Is it right?

regards,
bj

bjagodzinski
16 Sep 2008, 12:08 AM
Ok, I found the solution. For those who might be interested in the future: Registering a theme is not enough, you have to also set the theme, to have it visible. To do this, you can use ThemeSelector combobox, or set the theme as default theme for the app, just by pasting this line into the onModuleLoad method:


GXT.setDefaultTheme(Slickness.SLICKNESS, true);

Cypher
16 Sep 2008, 6:27 AM
Sorry, I forgot to mention that one has to either set the default theme or add a "Theme Selector" list-box GUI somewhere in the configuration section of the GWT application, something like this:



HorizontalPanel configPanel = new HorizontalPanel();
configPanel.setSpacing(10);

ContentPanel themesPanel = new ContentPanel();
themesPanel.setHeading("Themes");
themesPanel.setFrame(true);
themesPanel.setWidth(150);
themesPanel.setLayout(new FillLayout());
themesPanel.add(new ThemeSelector());

configPanel.add(themesPanel);

add(configPanel);


The screenshot of such "Theme Selector" panel is attached.

Thanks, bjagodzinski, for bringing this to my attention.

Cypher

Daniel Kurka
18 Sep 2008, 10:58 PM
The files inside the zips dont have the file extension .jar

Maybe correct that?

gslender
18 Sep 2008, 11:16 PM
no, the files need to be renamed to .jar and then included in your project.

Cypher
19 Sep 2008, 4:57 AM
Exactly - the attached files are actually JAR files with ZIP extension. I had to do it this way because this forum doesn't allow attaching JAR files...

Daniel Kurka
22 Sep 2008, 9:41 PM
I think it would be better then to just zip the jar files...

renaming the file extention is rather confusing :)

But nice work with all the themes

zaccret
25 Sep 2008, 1:52 AM
+1 to put jar files in a zip file.

By the way, what are the licenses of the themes ?

And also, thanks for the job, it is really helpful !

Cypher
27 Sep 2008, 3:12 PM
I'm glad you like those themes. I do like them too. Next time I'll zip the JAR files if it helps, no problem.

As for the license, please contact the original ExtJS theme author (in this case it's madrabaz). The GXT theme wrapper that I added to those themes is "public domain".

sdc
29 Sep 2008, 5:49 AM
The themes are under GPL license. Therefore, Cypher, I think you should also distribute them under GPL.

@Zaccret : anyway, IMHO, I think you can consider that if you distribute an application in a bundle including the unmodified themes, you are not making a derivative work. Your application can reasonably be considered as independant of the themes, no ?

Cypher
29 Sep 2008, 5:29 PM
I looked into CSS files included in those themes and here is the license summary:
- Black theme - GPL;
- DarkGray theme - LGPL;
- Olive theme - LGPL;
- Purple theme - explicitely not defined but based on ExtJS 2.0 Alpha 1;
- Slickness theme - LGPL;

And because my GXT theme wrapper (10 lines of Java code) is "public domain", the license of the whole theme package is defined by license of theme resources - which is GPL or LGPL respectively. Should you have any license-related questions, please contact the original author.

sdc
2 Oct 2008, 1:41 AM
I apologize. If your theme wrappers are public domain, it is ok for you, this is of course GPL-compatible. It is just I didn't know it was possible to renounce to your copyright.

gslender
2 Oct 2008, 4:02 AM
There is a legal difference between a license and copyright.

An author always retains copyright automatically without doing anything. A license exist so others can use the works with conditions.

Copyright is law/legislation. Licenses are contracts/agreements between two parties (the author and the user).

GPL is a license and does nothing to restrict or limit copyright. Most legal systems in the world see contracts that attempt to restrict law as being void, so very few (if any) contract attempt to remove rights given under law (ie copyright).

An author can issue works with no license but will always retain copyright.

sdc
2 Oct 2008, 4:46 AM
Thanks, gslender for explanations. I have no doubt you are right and that author always retains copyright.

But does a work with no license = everybody can legally use it ?
By the way, I think we cannot say that they are in public domain, because public domain mean that there is no copyright on it.

gslender
2 Oct 2008, 1:04 PM
First of all, I'm not providing legal advice - you need to get that yourself.


But does a work with no license = everybody can legally use it ?

Yes. If you distribute (ie make available with no restrictions) then you are allowing use with no license.


By the way, I think we cannot say that they are in public domain, because public domain mean that there is no copyright on it.

An author always gets copyright of the works he/she creates. With those rights they can give permission to use without restrictions, but can always later change the terms of use as they own the copyright.

Public domain is suggesting the works are commonly known things like a stick drawing of a man. Claiming ownership of all stick men drawings is not allowed as the concept is public domain (ie all folk know what a stick man is since 1st grade school).

Nobody really declares something as public domain as that is normally decided by courts or law - ie even if I write some clever software, claim it as public domain, I can later change my mind and make it copyright (as I am author that would be allowed). You would contest in court that it is public domain (probably by my previous claim that it was), and if correct, I would have no claim for copyright.

If the code in the themes are commonly known (and given there is only one way to bundle an ExtJS theme in GXT it would be) then it would be fair to believe that the works are public domain. Similar to worrying that Sun could lay a claim to copyrighting the use of certain MVC Java patterns - these are now commonly known across many different languages and use within Java is public domain. There is no reasonable copyright of the MVC pattern in java.

jamisonke
14 Apr 2009, 8:18 AM
Thanks for your hard work.

P.S.
I respect the others folks opinions regarding zipping up jars but y'know, for someone who will benefit from your work and generosity, I think that is simply splitting hairs.
It was very easy for me to change the extension of the files as I downloaded and saved them.

Thanks again!

Regards,
Ken

Cypher
14 Apr 2009, 6:40 PM
No problem, Ken...it's good to hear that you like those themes...

jpnet
16 Apr 2009, 12:38 PM
These themes are awesome. Has anyone tested them with GXT 2.0?

-JP

sgolla
23 Apr 2009, 1:38 AM
Nice themes, good work. But good if steps were given on how to create a brand new theme for using in GXT.

Regards
Sreekanth.

avsrinivasa
21 Jul 2009, 2:53 AM
Good Work :)
Can you please let me know where can I find all themes zip files?
can you please let me know the location?
Thanks in advance.
Srinivas

Cypher
28 Jul 2009, 8:31 AM
You can find them on the first page of this thread: http://extjs.com/forum/showthread.php?t=47222

navi75
1 Aug 2009, 5:28 AM
I am facing a problem on IntelliJ8 for not finding the theme classes.

I am using Intellij8 as the IDE for development. I have renamed the ZIP files to jar and added the jar files to the classpath of my project.

I my project *.gwt.xml when i am trying to inherit the class names as mentioned below:

The IntelliJ8 is showing them in red color and complains that class not found in the package.

Can anyone help me on the same. It looks like i am missing something as i know from the above forum replies that this works.

<inherits name='ext.ux.theme.black.Black'/>
<inherits name='ext.ux.theme.darkgray.DarkGray'/>
<inherits name='ext.ux.theme.purple.Purple'/>
<inherits name='ext.ux.theme.olive.Olive'/>
<inherits name='ext.ux.theme.slickness.Slickness'/>

rgalvao
11 Aug 2009, 9:36 AM
Hey Cipher,

Does they work on GXT 2.0?
If not, what are the changes that need to be made?

TIA,
R.

xalvaro
11 Aug 2009, 11:52 PM
For the few test I have done,
They seems to work.

navi75
14 Aug 2009, 6:07 PM
What steps did you followed to configure the same on Intellij8 IDE to make it work?

1) Download the ZIP files for the themes?
2) Rename them to Jar.
3) Place the Jar files in the lib directory of the project.
4) Configure the same in the *.gwt.xml file as below

<inherits name='ext.ux.theme.black.Black'/>
<inherits name='ext.ux.theme.darkgray.DarkGray'/>
<inherits name='ext.ux.theme.purple.Purple'/>
<inherits name='ext.ux.theme.olive.Olive'/>
<inherits name='ext.ux.theme.slickness.Slickness'/>

Is all the above steps correct.

http://extjs.com/forum/images/misc/progress.gif

Cypher
22 Sep 2009, 11:05 AM
Well, rgalvao, then seem to work fine also with GXT 2.0.

georgewang
30 Sep 2009, 7:52 PM
Hi there. I'd apprecite it if anyone can help me with problems:

I dowloaded the zip files, renamed them as jar files, and put them into classpath. Both NetBeans and Eclipse can not process the jar files "Error processing classpath URL ...gxt-black.jar" is what Eclipse said.

And in NetBeans, it seems still know it is a zip file after renamed as jar.

Would Cypher kindly zip the jars, thanks.

George



Hi guys,

I have wrapped the ExtJS themes created by madrabaz so they can be used also in ExtGWT.

Themes:
- Black (http://extjs.com/forum/showthread.php?t=15504);
- DarkGray (http://extjs.com/forum/showthread.php?t=15341);
- Olive (http://extjs.com/forum/showthread.php?t=15505);
- Purple (http://extjs.com/forum/showthread.php?t=15377);
- Slickness (http://extjs.com/forum/showthread.php?t=28024);

Usage:

Insert this to your *.gwt.xml file:


<inherits name='ext.ux.theme.black.Black'/>
<inherits name='ext.ux.theme.darkgray.DarkGray'/>
<inherits name='ext.ux.theme.purple.Purple'/>
<inherits name='ext.ux.theme.olive.Olive'/>
<inherits name='ext.ux.theme.slickness.Slickness'/>


Then add the theme JAR files to your classpath.

Then add this to your ExtGWT Java code:


import ext.ux.theme.black.client.Black;
import ext.ux.theme.darkgray.client.DarkGray;
import ext.ux.theme.purple.client.Purple;
import ext.ux.theme.olive.client.Olive;
import ext.ux.theme.slickness.client.Slickness;


And then register the theme as follows:


ThemeManager.register(Black.BLACK);
ThemeManager.register(DarkGray.DARKGRAY);
ThemeManager.register(Olive.OLIVE);
ThemeManager.register(Purple.PURPLE);
ThemeManager.register(Slickness.SLICKNESS);


Enjoy!

Cypher

PS:
The attached ZIP files need to be renamed to JAR and then included in your ExtGWT project.

seb2nim
21 Oct 2009, 4:24 AM
Hi,
For those wondering if these themes are working with GXT2.0 :

Answer is : Yes, quite out-of-the-box after a trick.

... but some new widgets arent styled.


1)
A theme provides a "filename" so that ThemeManager can automatically bind theme'css in host page when loading theme...

Threre is a little issue as theme filename is just "olive.css" so css cannot be found directly by browser (in fact theme's css is located inside the theme module 'public'/'css' folder, so generated to module's baseurl/css/.

Of course you can hardcode theme's stylesheet path inclusion in host page but loading theme from ThemeManager will produce a 404 error.

To ensure theme is loaded correctly, i suggest you to do this for registering theme :

Theme theme = Theme.OLIVE;
String filename = theme.getFile();
theme.set("file", GWT.getModuleBaseURL()+"css/"+filename);
ThemeManager.register(theme);


2)
Some widgets arent styled yet by these themes : depends.... GroupButtons, Tooltip, Info display...

cbonami
13 Nov 2009, 3:04 PM
You need to do 2 additional things. For example, in order to include the 'slickness' theme:

1) Copy the content of the 'public' folder of you theme-jar to ${war-root}/resources/themes/slickness

2) Add the corresponding css to your main html:

<link rel="stylesheet" type="text/css" href="resources/themes/slickness/css/xtheme-slickness.css" />

Then changing theme works.

cbonami
13 Nov 2009, 3:19 PM
Ignore my previous message. Won't work.

valery.stroeder
2 Feb 2010, 6:48 AM
GWT 2.0
GXT 2.0.1
IntelliJ Idea 9.0

I never successfull add a theme.


I add gxt-theme-olive-1.0.jar into my lib directory
I add this line to myModule.gwt.xml :
<inherits name='ext.ux.theme.olive.Olive'/>
I add these imports to my entryPoint :

import com.extjs.gxt.ui.client.GXT;
import ext.ux.theme.olive.client.Olive;
I add the followind code to myEntryPoint :

public void onModuleLoad() {
ThemeManager.register(Olive.OLIVE);
GXT.setDefaultTheme(Olive.OLIVE, true);
...

Anything else ? I also tried to manually add the css file and images directory (getted from the jar) into my resources folder and then manually import the css in the HTML file, then some colors changes but the server never find images...

I suppose I don't need to copy myself the files (images and css) ?

seb2nim
2 Feb 2010, 8:35 AM
As i said previously :
1) Supposing your module's host page "index.html"
2) gxt base theme in a "gxt" folder at the same place,
3) Adding your module named "myModule" :

portion of index.html :


<head/>
...
<link rel="stylesheet" type="text/css" href="gxt/css/gxt-all.css" />
....
</head>
<body>
...
<script language="javascript" type="text/javascript" src="myModule/myModule.nocache.js"></script>
...
</body>=> Injecting dependency for Olive theme module will inject module's resources (stylesheet and resources inside you'r" module base'url :

your stylesheet and images for olive will go in :
root/myModule/css/olive.css.

GXT's theme manager does not handle this correctly:
you have to change theme's filename before registering on manager (see previous post to find why)


Theme theme = Theme.OLIVE;
String filename = theme.getFile();
theme.set("file", GWT.getModuleBaseURL()+"css/"+filename);
ThemeManager.register(theme);
GXT.setDefaultTheme(Olive.OLIVE, true);

valery.stroeder
2 Feb 2010, 11:37 PM
Thanks for your help, for myself I just


add jars in the lib directory (TAKE THE ZIP FILES INCLUDED AT THE BOTTOM OF THE FIRST POST BECAUSE THESE REFERENCED AT THE TOP OF THIS POST DOESN'T WORK and the inherited/imported classes aren't found with these ones)
import theme class in the entry point
inherit themes in gwt.xml
put this code in the entryPoint :

Theme themes[] = {Black.BLACK, DarkGray.DARKGRAY, Olive.OLIVE, Purple.PURPLE, Slickness.SLICKNESS};
for (Theme theme : themes) {
theme.set("file", GWT.getModuleBaseURL() + "css/" + theme.getFile());
ThemeManager.register(theme);
}

I didn't place any image/css folder anywhere and it works fine.

seb2nim
2 Feb 2010, 11:49 PM
Thats it.
Yes, you dont have do place images/css anywhere. Actually, each theme module's contains there resources files (in public folder) and they are automatically injected.

karacutey
22 Feb 2010, 1:36 PM
Works Great!

dev1
14 Jul 2010, 3:56 PM
IT WORKS GREAT =D>

PeterStrong
12 Sep 2011, 1:17 PM
I have followed the various instructions in the threads that relate to the use of the slickness theme and am still not getting the black rendered buttons anywhere i.e. in message boxes, button groups, menu bars etc.

I have used the approach of:
- dropping the gxt-theme-slickness-1.0.jar into my project
- updating my gwt.xml to inherit the module
- alterring the file name of the theme before adding it to my theme manager:
Theme slickness = Slickness.SLICKNESS;
String filename = slickness.getFile();
slickness.set("file", GWT.getModuleBaseURL()+"css/"+filename);
ThemeManager.register(slickness);
GXT.setDefaultTheme(Slickness.SLICKNESS, true);

When I render the standard hello world example, I see:

28023

When I should be seeing buttons like:

28024

Does anyone have any idea what might be going on?

I am using GXT 2.2.4.

Thanks,

Peter

sven
12 Sep 2011, 11:14 PM
I am using GXT 2.2.4.

You are in the GXT 1 forums here, so i guess your theme is for GXT 1 only. GXT 2 contained braking css changes which made old themes not fully compatible.

PeterStrong
13 Sep 2011, 4:54 AM
Sven,

This was the only spot where I saw mention of the slickness theme - or any dark theme.

Are you aware of any darker themes that are compatible with GXT 2.2?

And thanks for a response on this ancient thread!

Cheers!

Peter

sven
13 Sep 2011, 5:00 AM
Are you aware of any darker themes that are compatible with GXT 2.2?



Does the gray theme maybe work for you? Else you can also try the slate or access theme shipped with the GXT 2 download

rcbeuker
8 Feb 2015, 5:18 AM
What do i need to do with ExtJS themes to use them in GXT (how did you create this wrappers)