You seem to get my point. Its a classic catch-22 situation. I can't get access to the graphics designer until I can prove what GWT can do for us. Others, using a different technology i.e. Flex?, are going to be able to create a decent looking UI themselves without the need of a graphics specialist.
GWT seems quite poor at doing rapid prototyping unless you happen to have both Java and graphics designers in your development team. I have spent more time getting the prototype to look decent than developing the functionality :( -Dave On Fri, Dec 12, 2008 at 7:13 AM, Arthur Kalmenson <[email protected]> wrote: > > Hi David, > > I do agree with you that for the initial prototyping and maybe initial > production releases it would be nice to have some polished CSS. > However, I think that in general it's a much better use of resources > to get a graphics designer to come up with the L & F and layout of > your application. You might also find the following GWT blog posting > on L & F an interesting read: > http://googlewebtoolkit.blogspot.com/2008/12/gwt-no-need-to-shortchange-your-style.html > > -- > Arthur Kalmenson > > > > On Tue, Dec 9, 2008 at 9:40 AM, David Hoffer <[email protected]> wrote: >> Hi Arther, >> >> Your comments are well taken. Since I have heard this before we have >> used pure GWT. >> >> However, at this point however, I do think GWT missed it a bit here >> because most Java programmers do not know CSS, at least not well, and >> you cannot use GWT without knowing CSS. This fact, I think drives >> some to these other frameworks. >> >> I think an ideal situation would be for GWT (or someone) to create a >> mechanism to get a standard L&F with GWT without knowing CSS; sort of >> like what you can do with Swing. Although just like Swing you should >> be able to customized this L&F via some mechanism and in the case of >> GWT CSS is fine. It seems GWT did start to go in this direction with >> the GWT themes but they aren't extensive enough. >> >> -Dave >> >> On Tue, Dec 9, 2008 at 7:31 AM, Arthur Kalmenson <[email protected]> >> wrote: >>> >>> Hello David and tomato, >>> >>> I highly recommend you stay as far away from Ext-GWT, SmartGWT and >>> GWT-ext as you can. Gregor said it best, while they might look shiny, >>> they are as slow as molasses and a huge PITA to work with. Once you >>> start using them, you fall into their overly complex and inconsistent >>> event models, you completely forgo most of GWT since these libraries >>> can't work with GWT widgets, and give up the simplicity and high >>> quality you come to expect from GWT. I say this from experience. >>> >>> -- >>> Arthur Kalmenson >>> >>> >>> >>> On Mon, Dec 8, 2008 at 9:38 AM, Miles T. <[email protected]> wrote: >>>> >>>> Hi David and tomato, >>>> >>>> We also didn't (and still don't) want to write HTML or CSS for our >>>> application (it aims to be an internal application, not a public >>>> website). Consider using Ext GWT, SmartGWT or GWT-Ext, I guess this is >>>> what you're looking for. These libraries provide a set of widgets and >>>> look and feels and let you define your own. They also allow you to >>>> devlop in a Swing-style by using standard layouts (BorderLayout, >>>> CenterLayout,...). >>>> >>>> We choose Ext GWT because it is a full GWT library (others are >>>> wrapping a JS library), it provides a simple MVC layer and has more >>>> documentation. >>>> >>>> Regards >>>> >>>> On 8 déc, 14:34, "David Hoffer" <[email protected]> wrote: >>>>> Hi Gregor, >>>>> >>>>> Thanks for the detailed response I will give this a try today. >>>>> >>>>> As I read this I thought of a couple questions. >>>>> >>>>> 1. Does my CSS file have to have a particular name? You say it goes >>>>> next to the HTML file. Do I just name it the same but with css >>>>> extension and it will be found or do I have to reference it somehow in >>>>> my HTML/XML? >>>>> >>>>> 2. You mentioned to look at the showcase examples to get CSS to use. >>>>> I looked at all these yesterday and found that most do not show the >>>>> CSS used (I think most of the widgets did but most containers did >>>>> not). I then looked at the source code for showcase given in the GWT >>>>> examples and it seems they are using annotations to bring in styling >>>>> information. What's up with this? It seems there is more than one >>>>> way to apply CSS in GWT. This makes it harder to learn how one is to >>>>> do this. >>>>> >>>>> As an example of what currently looks really bad...DialogBox and >>>>> VerticalSplitPanel. The former has no border so it doesn't even look >>>>> remotely like a DialogBox and VerticalSplitPanel only has a splitter >>>>> bar...no border. So unless you really know there is a split panel you >>>>> have no idea what you are looking at. For these examples the showcase >>>>> shows no CSS so apparently it is using annotations to bring in >>>>> styling. BTW, for these cases I am using the standard theme. >>>>> >>>>> Thanks much, I will look at your example. >>>>> -Dave >>>>> >>>>> On Sun, Dec 7, 2008 at 7:57 PM, gregor <[email protected]> >>>>> wrote: >>>>> >>>>> > Hi Dave, >>>>> >>>>> > 1) I think this might have something to do with debugging client >>>>> > javascript at run time using Firebug or something - I've never used it >>>>> > to be honest. >>>>> >>>>> > 2) I happen to have a simple CSS example to hand, so this might help - >>>>> > apologies if its too simplistic.... >>>>> >>>>> > Your module will have its own CSS file next to its HTML file in the >>>>> > public folder. >>>>> >>>>> > If you check the standard theme GWT CSS for DisclosurePanel it looks >>>>> > like this: >>>>> >>>>> > .gwt-DisclosurePanel { >>>>> > } >>>>> > .gwt-DisclosurePanel-open { >>>>> > } >>>>> > .gwt-DisclosurePanel-closed { >>>>> > } >>>>> > .gwt-DisclosurePanel .header, >>>>> > .gwt-DisclosurePanel .header a, >>>>> > .gwt-DisclosurePanel .header td { >>>>> > text-decoration: none; /* Remove underline from header */ >>>>> > color: black; >>>>> > cursor: pointer; >>>>> > cursor: hand; >>>>> > } >>>>> > .gwt-DisclosurePanel .content { >>>>> > border-left: 3px solid #e8eef7; >>>>> > padding: 4px 0px 4px 8px; >>>>> > margin-left: 6px; >>>>> > } >>>>> >>>>> > Notice that it starts with gwt-DisclosurePanel - this is the primary >>>>> > style name given to this widget. In the DisclosurePanel source >>>>> > somewhere you will find setStylePrimaryStyleName("gwt- >>>>> > DisclosurePanel"). Elsewhere in the code you will find they assign the >>>>> > various sub-styles to individual components of DisplosurePanel using >>>>> > add/removeStyleName(styleName) or add/removeStyleDependentName >>>>> > (styleSuffix) corresponding to e.g.gwt-DisclosurePanel-open and e.g. >>>>> > gwt-DisclosurePanel .header respectively (or is it the other way >>>>> > round, it's late). So the java code switches between the -open and - >>>>> > closed styles in response to user clicks etc, but the primary style is >>>>> > always the same. >>>>> >>>>> > (This is how to go about using CSS when you design your own composite >>>>> > widgets - follow what they do) >>>>> >>>>> > Now you have two choices how to proceed to start with. >>>>> >>>>> > 1) don't use a standard theme, but keep a copy of one of them (i.e. >>>>> > the CSS files) handy so you can cut and paste the CSS format for each >>>>> > widget into your own module CSS file where you can edit it how you >>>>> > like - you just need to do each one as you need it. >>>>> > 2) Put <inherits name='com.google.gwt.user.theme.standard.Standard'/> >>>>> > (or chrome/dark) in your module gwt.xml file which will activate the >>>>> > theme. Now however you are stuck with what they give you - well, no, >>>>> > you are not...... >>>>> >>>>> > Notice that the .gwt-DisclosurePanel .content style has got borders >>>>> > and padding etc. Now I was happy with most of the standard theme for >>>>> > what I was doing, but I did not want the contents of the disclosure >>>>> > panel to be so indented - I wanted it flush with the outer border of >>>>> > the panel. So I stuck this in my own module CSS file: >>>>> >>>>> > .my-DisclosurePanel { >>>>> > } >>>>> > .my-DisclosurePanel-open { >>>>> >>>>> > width: 100%; >>>>> > height: 100% >>>>> > } >>>>> > .my-DisclosurePanel-closed { >>>>> >>>>> > } >>>>> > .my-DisclosurePanel .header, >>>>> > .my-DisclosurePanel .header a, >>>>> > .my-DisclosurePanel .header td { >>>>> > text-decoration: none; /* Remove underline from header */ >>>>> > color: black; >>>>> > cursor: pointer; >>>>> > cursor: hand; >>>>> > } >>>>> > .my-DisclosurePanel .content { >>>>> > width: 100%; >>>>> > height: 100% >>>>> > /*border-left: 3px solid #e8eef7; >>>>> > padding: 4px 0px 4px 8px; >>>>> > margin-left: 6px;*/ >>>>> >>>>> > } >>>>> >>>>> > Then in my Java class code: >>>>> >>>>> > private DisclosurePanel myDiscPanel = new DisclosurePanel(); >>>>> > ... >>>>> > myDiscPanel .setStylePrimaryName("my-DisclosurePanel"); >>>>> >>>>> > et viola the annoying indents have gone for this particular >>>>> > DisclosurePanel, but I still have the main GWT theme running for all >>>>> > other widgets (including any other DisclosurePanels I don't choose to >>>>> > doctor like this) which is useful otherwise everything really does >>>>> > look awful to start with. Notice how just changing the primary style >>>>> > name achieves this (which is why you should design your own widgets >>>>> > like this: it enables wholesale alterations to L&F with minimal effort >>>>> > and it is truly amazing what you can do CSS styling when you get the >>>>> > hang of it. It makes Swing look stupid in some respects). >>>>> >>>>> > It may drive you mad for a bit but I assure you there is method in >>>>> > this madness. A good tip when you get a bit lost is to fire up the >>>>> > showcase demo, choose an example widget that vaguely resembles what >>>>> > you need to do and look up it's source code and CSS. >>>>> >>>>> > regards >>>>> > gregor >>>>> >>>>> > On Dec 7, 11:05 pm, "David Hoffer" <[email protected]> wrote: >>>>> >> Thanks for stating the obvious, I hadn't seen that web site yet. >>>>> >> Okay, I have a couple of CSS newbie questions. >>>>> >>>>> >> 1. What are calls like >>>>> >> disabledButton.ensureDebugId("cwBasicButton-disabled") for? This >>>>> >> isn't a Java like thing. >>>>> >> 2. Where do I paste the CSS Style code? >>>>> >>>>> >> Thanks! >>>>> >> -Dave >>>>> >>>>> >> On Sun, Dec 7, 2008 at 10:45 AM, tomato <[email protected]> wrote: >>>>> >>>>> >> > Hi David, >>>>> >>>>> >> > I'm new too, I don't know much about GWT. I'll risk stating the >>>>> >> > obvious here, but I think the Google sample CSS templates can maybe >>>>> >> > get you started? They are pretty standard google looks. :) >>>>> >> >http://gwt.google.com/samples/Showcase/Showcase.html >>>>> >>>>> >> > Cheers, >>>>> >> > tomato >>>>> >>>>> >> > On Dec 7, 7:17 am, "Ian Bambury" <[email protected]> wrote: >>>>> >> >> You are not really going to get what you want with any web language >>>>> >> >> although >>>>> >> >> some of the frameworks will let you look like all the other sites >>>>> >> >> that use >>>>> >> >> that framework, and the 'instant web site' and 'web site in a box' >>>>> >> >> applications will let you choose from a number of themes. >>>>> >>>>> >> >> Desktop apps have a look and feel because they are extending the OS >>>>> >> >> and for >>>>> >> >> a long time you had no choice as to what they looked like, you >>>>> >> >> could only >>>>> >> >> move stuff around the window - even the widgets were/are standard >>>>> >> >> like the >>>>> >> >> file-picker in VB et al. There's more freedom in the web, but the >>>>> >> >> price is >>>>> >> >> that you have to do a bit of work. >>>>> >>>>> >> >> GWT *does* let you 'just use Java'. You are picking a very specific >>>>> >> >> use of >>>>> >> >> Java and saying you can't use it like that. Like complaining that >>>>> >> >> you can't >>>>> >> >> use a pencil for sketching because it doesn't draw circles properly >>>>> >> >> like it >>>>> >> >> does when it's in a compass :-) >>>>> >>>>> >> >> GWT aims to let you write Java and get JavaScript - it does that. >>>>> >> >> It doesn't >>>>> >> >> claim to have you write Java and get CSS or images. >>>>> >>>>> >> >> Ian >>>>> >>>>> >> >>http://examples.roughian.com >>>>> >>>>> >> >> 2008/12/7 David Hoffer <[email protected]> >>>>> >>>>> >> >> > Hi Gregor, >>>>> >>>>> >> >> > Thanks for the reply. I don't disagree with what you say, I'm >>>>> >> >> > sure I >>>>> >> >> > do need to learn CSS and specifically how GWT makes use of it. >>>>> >>>>> >> >> > However I do want to point out that I think Google missed it a >>>>> >> >> > little >>>>> >> >> > in this area. The fundamental selling point of GWT for us at >>>>> >> >> > least is >>>>> >> >> > that we can stay with our well known programing language/technique >>>>> >> >> > (Java) and write a high quality web app as well. Actually in our >>>>> >> >> > case >>>>> >> >> > we are taking it one step further our app is implemented in both >>>>> >> >> > Swing >>>>> >> >> > and GWT. The Swing & GWT UI layers are as thin as possible, all >>>>> >> >> > the >>>>> >> >> > business logic is shared between both implementations. You can >>>>> >> >> > think >>>>> >> >> > of our app as a pure MVC app where the M & C are shared and only >>>>> >> >> > the >>>>> >> >> > view is separate code. >>>>> >>>>> >> >> > However since GWT did not let us set the L&L in Java code its not >>>>> >> >> > really true that you can just use Java. Perhaps there are >>>>> >> >> > reasons for >>>>> >> >> > this I will understand when I learn CSS but I would have preferred >>>>> >> >> > that GWT provide some satisfactory L&L right out of the box and >>>>> >> >> > also >>>>> >> >> > allow developers to write specialized CSS. >>>>> >>>>> >> >> > You are right that web apps don't typically behave like platform >>>>> >> >> > apps >>>>> >> >> > (Windows, Mac), I was only using those as examples. The simple >>>>> >> >> > GWT >>>>> >> >> > style could be something else. >>>>> >>>>> >> >> > I will check out Ian's web site and see if I can get up to speed >>>>> >> >> > on CSS >>>>> >> >> > quickly. >>>>> >>>>> >> >> > -Dave >>>>> >>>>> >> >> > On Sun, Dec 7, 2008 at 6:32 AM, gregor >>>>> >> >> > <[email protected]> >>>>> >> >> > wrote: >>>>> >>>>> >> >> > > Hi Dave, >>>>> >>>>> >> >> > > I think you really need to get to grips with CSS, the HTML box >>>>> >> >> > > model >>>>> >> >> > > and learn to use GIMP/Photoshop to work effectively with GWT - >>>>> >> >> > > or hire >>>>> >> >> > > a graphic designer to get you off the ground. As Ian says, you >>>>> >> >> > > get the >>>>> >> >> > > L&F for free in Swing, SWT or .NET, but you don't in >>>>> >> >> > > javascript/HTML >>>>> >>>>> >> >> > > JS libraries with GWT wrappers like the Ext family and SmartGWT >>>>> >> >> > > offer >>>>> >> >> > > out of the box windows L&F and widget >>>>> >>>>> ... >>>>> >>>>> plus de détails » >>>> > >>>> >>> >>> > >>> >> >> > >> > > > > --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~----------~----~----~----~------~----~------~--~---
