Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    menuButton with icon

    Hi,

    I am trying to create a menu with icon (in smartGWT) - and in fact received only a menu with title. For example, here I get no icon near "File":

    Code:
    isc.Menu.create({
        ID: "menu",
        data: [
            {title: "New"},
            {title: "Open"},
        ]
    });
    
    isc.MenuButton.create({
        ID: "menuButton",
        title: "File",
        menu: menu,
        icon: "icons/16/document_plain_new.png"
    });


    thank you
    Last edited by la123; 7 Jan 2009, 11:05.

    #2
    The code you have shown is using SmartClient not SmartGWT. If you are using SmartGWT have a look at this showcase sample.

    Comment


      #3
      thank you for reply

      I tried the code I wrote in smartClient feature explorer.
      The menuButton.setIcon(...) doesnt work in both smartClient and smartGWT
      Do you have any clue?
      Last edited by la123; 7 Jan 2009, 23:41.

      Comment


        #4
        Use Firebug to see the URL that is actually being requested for the icon. Search the SmartClient Reference for "scimgurl" to understand how the path to the icon is being interpreted.

        Comment


          #5
          The only image I see in menu button in Firebug HTML tab is for menu arrow. Besides that, in Firebug Net tab I don't see a request for image that I add on File menu.

          As I understand, the MenuButton.setIcon doesn't add an icon.

          Here is the HTML source code of my example with File menu that I wrote in my first post:

          Code:
          <table height="100%" cellspacing="0" cellpadding="0" width="100%" style="overflow: hidden; table-layout: fixed;"><tbody><tr><td nowrap="true" align="center" valign="center" onfocus="menuButton.$47()" tabindex="-1" style="padding-top: 0px; padding-bottom: 0px;" class="menuButton"><table cellspacing="0" cellpadding="0" width="100%"><tbody><tr><td nowrap="true" align="left" style="border: 0px none ; margin: 0px; padding: 0px; background-image: none;" class="menuButton">File</td><td style="font-size: 1px; padding-left: 6px; width: 18px;"><img height="8" border="0" align="absmiddle" width="12" suppress="TRUE" eventpart="icon" style="vertical-align: middle;" name="isc_3RmenuButton$4u" src="http://www.smartclient.com/docs/6.5.1/a/skins/TreeFrog/images/Menu/menu_button.png"/></td></tr></tbody></table></td></tr></tbody></table>
          thanks
          Last edited by la123; 8 Jan 2009, 00:01.

          Comment


            #6
            Yes, the MenuButton uses button.icon internally to show the down arrow. If you want a second icon, include it as part of the title by calling isc.Canvas.imgHTML() to generate HTML for the icon part.

            Comment


              #7
              thank you, it answers the question

              Comment


                #8
                Hi Isomorphic,

                is this still the suggested way of doing this (in 12.0p)? I did not find anything else in the docs or the samples, but really can't think it is still this way, as this approach has severe probleme with _Focus, _Over, _Active etc.

                If it is the only way, I'd suggest this as an enhancement.

                Thank you & Best regards
                Blama

                Comment


                  #9
                  There's also an IconButton class, which in horizontal orientation might be closer to what you want.

                  Comment

                  Working...
                  X