9 Replies Latest reply on May 26, 2010 3:07 PM by FM_Flame

    Accessing loaded module's class

    FM_Flame Level 1

      I have this in the main application and I have the public variable test in the module. The problem is that I don't know how to access it correctly.

       

      public

       

      var fontsModule:IModuleInfo;

       

      public var FontsClass:Class;

       

      public

       

      function initApp(evt:FlexEvent):void

           {

       

                fontsModule = ModuleManager.getModule("modules/fontsBG.swf");

                fontsModule.addEventListener(ModuleEvent.READY, fontsLoaded);

                fontsModule.load(

      new ApplicationDomain(ApplicationDomain.currentDomain),null,null,moduleFactory);

           }

       

       

      public function fontsLoaded(evt:ModuleEvent):void

           {

                FontsClass = fontsModule.factory.create()

      as Class;

       

                trace("HERE: "+FontsClass.test);

       

           }

       

      If I replace Class with the name of the actions script name of the class "FontsBG" in this example, everything would work but the main swf file size grows from 100 to nearly 400 kbs when the fontsBG.swf file is 67 kbs. So I am definitely not doing the things right.

       

      So the question is: What's the correct way of loading modules and using their properties and functions - through the class or with interface and how it's done? Please set a little code example so I could get the basic concept as well as the readers of this thread.

       

      Thanks !!!

        • 1. Re: Accessing loaded module's class
          FM_Flame Level 1

          Basicly what I try to accomplish is the following:

          1) load a module properly (the question in the post above)

          2) Register the fonts in the main application that are embedded in the module.

           

          I don't know how to do 2) either. If I embedded the fonts via css I don't have the font class name so I can't register it, does anyone know how to get it or I should embed the fonts via AS not css. And If I have the fonts classes, I don't know how to reach them from the main application to register them.

           

          If anyone knows how to do these two things or has a better approach that would be great

           

          Please post some example code lines or an example with view source.

           

          Looking forward to that!

          • 2. Re: Accessing loaded module's class
            Flex harUI Adobe Employee

            1) Use an interface

            2) You should not need to register the fonts unless you are mixing more than

            one fontFamily in a control.  And if you do register them, then the module

            will not unload.

            • 3. Re: Accessing loaded module's class
              FM_Flame Level 1

              About 1)

              I read that using interface is preferable way but you can also make direct relations between the main application and the module. Is it possible ? If it is please write the code lines where you get the class of the module in the main application (I guess it shoul be a line or too if u just know how...), cause I've been struggling to do that and I still can't. As far as I understand at this point is that I should try to get the class after I do this:

              addElement(fontsModule.factory.create() );

               

              But I still can't get it. The only way I could was setting the domain here like this:

              fontsModule.load(ApplicationDomain.currentDomain,

              null,null,moduleFactory);

               

              and then I can get the modules/FontsBG.mxml class using this line:

              trace

               

               

              (ApplicationDomain.currentDomain.getDefinition("modules.FontsBG") as Class);

               

              In the documentation it's described about Application domains but there are not much example why should I set one or another and if I do use what can I do with them and most of all how... So lets take this example:

              When do I use fontsModule.load(ApplicationDomain.currentDomain) and when fontsModule.load(new ApplicationDomain(ApplicationDomain.currentDomain)) and how this affects the communication between main app and modules?

               

              For now just answer me this part please, because for using the interface I still have to read it before asking questions

               

              About 2)

              What do you mean by mixing more than one fontFamily in a control?

              At the moment I do font registering via css like this:

               

              @font-face

               

               

              {

              font-family: MyriadPro;

               

              src: url("assets/fonts/MyriadPro-Regular.otf");

               

              unicodeRanges: "Uppercase","Lowercase","Numerals","Punctuation","Latin I","Cyrillic";

               

              embedAsCFF: true;

              }

              @font-face

               

               

              {

              font-family: MyriadPro;

               

              src: url("assets/fonts/MyriadPro-Bold.otf");

               

              unicodeRanges: "Uppercase","Lowercase","Numerals","Punctuation","Latin I","Cyrillic";

               

              font-weight:bold;

               

              embedAsCFF: true;

              }

              @font-face

               

               

              {

              font-family: MyriadPro;

               

              src: url("assets/fonts/MyriadPro-It.otf");

               

              unicodeRanges: "Uppercase","Lowercase","Numerals","Punctuation","Latin I","Cyrillic";

               

              font-style:italic;

               

              embedAsCFF: true;

              }

              @font-face

               

               

              {

              font-family: MyriadPro;

               

              src: url("assets/fonts/MyriadPro-BoldIt.otf");

               

              unicodeRanges: "Uppercase","Lowercase","Numerals","Punctuation","Latin I","Cyrillic";

               

              font-weight:bold;

               

              font-style:italic;

               

              embedAsCFF: true;

              }

               

              And I will also register more fonts like this that I need to use in my application. Will this require registering them in the main application and if yes, how am I supposed to do that ? I don't mind If I won't be able to unload the module, it's not supposed to be unloaded.

              • 4. Re: Accessing loaded module's class
                Flex harUI Adobe Employee

                1. Referencing the module class from the main app is incorrect, that's why

                you have to use an interface.  You can reference the main app class from the

                module but not the other way around otherwise, as you saw, the main app SWF

                blows up in size.

                 

                2. Declaring fonts in CSS is not the same as registering.  Fonts declared in

                CSS in a module are usable anywhere, but a text control can only display the

                fonts from a single module at a time.  See the recent post on my blog for

                more info.

                 

                 

                --

                Alex Harui

                Flex SDK Team

                Adobe System, Inc.

                http://blogs.adobe.com/aharui

                1 person found this helpful
                • 5. Re: Accessing loaded module's class
                  FM_Flame Level 1

                  Thanks again for replying   Things are getting more and more clear to me and sometimes more and more cofusing when I keep digging

                   

                  Your blog is very cool, I haven't noticed it until you said I could check it out. So now I started reading, I read about the fonts... I think I got the big picture, but things are really complicated. So If I understood correctly about the fonts, in short, when I load a module the fonts I embedded in it can be used everywhere thanks to flex and I should avoid registering fonts.

                   

                  Now here is what I do to load the fonts module:

                   

                  modulesInfo = ModuleManager.getModule(

                   

                  "modules/fontsBG.swf");

                  modulesInfo.addEventListener(ModuleEvent.READY, fontsLoaded);

                  modulesInfo.load();

                   

                  public

                   

                   

                  function fontsLoaded(evt:ModuleEvent):void {

                  addElement(modulesInfo.factory.create() as IVisualElement);

                  }

                  }

                   

                   

                   

                  and I have a global css to use my font (I posted the font I embed in the module in the post above) like this:

                  global

                   

                   

                  {

                   

                  font-family: MyriadPro;

                   

                  font-size: 24;

                   

                  color: #000000;

                  }

                   

                  I set a button in the main application like this:

                  <s:Button

                   

                  label="PROJECTS" />

                   

                  But the label is using some device font and not Myriad Pro, why is that, what am I missing?

                   

                  So for the readers of this thread I would really recommend to go and read all the info that can be found here:

                  http://blogs.adobe.com/cgi-bin/mt/mt-search.cgi?search=modules&IncludeBlogs=126&limit=20

                   

                  Could you please say a few words about this matter I mentioned in the previous post:

                   

                  You say that generally I should stick to child application domains and interfaces. So I have the following questions:

                  1) what's the difference between

                   

                  fontsModule.load(ApplicationDomain.currentDomain);    AND   fontsModule.load(new ApplicationDomain(ApplicationDomain.currentDomain))

                   

                  and why I can't set just new ApplicationDomain(). My idea of these is that the first one puts the classes from the module in the ApplicationDomain of the main app, the second one is a sibling so it keeps references in the module to the main app classes and the last one is not available because main app and module wouldn't be able to communicate with each other if set which makes no sense. Did I get this right ?

                   

                   

                  2) So I get I should use interfaces  but in which cases do we use fontsModule.load(ApplicationDomain.currentDomain); so we can get the classes we need like this ApplicationDomain.currentDomain.getDefinition("modules.FontsBG") as Class;

                   

                  I will read everything you have on your blog, I hope it will give me more answers so I wouldn't have to ask you here but all of this is hard to understand for me at this point so It will be very kind of you to keep this dialog. I try to ask my questions in a simple way so people who read can understand things from my basic level or experience with them

                   

                  Thanks a lot again.

                  • 6. Re: Accessing loaded module's class
                    Flex harUI Adobe Employee

                    A module will not overwrite CSS in the main app.  You will need to change

                    the selectors in the main app.  How to do so depends on which version of

                    Flex you are using.

                     

                    If you use just "applicationDomain.currentDomain" you are loading the module

                    into the same applicationDomain as the main app, which means it cannot be

                    unloaded, but does give you direct access to the classes w/o need of

                    interfaces.  The other creates a child applicationdomain (not a sibling)

                    which allows the module to unload.  See the modules presentation on my blog.

                     

                    Regardless of how you load a module, you can always get instances of its

                    classes via factory.create("modules.FontsBG");  However, it will affect

                    whether the instances share interfaces and other types.  You have to

                    trade-off unloading and sharing and versioning.

                    1 person found this helpful
                    • 7. Re: Accessing loaded module's class
                      FM_Flame Level 1

                      1) I am using flex 4 and spark architecture. In the main app I have in global font-family:Myriad Pro; size etc and in the module which I load with a child domain in css are the embedded fonts. I posted that above. I set a button in the main app, set label to it and It isn't using the ebedded fonts. So having what I've posted above, why it's not working? I tried removing the global selector from the main css and setting it in the module but still no success. So what do I need to do to have the embedded fonts working everywhere?

                       

                      2) I've read your presentation It's awsome! I really think I understand a lot of things now. I have one question on the flex frames but I will ask later on.

                      I think I understand the app domains and child app domains now but what's a sibling application domain ?

                       

                      3) With the last paragraph do you mean like this or something else (if it's this then it also grows the file size as we mentioned before)?

                       

                      var

                       

                      test:FontsBG = modulesInfo.factory.create("modules.FontsBG") as FontsBG;

                       

                      If it something else please show me how to use that line with a simple example, thanks.

                       

                      P.S.

                      If you would like I could set up this example upload it online and post here the link or the files, just let me know if you would prefer that.

                      • 8. Re: Accessing loaded module's class
                        Flex harUI Adobe Employee

                        3) Again, you will have to use a shared interface or a common base class.

                        Most folks put UI widgets in a module and they all extends UIComponent so

                        you can reference them as UIComponents.  If they need access to other

                        properties and methods, they define an interface.

                         

                        1) My guess is that the Button doesn't know that a module with embedded

                        fonts got loaded and doesn't refresh to use it.  Normally, you would

                        encapsulate the styles in the module with the fonts and then set styleonce

                        the module is loaded.  In that case you wouldn't specify MyriadPro as the

                        font-family in CSS and would set it via setStyle once the module is loaded.

                        • 9. Re: Accessing loaded module's class
                          FM_Flame Level 1

                          Thank you for your time and answers Alex, I appreciate it I have a better understanding of how things work now.

                           

                          I am struggling with using the embedded fonts now and style in module and in main app and using the moduleFactory to inherit the styles from the main app to the module, but I will keep reading and testing for now and probably will ask if any questions in a new thread with an example.

                           

                          Thanks a lot again