Hi Anders, I looked into this a year or so ago. As I recall what you need to do is make a "nine box model" Composite. You have to plumb in all the style changes linked to mouse events for up/down/hover etc., implement SourcesClickEvents, and handle the text no wrap and sizing calculations etc. You also have to think about font sizes, and the fact that borders and padding work differently in IE and FF so it's not straight forward to get the buttons to look exactly the same in each browser. If you want to add icons as well (as I did) you have to think about image clipping as well otherwise button heights can be variable unless every image is exactly right. Basically it's a palaver, and as I understand it it is also very inefficient - you are not using the browsers native button support.
For this reason I gave up on the idea and used the traditional approach of creating up/down images for each button using GIMP. This turned out to be quicker to do in the end. You only need one image in GIMP/Photoshop for each size of button you want (I prefer equal width buttons in a group) that has the basic rounded corners style and gradients/borders for the up/down highlights in two or three layers. Then you simply add a new layer for the text (or text + icon) of each button you need and select the appropriate layers to make an up and down png/jpeg/gif for each one. This way you can edit the base style layers and produce a complete new button set in minutes. You pays your money and takes your choice on this one. I'm no graphic designer and although it took me a few agonizing days to get to grips with using GIMP properly (the layers are the key IMO) I still reckon it took less time than it would have done to do a good job of this programmatically. And now of course I know how to do it so I can make more or less any icon needed to order. regards gregor On Jan 2, 11:00 am, dduck <[email protected]> wrote: > Hi, > > I would like to make a button that looks like this: > > (|| text ||) > > ...where ( is a rounded left-end of the button, ) is a rounded right- > end of the button, || is a background and "text" can be specified e.g. > at creation. Thus, all buttons of this type would share the same > style, but not the same text on the face of it. Examples: > > (|| OK ||) > (|| My very long button text ||) > > How would I go about this, without having to generate each individual > button as an image in my drawing program? > > Anders --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
