(Beta2) Setting the appearance of 1 ToggleButton

[lefke123]

I'd like to have a custom appearance on one of my ToggleButtons, but the problem is that the ToggleButtonCell does not have a constructor that accepts a ButtonCellAppearance.

It is the ToggleButtonCell that has access to the ButtonCell constructor that takes in a ButtonCellAppearance:

public ToggleButton(ToggleButtonCell cell) {
    super(cell, false);
    this.cell = cell;
}

public ButtonCell(ButtonCellAppearance<C> appearance) {
    super("click", "keydown", "mousedown", "mouseup", "mouseover", "mouseout");
    this.appearance = appearance;
}

// No matching constructor for ButtonCell in ToggleButtonCell.

Since the appearance field is final, I can't do much with that either. Plus, the only type of cell ToggleButton accepts is a ToggleButtonCell. So creating my own button that extends from ToggleButtonCell does not work.
(Can't extend from 2 classes, ToggleButtonCell and also ButtonCell to be able to call its constructor.)

Is there a workaround? Should this be put in a feature request? Thanks in advance.

EDIT:
At this point, I'm using a workaround that extends ButtonCell, and uses (copy paste) ToggleButton's code (bypasses the 1 extension limit). Also, I added a different constructor that accepts an appearance.

[icfantv]

I had to do something very similar to create a hybrid between ClickableTextCell (gwt) and ButtonCell (gxt) because I needed to change not only change the way the cell was rendered but also adding the event handlers.

I wound up extending ResizeCell<C> and copying code from ButtonCell. The tricky thing I found was that in the underlying appearance classes, it doesn't appear that any actual button class (TextButton, ButtonBase, etc...) is used. It's all done through styles that make it look and function like a button. If you've not already, take a gander at ButtonCellBaseAppearance<C> and it's current subclass BlueButtonCellBaseAppearance<C>. It points to the CSS file that defines the L&F of the blue theme button cell.

The CSS is not part of the source distribution however, if you un-jar the gxt-3.0.0-beta2.jar, everything is in there. I haven't figured out how the CSS classes map back to the appearance and style functions or how they're using CSS sprites.

[Colin Alworth]

lefke123, ToggleButtonCell in SVN has two constructors:

  /**
   * Creates a toggle button cell with default appearance.
   */
  public ToggleButtonCell() {
    this(GWT.<ButtonCellAppearance<Boolean>> create(ButtonCellAppearance.class));
  }

  /**
   * Creates a toggle button cell with the specified appearance.
   * 
   * @param appearance the appearance of the toggle button cell.
   */
  public ToggleButtonCell(ButtonCellAppearance<Boolean> appearance) {
    super(appearance);
  }

This will go out shortly as a new beta - give that a try, and let us know where else we need these missing appearance-capable constructors.

Thanks for pointing this out.


icfantv:
The CSS and even templates are usually part of the appearance implementation itself, so replacing that automatically replaces the css. We're using ClientBundle to compile in only the images and styles we use, which when combined with proper caching, should mean that your users always have the most up to date styles (no need to force refreshes), and always have all resources available after the first download. Take a look at the blog post on the appearance pattern, and feel free to ask any questions if we didnt make anything clear. Note that the <replace-with> statements need to include the full package name as well, as can be found in Blue.gwt.xml.

http://www.sencha.com/blog/ext-gwt-3-appearance-design

[icfantv]

My issue was that ClickableTextCell only accepts a String as the argument to the render(...) method so when I needed a reference to my actual model object, this wouldn't work, which stunk because I was 95% of the way there but couldn't get any further.

Additionally, I needed to render the cell so that it was obvious to the user that it was clickable and I did this by making the text look like a hyperlink and changing the cursor as described below.

Finally, I needed the click and mouseover/out event handlers so I could change the cursor to a pointer and handle mouse clicks on the cell.

[lefke123]

Thanks for the addition, and I'm sure to let you know if I notice any missing constructors.
Any idea when the new beta will be released?

[Colin Alworth]

Yesterday, shortly after I posted: http://www.sencha.com/forum/showthre...-Now-Available

http://www.sencha.com/products/extgwt/download

or in maven, com.sencha.gxt:gxt:3.0.0-beta3 from central.