Announcement

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

    Change edge images dynamically

    Isomorphic,

    I want to create a custom border style for a VLayout to reflect the states of 'normal', 'hover' and 'selected'. Is there a way I can change the edge images dynamically. When I try to change the edge images I get the following popup:

    Code:
    Cannot change configuration property 'edgeImage'
    What could be the solution in this case?

    Thanks.

    #2
    We'd really recommend against this - that's 24 images just to represent these states, and the transitions between states are going to look slow. Unless you take the trouble to precache images.

    Using CSS styles with border-radius makes more sense here, and works on most browsers now, with degraded appearance in older IE that doesn't look bad or broken.

    Comment


      #3
      Isomorphic,

      Some of our clients are still stuck on old-browsers like IE6,7 on 14 inch CRT monitors. I'm trying to design thumbNails representing various modules, each thumbNail having some live data. The thumbnails look out of place on older browsers. So have no option but to take the trouble to precache the images. Let me know the approach to change edges dynamically and details on pre-caching would be helpful.

      Thanks.

      Comment


        #4
        We're not sure what you mean by "the thumbnails look out of place on older browsers" - since edges can't be changed dynamically our recommendation is to apply CSS borders. If you define rounded edges for newer browsers, thick borders with inset or outset styling are a reasonable-looking replacement for edges on older browsers.

        Comment


          #5
          Isomorphic,

          We also need round-edges to the thumbnail which is not possible in older browsers which is why we were going with images. So by this: "the thumbnails look out of place on older browsers" I meant the thumbNails were not looking good on IE6,7,8 with sharp edges etc. Also another concern is, the border needs to have a gradient which is again not supported in IE-8 and earlier. Sorry for not being clear here, have sent an email with attached image output we are trying to achieve.

          Thanks.

          Comment


            #6
            Just to reiterate, edges cannot be changed dynamically, and we wouldn't recommend doing so in this case anyway.

            If you're looking for a pointer for alternate approaches, it looks like your thumbnails are fixed size, so you could just place a single fixed-sized background image behind them.

            Comment


              #7
              Isomorphic,

              The thumbnail need to scale as per browser, though with max width/height settings. I will try other approaches.

              Thanks.

              Comment


                #8
                Isomorphic,

                This thread suggests that dynamically edges could be changed in SmartClient using EdgedCanvas.
                http://forums.smartclient.com/showthread.php?t=16649

                So its not possible in SmartGWT only ?.

                Thanks.
                Last edited by harsha.galla; 22 Sep 2012, 06:44.

                Comment


                  #9
                  The functionality is not supported for either product. That thread shows a way to do it via an obfuscated variable - its an unsupported hack.

                  Comment

                  Working...
                  X