9 Replies Latest reply on Jul 25, 2011 9:59 PM by William Spence

    Instantiate a Custom Component Without Displaying It?

    William Spence Level 1

      I have an application that has several states.  Each state displays a large custom component centered on the screen, and each custom component uses services to get information from an online SQL database and then uses the data to download media to be displayed.  I personally think that it looks unprofessional to go to a new state and your cursor turns to a busy cursor as the database is accessed and media starts popping up slowly and randomly on the screen.  This is happening in all of my custom components.  As a solution, when a user decides to start a new project in my application, I would like to instantiate or activate each component without displaying them and use a progress bar to give the user visual feedback that a new project is initializing.  Then the progress bar would disappear and as your progressed from component to component, the media and SQL services would already be populated so there would be no unprofessional feel to the UI.  Is there a way to instantiate or initialize a component without adding it to the display list?

       

      For discussion sake, here is a very general outline of the program as it is now:

       

      <s:states>
           <s:State name="state1"/>
           <s:State name="state2"/>
           <s:State name="state3"/>
           <s:State name="state4"/>
           <s:State name="state5"/>
      </s:states>
      
      <components:Type id="typeComponent" includeIn="state1"/>
      
      <components:Browser id="browserComponent" includeIn="state2"/>
      
      <components:Select id="selectComponent" includeIn="state3"/>
      
      <components:Media id="mediaComponent" includeIn="state4"/>
      
      <components:Media2 id="media2Component" includeIn="state5"/>
      

       

      Somehow, I would like to load each of the components without having to display them before I get to each of the states so that the SQL and thumbnail media is loaded and ready to go when I get to each state.  Is there a way to do this?

        • 1. Re: Instantiate a Custom Component Without Displaying It?
          kokorito Level 4

          yes, move the data to a singleton class extended from the event dispatcher

          the singleton fetches all the data and dispatches an event to initialise the views

          the views can connect to the singleton to populate their data

           

          dont know if thats strictly MVC but works for me (atm) 

          1 person found this helpful
          • 2. Re: Instantiate a Custom Component Without Displaying It?
            drkstr_1 Level 4

            You can use set the default includeInLayout and visible properties to false, then set to true for the state(s) you want them to show up in.

            1 person found this helpful
            • 3. Re: Instantiate a Custom Component Without Displaying It?
              UbuntuPenguin Level 4

              You can add the component to the display list without showing it to the user by setting visible=false and includeInLayout=false. I had a similar problem when trying to print a PrintDataGrid.  You set those properties to false and add it to the FlexGlobals.topLevelApplication (I think).  Then when your data service is done you can reparent the component.

               

              Generally when I have problems such as you described in your post I would have a controller/presenter do all the logic of when something should appear based on the data that is available.

              • 4. Re: Instantiate a Custom Component Without Displaying It?
                William Spence Level 1

                Kokorito, I like your approach.  I have just recently been acquainted with the concept of a singleton and it is probably the proper way to go.  Unfortunately, I only began programming 8 months ago, and although I am a quick learner, I know nothing about MVC or Cairngorm yet and due to my time limits, I think the learning curve would be too great to impliment my entire application around it at this late date.  I know that I need to learn MVC to advance my skills, but I think for now I need something a little more basic.

                • 5. Re: Instantiate a Custom Component Without Displaying It?
                  UbuntuPenguin Level 4

                  >..., I know nothing about MVC or Cairngorm

                   

                  You may want to keep it that way

                   

                  >... I need something a little more basic.

                   

                  There is no other design pattern more basic ( or more dangerous when misapplied ) than a singleton

                  • 6. Re: Instantiate a Custom Component Without Displaying It?
                    William Spence Level 1

                    drkstr_1, of the the suggestions so far, yours might be the simplest for me to implement at this late date in my application development, but I am a little unclear on the details.  Are you saying that I ought to include all components in the first state but change their visible and includeInLayout for state1 to false and then set them to true for the state that they are to be displayed in like below?

                     

                    (Looking at just the second Browser component)

                     

                    <components:Browser id="typeComponent" includeIn="state1,state2"

                         visible.state1=false visible.state2=true

                         includeInLayout.state1=false includeInLayout.state2=true/>

                    • 7. Re: Instantiate a Custom Component Without Displaying It?
                      William Spence Level 1

                      UbuntuPenguin, I appreciate your feedback to my initial post.  I have learned how to use a basic singleton, but most of my dataproviders are very deep and complex arrayCollections that I would have no idea how to impliment in a singleton.  So for now, I have just been sticking with FlexGlobals to share important data between components.

                       

                      Your suggestions was very similar to drkstr_1's by utilizing the visible and includeInLayout properties, could you read the response that I sent to him and tell me if I am thinking about this correctly?

                       

                      Thanks!

                      • 8. Re: Instantiate a Custom Component Without Displaying It?
                        drkstr_1 Level 4

                        I mean like this:

                         

                        <components:Type id="typeComponent" visible="false"  visible.state1="true" includeInLayout="false" includeInLayout.state1="true"/>
                        
                        <components:Browser id="browserComponent" visible="false"  visible.state2="true" includeInLayout="false" includeInLayout.state2="true"/>
                        

                         

                        By default, the components will be excluded from every state, except for the states where you set them to true.

                         

                        The components will still be created, but they will not be included in the element layout or visible to the user.

                        • 9. Re: Instantiate a Custom Component Without Displaying It?
                          William Spence Level 1

                          Thanks for your input, I will work with this and see if I can get it working for me.  The application has gotten fairly large so it may take some time.  But I ought to know in the next couple of days.