3 Replies Latest reply on Feb 3, 2011 11:22 AM by Shongrunden

    Flex 4 and disabledOverlayAlpha

    thimmaiah.chendrimada

      Im migrating from Flex 3. My app use to display forms in readonly mode by setting the Panel enabled=false and setting its disabledOverlayAlpha=0 so that the readonly form would not look greyed out but would be disabled.

       

      Now Flex 4 does not support this style disabledOverlayAlpha for spark Panels and BorderContainers. Is there a simple way to do this without skinning the component ?

       

      Thanks in advance

       

      Regards

      T

        • 1. Re: Flex 4 and disabledOverlayAlpha
          Shongrunden Adobe Employee

          A custom skin would probably be the best approach, but you could set the alpha on the skin to 1 without custom skinning like this:

           

          <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                         xmlns:s="library://ns.adobe.com/flex/spark"> 

           

              <s:Panel id="panel" title="Test" creationComplete="panel.skin.alpha=1"  enabled="false">

                  <s:Button label="test" />

              </s:Panel>

           

          </s:Application>

           

          This example just changes the alpha to 1 at creationComplete time.  If you later change the enabled value to true you will probably have to update the skin alpha again as well.

          • 2. Re: Flex 4 and disabledOverlayAlpha
            thimmaiah.chendrimada Level 1

            I tried this but the panel still looks grayed out. Any suggestions ?

             

            My code

             

            <UserRequestDetailsPanel id="userRequestDetailsPanel" enabled="false"

               creationComplete="{userRequestDetailsPanel.skin.enabled = true}"

               height="400" maxWidth="800"/>

            • 3. Re: Flex 4 and disabledOverlayAlpha
              Shongrunden Adobe Employee

              I'd have to see your application to know why, but it looks like you will want to use a custom skin.

               

              Another alternative would be to wrap the Panel in a Group and set disabledAlpha on that Group:

               

              <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                             xmlns:s="library://ns.adobe.com/flex/spark"> 

               

                  <s:controlBarContent>

                      <s:CheckBox label="enabled" id="chk" />

                  </s:controlBarContent>

               

                  <s:Group id="group1" enabled="{chk.selected}" disabledAlpha="1">

                      <s:Panel id="panel" title="Test">

                          <s:Button label="test" />

                      </s:Panel>

                  </s:Group>

               

              </s:Application>