Summary of problem context: I have groups of buttons that display in the
same place on the page; which group is displayed depends on what actions
are available to the user.
What I did is make an "ontop" CSS style containing z-index: 9999. In my
code, to make a group of buttons visible and responsive, I pass its
DivElement to this method:
DivElement[] layers = {aLayer, bLayer, cLayer, dLayer, eLayer};
> protected void showLayer(DivElement div) {
> for (DivElement layer : layers) {
> if (layer != div) {
> layer.removeClassName(style.ontop());
> layer.addClassName(style.hidden());
> }
> }
> if (div != null) {
> div.addClassName(style.ontop());
> div.removeClassName(style.hidden());
> }
> }
>
This appears to work OK.
I wasn't using display:none because I have been depending on layout flow
for my layout, and display:none takes the attributed element out of the
flow. However, I hadn't considered using it on containers (divs) rather
than elements (buttons), and that might be somewhat simpler than the
technique described above.
On Sunday, April 28, 2013 3:12:23 AM UTC-7, Thomas Broyer wrote:
>
> Use display:none rather than visibility:hidden then.
>
> On Sunday, April 28, 2013 12:00:44 PM UTC+2, brec wrote:
>>
>> Its parent *widget* is the HTMLPanel at the top of the ui.xml/UIBinder
>> hierarchy; its parent *element*, in the DOM sense, is a div.
>>
>> I have just discovered that the problem relates to the fact that I have
>> buttons in the same position, of which only certain ones are supposed to be
>> visible at a given time. In other words, the user would see at the same
>> position on the page one of:
>>
>>> ButtonA ButtonB ButtonC
>>>
>> or
>>
>>> ButtonD ButtonE ButtonF
>>>
>> or
>>
>>> BigButtonG (as wide either of the preceding groups)
>>>
>>
>> The problem is that regardless of visibility, whichever of the three
>> above displays is declared last has (in effect) a higher z-index and is the
>> only one that will be mouse-responsive. So I am just about to implement a
>> solution of explicitly setting div z-indexes in the code which shows/hides
>> button groups.
>>
>> On Sunday, April 28, 2013 2:23:49 AM UTC-7, Thomas Broyer wrote:
>>>
>>>
>>> On Sunday, April 28, 2013 4:35:32 AM UTC+2, brec wrote:
>>>>
>>>> In the ui.xml:
>>>>
>>>> <g:Button ui:field='continu' addStyleNames='{style.continue-button}
>>>>> {style.hidden}'>
>>>>>
>>>> <ui:text from='{strings.continu}' />
>>>>>
>>>> </g:Button>
>>>>>
>>>>
>>>> In java when it's time to show the button:
>>>>
>>>> @UiField Button continu;
>>>>>
>>>>> ...
>>>>>
>>>>> showWidget(continu);
>>>>>
>>>>> ...
>>>>>
>>>>> protected void showWidget(Widget w) {
>>>>> showElement(w.getElement());
>>>>> }
>>>>>
>>>>> protected void showElement(Element e) {
>>>>> e.removeClassName(style.hidden());
>>>>> }
>>>>>
>>>>
>>>> The button is now visible to the eye, but not to the mouse: clicking
>>>> on it does not only not invoke its handler, it doesn't exhibit the small
>>>> visual effect of activation.
>>>>
>>>
>>> How is the button attached to its parent widget?
>>>
>>
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
