Question

在菜单栏中，通常子菜单会显示在右侧。我想换到左手边。任何人都可以让我知道，我该怎么办？

Answer 1

子菜单的弹出位置由CSS元素根据菜单项的位置进行渲染定义。

通过Firebug在主菜单上查看它产生了：

element.style {
    clip: rect(auto, auto, auto, auto);
    left: 337px; // Change this to left:35px;
    overflow: visible;
    position: absolute;
    top: 319px;
    visibility: visible;
}

// This is main CSS for popup
.gwt-MenuBarPopup{
}

所以，请尝试使用代码中的setStyleName("css goes here")

Answer 2

我再次建议你覆盖默认样式GWT :)当我不得不改变一些GWT元素的标准视图时，我在我的项目中使用了这个方法。

Answer 3

我也可以通过更改css来实现解决方案。也许这不是最优雅的方式，但它有效。使用GwtQuery的最近（）方法的一些帮助，这是一个简短的例子。

        menuBar.addAttachHandler(new AttachEvent.Handler() {            
        @Override
        public void onAttachOrDetach(AttachEvent event) {
            if(event.isAttached()){
                Scheduler.get().scheduleDeferred(new ScheduledCommand() {                       
                    @Override
                    public void execute() {
                        Element e = $(menuBar).closest(".gwt-MenuBarPopup").get(0);
                        e.getStyle().setLeft(parentMenuBar.getAbsoluteLeft()-menuBar.getOffsetWidth() , Unit.PX);
                    }
                });                 
            }
        }
    });

因此，当附加子子菜单时，您想要更改css。我使用延迟命令，以便在GWT的默认MenuBar实现设置它之后更改css。这一行，＆＃34; $（menuBar）.closest（＆＃34; .gwt-MenuBarPopup＆＃34;）。get（0）;＆＃34;将搜索DOM树，直到找到具有类.gwt-MenuBarPopup的元素，这是您要更改的元素。

Answer 4

我的解决方案有点混合了迄今为止发布的那些，但我认为它比任何一个都更清晰/更简单。

每个垂直子菜单本身都是MenuBar，作为项目添加到顶层 MenuBar。对于要放在左侧而不是右侧的子菜单，请使用.addStyleName("myLeftDropDownStyleName")窗口小部件上的MenuBar为其添加样式类名称。
像这样定义该样式的选择器规则（这些是我左下角所需的最小属性）：

.myLeftDropDownStyleName{ position: absolute; right: 0px; }

Absolute相对于第一个父元素的位置，其位置不是静态的;至少对于我的情况，那个父位置似乎是水平位置，否则下拉没有这个解决方案的左边缘。如果Relative职位在其他人的案件中可能更有效，我不会感到惊讶。

0px的右偏移告诉绝对位置在我上面提到的那个水平位置的权利。当然，像素大小可以> 1。 0进一步向左推动那么多，甚至＆lt; 0将它拉回到右边那么多。

这对我来说很完美，很简单＆amp;干净，并且不强制你的所有你的MenuBars都有这种风格（如果你自己覆盖其中一个GWT MenuBar样式，我认为就是这种情况）。

更改GWT SubMenu弹出位置

4 个答案: