SectionStackSection center title with clickhandler

[levi]

Hello,

1) I've been experimenting a lot to get the title of a SectionStackSection aligned in center.

So setting align="center" here:

<td nowrap="true" class="imgSectionHeaderTitleopened" style="padding-top:0px;padding-bottom:0px;" align="left" valign="center">Section</td>

I tried

getSectionHeader().setAlign(Alignment.CENTER)

but no luck (and the SectionHeader is only available after component was drawn).

I tried setting no title and created a Label or a DynamicForm with an item to set the title as control, but alignment is not great either and I would still like to use the setTitle() functionality.

The best result was setting it via CSS in the HTML page/external CSS file:

.imgSectionHeaderTitleclosed,
.imgSectionHeaderTitleopened {
	text-align: center;
}

but this overrides all SectionStackSections of course (I still want some others to left-align).


Looking at SectionStack.js I guess I could add the align:"center" property in the ImgSectionHeader.backgroundDefaults but I'm not sure if the whole SmartClient AutoChild concept is already available in SmartGWT?

Subclassing SectionStackSection doesn't make me any wiser, there are no "setProperty" methods on it.




2) Another topic is that I want to set the section.setCanCollapse(false)
and the stack.addSectionHeaderClickHandler still to do something when clicking on the section (with changing mouse pointers).
I guess a workaround would be to setCanCollapse(true), making the style not change whenever the section is open or closed, and removing the "collapse icon" myself, but I also can't seem to do that from within Java: setControls(dummy) still shows the collapse icon for example.
I was even trying to get it working with the ClickHandler on the stack and checking if the event's coordinates are inside each section, but that sounds harsh to do.



Any hints on these?
cheers



SmartGWT LGPL 2010-08-17

[Isomorphic]

1) You can use setAttribute() on the sections to apply your custom CSS style. You can essentially think of that setAttribute() call as calling setters on the SectionHeader that will be created.

2) Seem like you can also solve this with the above information.

[levi]

Hi,

1) I'm trying but not succeeding. Even an attempt of section.setAttribute("src","doesntexist.png") still renders the sectionHeader with the skin images.

I got some change in behavior when doing section.setAttribute("backgroundDefaults","blabla"). Do I need to build up the backgroundDefaults javascriptobject myself in-code to change anything in it (as getAttributeAsJavaScriptObject("backgroundDefaults") is still null at that time) ?

I'm also somewhat confused: getting the backgroundDefaults JSObject only works when I first do a call to section.getSectionHeader(). When I log that object, I see an attribute "titleStyle: center". What does that mean?


2) Do you mean things like section.setAttribute("click", myOwnJavaScriptFunction) and creating an own javascript click function?



(oh and version was actually SmartGWT EE 2.3 official)

[Isomorphic]

1) Take a look at load_skin.js for examples of how these settings can be affected. Although in other skins (eg Enterprise) setting the "src" attribute is enough, in the skin you appear to be using, you do need to modify the backgroundDefaults because this is where the "src" setting exists. This is best done via the skinning system - create a trivial subclass of the built-in SectionHeader with isc.defineClass() and change the defaults with changeDefaults() (as you see in load_skin.js).

2) Not clear what you're trying to do if this information isn't enough - you can already setCanCollapse(false), add your own click handler to the SectionStack, and set a cursor via setAttribute() - so what else do you need?