Menu Bar Behavior

Develop and Deploy Cross-Browser Web Apps .
Post Reply
joedarock
Posts: 167
Joined: Thu Nov 19, 2015 8:39 pm

Menu Bar Behavior

Post by joedarock »

The menu bar default behavior seems to be to drop down on a mouse hover. I don't want it to behave this way. I want it to drop down on a click or rt-click. Is this doable?

Joe

support
Posts: 356
Joined: Sat Apr 27, 2013 9:22 am

Re: Menu Bar Behavior

Post by support »

There's an autoShowTime property, you can set it to zero.
javascript code
xxMenu
.setAutoShowTime(0)

joedarock
Posts: 167
Joined: Thu Nov 19, 2015 8:39 pm

Re: Menu Bar Behavior

Post by joedarock »

Thanks.
Once I do this, how do I make the menu drop down on a mouse click?

support
Posts: 356
Joined: Sat Apr 27, 2013 9:22 am

Re: Menu Bar Behavior

Post by support »

When set autoShowTime to zero, menu will not pop up automatically, that means you can click it to pop.
Try it.
   
xui.Class('App', 'xui.Module',{
    Instance:{
        iniComponents : function(){
            // [[Code created by CrossUI RAD Studio
            var host=this, children=[], append=function(child){children.push(child.get(0));};
            
            append(
                xui.create("xui.UI.MenuBar")
                .setHost(host,"xui_ui_menubar2")
                .setItems([
                    {
                        "id":"menu1",
                        "sub":[
                            {
                                "id":"normal",
                                "caption":"normal"
                            }  
                        ]
                    },
                    {
                        "id":"menu2",
                        "sub":[
                            {
                                "id":"sub menu 2",
                                "caption":"sub menu 2",
                                "add":"[Ctrl+T]",
                                "sub":[
                                    "sub 3",
                                    "sub 4"
                                ]
                            }
                        ] 
                    }
                ])
                .setAutoShowTime(0)
            );
            
            return children;
            // ]]Code created by CrossUI RAD Studio
        }
    }
});
xui.Class('App', 'xui.Module',{
    Instance:{
        iniComponents : function(){
            // [[Code created by CrossUI RAD Studio
            var host=this, children=[], append=function(child){children.push(child.get(0));};
            
            append(
                xui.create("xui.UI.MenuBar")
                .setHost(host,"xui_ui_menubar2")
                .setItems([
                    {
                        "id":"menu1",
                        "sub":[
                            {
                                "id":"normal",
                                "caption":"normal"
                            }  
                        ]
                    },
                    {
                        "id":"menu2",
                        "sub":[
                            {
                                "id":"sub menu 2",
                                "caption":"sub menu 2",
                                "add":"[Ctrl+T]",
                                "sub":[
                                    "sub 3",
                                    "sub 4"
                                ]
                            }
                        ] 
                    }
                ])
                .setAutoShowTime(0)
            );
            
            return children;
            // ]]Code created by CrossUI RAD Studio
        }
    }
});
   

joedarock
Posts: 167
Joined: Thu Nov 19, 2015 8:39 pm

Re: Menu Bar Behavior

Post by joedarock »

Is there a specific method that has to be invoked to cause a menu to pop?

support
Posts: 356
Joined: Sat Apr 27, 2013 9:22 am

Re: Menu Bar Behavior

Post by support »

Then you have to use the hidden functin _pop:
   
xui.Class('App', 'xui.Module',{
    Instance:{
        iniComponents : function(){
            // [[Code created by CrossUI RAD Studio
            var host=this, children=[], append=function(child){children.push(child.get(0));};
            
            append(
                xui.create("xui.UI.MenuBar")
                .setHost(host,"xui_ui_menubar2")
                .setItems([
                    {
                        "id":"menu1",
                        "sub":[
                            {
                                "id":"normal",
                                "caption":"normal"
                            }
                        ],
                        "caption":"menu1"
                    },
                    {
                        "id":"menu2",
                        "sub":[
                            {
                                "id":"sub menu 2",
                                "caption":"sub menu 2",
                                "add":"[Ctrl+T]",
                                "sub":[
                                    "sub 3",
                                    "sub 4"
                                ]
                            }
                        ],
                        "caption":"menu2"
                    }
                ])
                .setAutoShowTime(0)
            );
            
            append(
                xui.create("xui.UI.HTMLButton")
                .setHost(host,"xui_ui_htmlbutton1")
                .setLeft("15em")
                .setTop("20.833333333333332em")
                .setCaption("Click me to pop menu1")
                .onClick("_xui_ui_htmlbutton1_onclick")
            );
            
            return children;
            // ]]Code created by CrossUI RAD Studio
        },
        _xui_ui_htmlbutton1_onclick:function(profile, e, src){
            var ns = this, menu = ns.xui_ui_menubar2;
            var popItem = menu.getItemByItemId("menu1"),
                popSrc = menu.getSubNodeByItemId("ITEM", "menu1");

           // _pop is a hidden function for MenuBar
            menu._pop(popItem, popSrc);
        }
    }
});
xui.Class('App', 'xui.Module',{
    Instance:{
        iniComponents : function(){
            // [[Code created by CrossUI RAD Studio
            var host=this, children=[], append=function(child){children.push(child.get(0));};
            
            append(
                xui.create("xui.UI.MenuBar")
                .setHost(host,"xui_ui_menubar2")
                .setItems([
                    {
                        "id":"menu1",
                        "sub":[
                            {
                                "id":"normal",
                                "caption":"normal"
                            }
                        ],
                        "caption":"menu1"
                    },
                    {
                        "id":"menu2",
                        "sub":[
                            {
                                "id":"sub menu 2",
                                "caption":"sub menu 2",
                                "add":"[Ctrl+T]",
                                "sub":[
                                    "sub 3",
                                    "sub 4"
                                ]
                            }
                        ],
                        "caption":"menu2"
                    }
                ])
                .setAutoShowTime(0)
            );
            
            append(
                xui.create("xui.UI.HTMLButton")
                .setHost(host,"xui_ui_htmlbutton1")
                .setLeft("15em")
                .setTop("20.833333333333332em")
                .setCaption("Click me to pop menu1")
                .onClick("_xui_ui_htmlbutton1_onclick")
            );
            
            return children;
            // ]]Code created by CrossUI RAD Studio
        },
        _xui_ui_htmlbutton1_onclick:function(profile, e, src){
            var ns = this, menu = ns.xui_ui_menubar2;
            var popItem = menu.getItemByItemId("menu1"),
                popSrc = menu.getSubNodeByItemId("ITEM", "menu1");

           // _pop is a hidden function for MenuBar
            menu._pop(popItem, popSrc);
        }
    }
});
   

joedarock
Posts: 167
Joined: Thu Nov 19, 2015 8:39 pm

Re: Menu Bar Behavior

Post by joedarock »

Thanks!

Post Reply