Using: v11.1d_2017-06-15
Skin: Enterprise
When I create a ToolStripMenuButton with an icon, often times (not always) it renders incorrectly at first. Once I hover the mouse over it, it corrects itself. To demonstrate, I've modified the code from this sample:
http://www.smartclient.com/smartclie...crease=0&dhc=1
I modified the code so that the File ToolStripMenuButton has an icon and I moved it away from the first position (because it didn't seem to happen as much in the first position).
In my tests, I initially see the drop-down arrow overlapping with the next control. If I hover over the button, it then fixes itself. The image below illustrates.
Note that it does not happen every time, although it was frequent enough for me to capture these screenshots. I've also tried wrapping a <span> tag around the image and title. That might help sometimes but not all the time.
Skin: Enterprise
When I create a ToolStripMenuButton with an icon, often times (not always) it renders incorrectly at first. Once I hover the mouse over it, it corrects itself. To demonstrate, I've modified the code from this sample:
http://www.smartclient.com/smartclie...crease=0&dhc=1
I modified the code so that the File ToolStripMenuButton has an icon and I moved it away from the first position (because it didn't seem to happen as much in the first position).
Code:
var menu = isc.Menu.create({ ID: "menu", autoDraw: false, showShadow: true, shadowDepth: 10, 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"}, {isSeparator: true}, {title: "Recent Documents", icon: "icons/16/folder_document.png", submenu: [ {title: "data.xml", checked: true}, {title: "Component Guide.doc"}, {title: "SmartClient.doc", checked: true} ]}, {isSeparator: true}, {title: "Export as...", icon: "icons/16/export1.png", submenu: [ {title: "XML"}, {title: "CSV"}, {title: "Plain text"} ]}, {isSeparator: true}, {title: "Print", enabled: false, keyTitle: "Ctrl+P", icon: "icons/16/printer3.png"} ] }); var but = isc.ToolStripMenuButton.create({ ID: "menuButton", [B]title: isc.Canvas.imgHTML("icons/16/icon_add_files.png") + " File", [/B] menu: menu }); isc.ToolStripButton.create({ ID: "printButton", icon: "[SKIN]/RichTextEditor/print.png", title: "Print" }); isc.ToolStripButton.create({ ID: "alignLeft", icon: "[SKIN]/RichTextEditor/text_align_left.png", actionType: "radio", radioGroup: "textAlign" }); isc.ToolStripButton.create({ ID: "alignRight", icon: "[SKIN]/RichTextEditor/text_align_right.png", actionType: "radio", radioGroup: "textAlign" }); isc.ToolStripButton.create({ ID: "alignCenter", icon: "[SKIN]/RichTextEditor/text_align_center.png", actionType: "radio", radioGroup: "textAlign" }); isc.ToolStripButton.create({ ID: "bold", icon: "[SKIN]/RichTextEditor/text_bold.png", actionType: "checkbox", showFocused: false }); isc.ToolStripButton.create({ ID: "italics", icon: "[SKIN]/RichTextEditor/text_italic.png", actionType: "checkbox", showFocused: false }); isc.ToolStripButton.create({ ID: "underlined", icon: "[SKIN]/RichTextEditor/text_underline.png", actionType: "checkbox", showFocused: false }); isc.DynamicForm.create({ ID: "fontSelector", showResizeBar:true, width:120, minWidth:50, numCols:1, fields: [ {name: "selectFont", showTitle: false, width:"*", valueMap: { "courier": "<span style='font-family:courier'>Courier</span>", "verdana": "<span style='font-family:verdana'>Verdana</span>", "times": "<span style='font-family:times'>Times</span>" }, defaultValue:"courier" } ] }); isc.DynamicForm.create({ ID: "zoomSelector", width:100, minWidth:50, numCols:1, fields: [ {name: "selectZoom", showTitle: false, width:"*", valueMap: ["50%", "75%", "100%", "150%", "200%", "Fit"], defaultValue:"100%" } ] }); isc.ToolStrip.create({ width: 450, height:24, members: [ "separator", printButton, "resizer", bold, italics, underlined, "separator"[B],menuButton,[/B] alignLeft, alignRight, alignCenter, "separator", fontSelector, "resizer", zoomSelector] });
Note that it does not happen every time, although it was frequent enough for me to capture these screenshots. I've also tried wrapping a <span> tag around the image and title. That might help sometimes but not all the time.
Comment