Problems with the Transition of custom components bare in s:TileGroup

I have a problem with transitions play does not correctly on a custom component that is displayed in a < s:TileGroup >.

Code of the custom component;

<?xml version="1.0" encoding="utf-8"?>
<s:SkinnableComponent xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
 skinClass="com.mydomain.view.skins.SkinFile">
 
 <fx:Metadata>
  [SkinState("normal")]
  [SkinState("photo")]
 </fx:Metadata>

 <s:states>
  <s:State name="normal" enterState="invalidateSkinState()" />
  <s:State name="photo" enterState="invalidateSkinState()" />
 </s:states>
 
 <fx:Script>
  <![CDATA[
   override protected function getCurrentSkinState():String {
    return currentState;
   }
  ]]>
 </fx:Script> 
 
</s:SkinnableComponent>

The skinfile itself is relatively simple

<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx"
  width="300" height="200" width.photo="140"
  >
   
 <fx:Metadata>
  [HostComponent("com.mydomain.view.components.MyComponent")]
 </fx:Metadata>
 <s:states>
  <s:State name="normal"/>
  <s:State name="photo"/>
 </s:states>
 
 <s:transitions>
  <s:Transition autoReverse="true">
   <s:Resize target="{this}" duration="500" />
  </s:Transition>
 </s:transitions>
 
 
 <s:Rect id="rect" radiusX="15" radiusY="15" top="0" right="0" bottom="0" left="0">
  <s:fill>
   <s:LinearGradient rotation="90">
    <s:GradientEntry color="0xffffff" ratio="0" />
    <s:GradientEntry color="0xf0f0f0" ratio="1" />
   </s:LinearGradient>
  </s:fill>
  <s:stroke>
   <s:SolidColorStroke color="0xc0c0c0" weight="1"/>
  </s:stroke>
 </s:Rect>
 
</s:Skin>

When displaying a couple class MyComponent instantiated in a s:TileGroup as follows;

<s:TileGroup width="940" verticalGap="20" horizontalGap="20" clipAndEnableScrolling="true">
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
 <components:MyComponent currentState="{theState}" />
</s:TileGroup>

and saw two buttons to switch the value of the 'State' to 'Normal' or 'photo', it resizes the component properly to the small size, but that goes back to the smaller size to the largest size, it does not play the transition. It just makes small to large immediately.

The strange thing is, however, that if I use a tag < s:HGroup > instead of < s:TileGroup > it works like a charm, so I guess that's not so much the custom component or skin that is causing problems.

When I put the transition of the size of the component itself instead of in her skin, then it works as expected, but I think that transitions should be defined in the skin and not in the component itself, right?

I do something wrong or didn't I just encountered a bug maybe?

It took me a while to realize it was.  TileLayout organises its elements in a grid of 'cells' and each cell is the same size (the size of the largest component).  Then, each element is placed in its own cell because the horizontalAlign/verticalAlign properties.  By default, TileLayout a horizontalAlign = justify which means that extends the element to the size of the cell.  In order to have an effect of resizing plays on the skin of the element does not really have any effect.  He gets to work when the shrinkage, but fails more and larger, I guess because the increase in the width of an element affects all cells, while the lower has not.

So I think the right thing to do here is to either wrap a group around the Rect and mentioned target that you like, or the TileGroup.horizontalAlign left/center/right value.

Here's a simplified example of how you can reproduce it:


http://ns.Adobe.com/MXML/2009.
xmlns:s = "library://ns.adobe.com/flex/spark" >
   
        [Bindable] public var test: Boolean = true;
]]>
   

   
   
       
           
               
                   
                   
                   
                   
               

               
               
                   
                       
                   

                   
                       
                   


               
               
               
                   
               

           
       
   
   
   
       
   
   
   
       
   

   
   
       
       
   

   
   
       
       
   

   
   
       
       
   

   

If you wish, you can ask about a bug, but I have the feeling that we would not be can not fix because probably you shouldn't use horizontalAlign = justify and change the width of the element at the same time.

Tags: Flex

Similar Questions

  • problem with the transition and external image

    Hello! I have a little trouble with the transition to a new state that contains an external image. I want a titlewindow to resize when the user clicks on a button and view an external image. the size of the external image is unknown until it is loaded, so I put the widths/heights to 100%. However, the transition "resize" does not know the size of the image in time and comes alive in a small rectangle...

    I discovered how to solve this problem by deleting the passage and making the invisible titlewindow until the image is loaded (using the event 'complete'). Ideally, I would like to use the functionality of transition, however and am curious to know if anyone has any ideas on this point - perhaps triggering the resizing to start once the image is loaded? I can only find a way to display a transition through mxml - this can be achieved via actionscript?

    When you use States and there is a tag This means that the child will be added to the display list. The object already exists (a new operation has been made about it). It may not be in a fully realized State first because it has not been added to the display list and therefore his complete cycle of creating the Flex framework has not been executed.

    I haven't run the scenario I propose, so it might actually not, but I have another suggestion below.

    You should be able to have in the State that when you are ready to load the image, img.source = url; should not give you an error. The question is, without the image being added to the display list, try even to load image from url and trigger the complete event? If it does not trigger the complete event, then you can change the States there.

    My alternative is to not put the Image in the State, but leave it in your state of base with a width and a height of zero. Having the button set the source property of the image (or call the load() method). When the complete event triggers switch States.

    In your , instead of having an AddChild, you'll SetProperty. Something like this (width, height would be similar):

    Now, the transition must simply use the effect of .

  • Problem with the shortcut menu custom BB10

    Hi all

    I am currently trying to implement a context menu that is customized with my webworks app. So far I'm not creating a normal webworks / bbUI app, but I'm trying to add some features of bbUI. So to speak, I have a few different elements in my application, each of them triggers the context menu, as expected. So far so good. But now I have some problems to detect which element / div has triggered the call from context menu. How can I get this information?

    I add the context menu like this:

    var contexts = [blackberry.ui.contextmenu.CONTEXT_ALL];
    var itemRead = {
        actionId: 'actionRead',
        label: 'Read Article',
        icon:'../assets/images/new/add.png'
    };
    
    blackberry.ui.contextmenu.addItem(contexts, itemShare, function(arg1) {
        console.log("itemShare: " + arg1);
    });
    

    But as I have already described arg1 is null, and I have no idea on how to detect the appellant.

    Can someone help me, please?

    I thank very you much in advance!

    See you soon,.

    Sven

    You need the feature called custom context. This will give you that you the information on that DIV has been pressed. When you set your DIV, add a tag called:data-webworks-context

    Thus your div would look something like this:

    1
    2
    3
    blackberry.ui.contextmenu.addItem(contexts, itemShare, function(id) {
        console.log("itemShare: " + id);
    });
    

    You are passing a JSON for the CCM object and asking him to come back to you, the ID of the item that called the context menu, so you can do a job. Let me know if that helps

  • Problem with the transitions of title

    Hello my mobile display and don't have the best version of the site (I'm guessin') so if there is a sticky or that was solved a million times I'm sorry, delete, close, ect...

    So im working on a video testimonial and I added the names of people as a title but when I add a transition (dip to black) my video below fades as well short. Any ideas?

    I just went with cross fader seems to work! Thank you all!

  • Problem with the google in Firefox search bar

    Last week the google search bar began to do all the searching through the site google.nl Dutch. He has never done this before. I'm in England, and the search bar has always used google.co.uk by default. I don't know why this has changed. I have not modified any settings and I use the version the most up-to-date Firefox on my Windows laptop, 8. Change the settings of google through the google Web site does not help.

    Well, Google thinks he knows better than us...

    Perhaps it would work better to install a plugin for Google UK-specific search. This page has two options:

    http://mycroftproject.com/Google-search-plugins.html

    Look for these:

    • Google UK (SSL)
    • Google UK - United Kingdom (SSL)

    After installation, you should probably use the search bar drop-down list to select the new search plugin in the bottom of the list.

    You could also check your connection here:

    "3-bar" menu button (or tools) > Options > advanced > tab mini network > button "settings".

    The default "use system proxy" should piggyback on your LAN-Windows/IE settings, but you can also try the 'no proxy' to see if that changes anything.

  • a text box is every moment that I edited dynamically scroll bar upward. I know that's not a problem with the Web site because she works with other browsers

    There is a problem with scrolling of a text box bar. whenever it is changed dynamically developing area moves upward instead to keep the focus in the area of the new inserted text. even if I move it down to hand it back again.

    OK, I have fixed the code in my program. When I finished the editing, I use this code in javascript.
    document.getElementById("chatMainTxt").scrollTop = document.getElementById ("chatMainTxt") .scrollHeight;

  • Smart Safari search bar, problem with the option 'include suggestions for Safari '.

    Hi all

    I am facing a problem with the search bar Safari Smart of yesterday (January 26, 2016).

    The search bar doesn't work anymore, I can't type, or search or write an http address either. I can only navigate by selecting a bookmark.

    Go to preferences I have all the people with reduced mobility and the disappearance of the problem.

    Then try to isolate the problem, I've found it comes to the "include suggestions of Safari" option in the smart search options.

    Anyone had a similar problem, or have any suggestions on how to get it back to life?

    I must say yesterday, everything working, I have not installed anything new on my Mac.

    Thank you very much!

    Kind regards

    S. Luca

    Try the following steps:

    A possible solution to the problem of address bar: disable the Safari Suggestions

  • problem with the Quick Launch bar - see the desktop icon missing

    original title: problem with the Quick Launch bar

    I've lost the 'show desktop' icon in my quick launch because of deleted by mistake the icon. I want that icon to return to the system to go to the office quickly within my work on computer... How can get that back?

    See How to re - create the icon of the Office see the Windows XP Quick Launch toolbar

  • Hi, I have a problem with the download trial version of adobe after effect cc. When I want to download instad of download there are massage: we are experiencing some problems, please try again later. If the problem persists, contact customer support

    Hi, I have a problem with the download trial version of adobe after effects cc. When I want to download instad of download there are massage: we are experiencing some problems, please try again later. If the problem persists, contact customer support. What seems to be a problem? Thank you

    Please try after effects configuration required for Mac OS and Windows

    Concerning

  • My purchase is that creative cloud is a ° 16034007400 at the date of renewal, there was problems with the credit card, but the tax has been paid in January. So far I can't use the program or any of its components without Adobe me any explanation on why I

    My the purchase is Creative Cloud is a ° 16034007400 at the date of renewal there are problems with the credit card, but the deposit was paid to January. Up to now I can not use the program or one of its components without Adobe me any explanation on why I can not use.
    Why not allow Use Adobe Creative Cloud?

    : Contact support from adobe for hourly pst by clicking here and, when available, click on "still need help," http://helpx.adobe.com/x-productkb/global/service-ccm.html

  • There was a problem with the current system. Please try again later. If the problem persists, contact customer service.

    There was a problem with the current system. Please try again later. If the problem persists, contact customer service.

    Why?

    Please tell us what Adobe application you are trying to download. Please try creative cloud install app - https://helpx.adobe.com/creative-cloud/help/install-apps.html

  • better integration with the Mavericks. Still a problem with the display of the menu bar spaces when moved

    Much better integration with the OSX mavericks on the latest version. Without a doubt ahead of Parallels in terms of dual display/full screen. The menu bar has been resolved, but there is a ghost menu bar that appears when you move one space (fullscreen vm) from one monitor to the other. It resembles a translucent bar on top and without words. But clicking on it shows menus as if it is supposed to be links there.

    Yes, it is a known problem with the Mavericks Developer Preview; We work closely with Apple to find a solution. So far, we have seen only with the restoration of the window or when you move the window between monitors - if you leave full screen and enter again, it should work fine. If you notice any others, please let us know.

  • Hello. I have a problem with the payment process when trying to buy the plan of creative photography of Cloud (one year). the error is: there was a problem processing your order, please contact our Service team customer care for assistance. AfricaBa North

    Hello. I have a problem with the payment process when trying to buy the plan of creative photography of Cloud (one year).

    the error is: there was a problem processing your order, please contact our Service team customer care for assistance. Middle East & North AfricaBahrain: 80081097Egypt: 08000000447Jordan/Kuwait/Lebanon/Qatar/Yemen: English + 44 207 365 0735Jordan/Kuwait/Lebanon/Qatar/Yemen: Arabic/French + 44 203 564 4145Oman: 80077173Saudi Arabia: 8008446638Tunisia, the Morocco and the Algeria: + 33 United Arab Emirates 157324642United: 80004443085Commonthwealth of independent States (CIS): + 44 207 365 0735

    Help me please to solve this problem. I need my lightroom immediately)

    Hi mohamed,.

    Please see the link below to buy the plan of photography:

    Pricing plans and creative Cloud membership | Adobe Creative Cloud

    In case you still have question, please contact sales at Adobe team.

    Adobe Middle East and North Africa

    Kind regards

    Sheena

  • My customer is having a serious problem with the Contact form Widget

    My Client is to have a serious problem with the Contact form Widget that I can't seem to figure out how to fix.

    I created a website for a client and inserted a widget of Contact form on the "Contact us" page Whenever someone uses the form, e-mail receive my client shows my e-mail address as the sender. So when they "meet" the email, the response is sent to me and not the person who sent the original message. This creates a major problem in that I get flooded with answers e-mail while my client's potential customers go without a response.

    When I look at ' Site Manager > email system > Workflow information > e-mail address on the site administration Console, it displays my e-mail information. This is what needs to be changed?  If this is the case, what needs to be placed in this field for the email address of my client receives presents information email senders in the field "from".  My client wants to be able to click on reply and the message sent to the right side. They would be very angry if should be cut and past shippers Correo electronico of the body text on all the contacts they receive.

    Their feeling is that if I can't find a way to make the contact form works as it should, then there is no need for them.

    Can someone help me understand this? I really don't want to disappoint my first client.

    Congratulations for your first customer! =>

    Looks like you can have your email in places where your customers email should be.

    Here are the places you need to change your e-mail address.

    First adjust the answering of your web form is your customer email. Screenshot: http://screencast.com/t/YWiZZ30E0jE and http://screencast.com/t/u4t69anTLR

    Second set Emails to come your clients e-mail system. Site management > system email > set default "from" e-mail. Screenshot: http://screencast.com/t/EAr2sfXk

    I always go through each email system and check the e-mail address after you set the default value. I found that it doesn't always change them for some reason any. Note: If you are on a lower to webCommerce plan your list can be shorter than what is shown.

    Make sure that the email you the list of customers is also an email they want in public.

    Also provide information on the TSA that thetrickster888 is good information.

    I hope this helps.

    Lynda

  • Problems with the menu bar

    Hello

    I have a problem with the menu bar

    Without explanation the menus disappear as in the first picture

    Hello
    I have a problem with the menu bar
    Menu disappears without explanation, as in the first picture

    Capture photoshop element 1.PNG

    I know access like this

    I can't access like this

    Capture photoshop element 2.PNG

    Pour to a normal bar I need to get a disk image, if I do a restore to the day before I still have the problem

    Do you have an idea

    Thanks in advance

    To return to a normal bar, I take a disc image, if I do a restore from the previous day, that I still have the problem

    Do you have an idea
    Thanks in advance

    Capture photoshop element 3.PNG

    Hello, jbr52. Read this:

    http://www.johnrellis.com/psedbtool/Photoshop-elements-FAQ.htm#_Setting_the_Windows

Maybe you are looking for