gwt-material icon indicating copy to clipboard operation
gwt-material copied to clipboard

Multiple MaterialDropDown do not work when hover=false

Open mtmmtm9 opened this issue 7 years ago • 6 comments

Starting with the maven archetype i changed the ui-file. This example works only if changing the line with hej2 to hover=true.

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' xmlns:g='urn:import:com.google.gwt.user.client.ui' xmlns:me='urn:import:gwt.material.design.addins.client.menubar' xmlns:m="urn:import:gwt.material.design.client.ui"> <ui:with field="res" type="mp.client.resources.AppResources"/> <m:MaterialPanel>

<me:MaterialMenuBar m:id="sidenav" width="280">
    <m:MaterialLink text="Link 1" iconType="POLYMER"/>
    <m:MaterialLink text="Link 2" iconType="POLYMER" activates="hej">
        <m:MaterialDropDown activator="hej" hover="false" belowOrigin="true">
            <m:MaterialLink text="test123" iconType="POLYMER"/>
            <m:MaterialLink text="sune" iconType="PLAY_ARROW" iconPosition="RIGHT"  activates="hej2">
                <m:MaterialDropDown activator="hej2" hover="false" belowOrigin="true">
                    <m:MaterialLink text="testing link1" iconType="POLYMER"/>
                    <m:MaterialLink text="hejsan" iconType="PLAY_ARROW" iconPosition="RIGHT" >
                    </m:MaterialLink>
                    <m:MaterialLink text="testing link2" iconType="POLYMER"/>
                </m:MaterialDropDown>
            </m:MaterialLink>
            <m:MaterialLink text="test234" iconType="POLYMER"/>
        </m:MaterialDropDown>
    </m:MaterialLink>
    <m:MaterialLink text="Link 3" iconType="POLYMER"/>
</me:MaterialMenuBar>

</m:MaterialPanel> </ui:UiBinder>

mtmmtm9 avatar Jan 27 '18 10:01 mtmmtm9

I've tested with your example on my workspace and it works fine, hovering the hej2 activator shows the dropdown. I will add on the demo showcase about the example of toggling on / off for the hover.

Question: What version of GMD Addins / GMD you are using?

kevzlou7979 avatar Jan 28 '18 12:01 kevzlou7979

I used version 2.0.1-snapshot for all modules.

mtmmtm9 avatar Jan 28 '18 17:01 mtmmtm9

I can reproduce now the issue with 2.0

kevzlou7979 avatar Jan 31 '18 01:01 kevzlou7979

Checked deeply and the culprit is the stopProgration() https://github.com/GwtMaterialDesign/gwt-material/blob/master/gwt-material/src/main/java/gwt/material/design/client/ui/MaterialDropDown.java#L178

kevzlou7979 avatar Jan 31 '18 02:01 kevzlou7979

We need to wait for Materialize that will support Nested / Multiple MaterialDropdown for the moment. Right now what we have is a preconfigured options provided by MenuBar which doesn't fully support hoverable = false for it's nested dropdown menus but that's not a big deal. Most of the Menu dropdowns (i.e IntelijIdea) proposes a hoverable dropdown instead of click each of the dropdown item to open another dropdown which is a pain in User Experience.

Here is what I'm talking about on IntelijIdea Menu bar UX test

kevzlou7979 avatar Feb 02 '18 14:02 kevzlou7979

I agree that it is not nice to force the user to click on sub-menus. My original issue was actually that I could not get menus within menus to work at all. I put the gwt-material-menu inside a gwt PopupPanel (I do not know if that affect the problem i had). I will take a look at this again (hopefully the next week). Which version of gwt-material do you recommend ?

mtmmtm9 avatar Feb 02 '18 18:02 mtmmtm9