Question

I'm using Smartclient, v 8.2 (LGPL).
I have a MenuButton that opens a Menu. The button is aligned right. the problem is that when the menu is displayed; the left side of the menu is aligned with the left side of the button, and there's no space for rendering the menu. As a result, when I click the menu button, the page becomes wider (horizontal scrollbar appears) in order to make space for rendering the menu. when the menu is hidden, the page returns to normal size.
is there any way to avoid this? What I would like is that the right side of the menu is aligned with the right side of the button.
I tried using the align property of the menu, but no matter what value I used, I always see the same behavior. Also I set overflow= "hidden", but still same problem.

this is small test case:

isc.Menu.create({
    ID: "menu",
    autoDraw: false,
    showShadow: true,
    shadowDepth: 10,
    overflow: "hidden",
    align: "right",
    data: [
     {title: "New", keyTitle: "Ctrl+N", icon: "icons/16/document_plain_new.png"},
     {title: "Open", keyTitle: "Ctrl+O", icon: "icons/16/folder_out.png"},
     {isSeparator: true},
     {title: "Save", keyTitle: "Ctrl+S", icon: "icons/16/disk_blue.png"},
     {title: "Save As", icon: "icons/16/save_as.png"}
    ]
});

isc.MenuButton.create({
    ID: "menuButton",
    autoDraw: false,
    title: "File",
    width: 100,
    menu: menu
});

isc.HLayout.create({
   width: "100%",
   members: [
   isc.Canvas.create({
   width: "*",
   height: 24,
   backgroundColor: "lightgray"
    }),
   menuButton
]
})
Was it helpful?

Solution

I found the problem: if showShadow is set to true, then I see the issue described in the question. removing that attribute (default is false) solved the problem: menu is aligned to the right, and no scrollbars appear.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top