I want to use Adobe mxml to create a swf. However, the mxml gets compiled to swf itself and is not available after creating the swf. I want to add states with UI components without compiling it every-time. Is it possible with mxml? If not, what other design approaches can I take?
The very nature of MXML and ActionScript and the Flash Platform is that you must recompile the app every time you want to make change. What you request is not possible.
There are a lot of things you can do--with ActionScript and MXML--to change the state of a component at run time based on some parameters.
As one example, when you click the down arrow button of a ComboBox the drop down will open. This is, essentially, a run time state change. There is no reason you can't perform the similar functionality with your own custom components.
Related
What would be the preferred (recommended) way to rearrange the components of a QML UI on an event such as a button click?
I do have designed a UI consisting of a bunch of custom components, each of them is bound to a (C++) model. I use anchors to position the components in the ApplicationWindow.
On a button click, I want to add an additional component which, due to its size, makes it necessary to rearrange the existing components. Actually, the button could be understood as switching into a different mode such as the Debug view in an IDE (think of Eclipse).
My goal is to keep the components in a consistent state between views and make the switch as fluent as possible.
I could think of these options:
Design two different views, and use a Loader or State to switch between them. As initializing the models takes some time, they should remain not be deleted during switching. I think, setting them as ContextProperty of the QMLApplicationEngine should take care of that.
Do a lot of rearranging in the onClicked()-Handler of the button. Probably the worst solution but does not require to reinitialize the components and models.
I think the most elegant solution would be to initialize the components in a some kind of container (or model) and then assign different layouts to this container on button click. But I have no idea, if this is possible and how to achieve that.
Edit: I followed approach 1. by using the StackLayout. It works basically, but it seems as if the invisible UI is still running in the background and consuming resources (e.g. requesting Images from my QQuickImageProvider).
Using a Loader eliminates this problem as it destroys the previous UI on every change of the source property. What I do like about the StackLayout however is that it preloads all UIs on app startup. So the transitions are smoother compared to the Loader. Is there a way to disable the invisible UIs?
Your option (1) is the one giving your the most flexibility, since you have two entirely separate UIs depending on state.
As you already discovered yourself this requires keeping all relevant state data in a way that is accessible by both UIs, e.g. in C++ or in globally accessible QML/Script objects.
I would go for that if you envision any more changes or tweaks than just rearranging elements.
If you are sure that rearranging elements will be sufficient, have a look at QML states
It is a bit like a combination of your options (2) and (3).
The state setup allows you very locally to define anchors and other properties for each element depending on a named state.
The button's signal handler then only needs to change which of the states is active, by assigning one of the names to the respective state property.
I'm trying to implement a popup window (NativeWindowType.UTILITY) in an AIR 2.7 application that uses Swiz for dependency injection.
I have followed the Swiz guidelines that I've been able to find, and implemented ISwizAware on the class that creates the window, and I am calling _swiz.registerWindow() before opening the window, and dependency injection works fine on the window itself after this.
However, the problem I am running into is that I have a child view within that window, and I have a mediator that uses the [ViewAdded] and [ViewRemoved] tags. Neither the view added nor view removed functions are triggering. I'm thinking the issue is either:
The child view is not correctly registering with Swiz.
The swiz instance doesn't know about the beans (I have tried manually adding the bean however, which didn't have any effect).
The ViewAdded and ViewRemoved metadata tags simply aren't working because each NativeWindow object has its own stage instance.
Anyone know more about this?
Popups are a special case since they don't get added under the same display tree as your application. Under Stage (the main wrapper for Flash Player), you'll have Application where your code resides for Swiz, but Popup is in a separate layer above Application. Since they're siblings, Swiz cannot listen in for when the popup is being added to the Stage.
The way around this is to either set the properties of the popup manually (which is normally the easiest way) or manually add the popup to Swiz's awareness. For this you'll have to look at the documentation since I haven't touched Swiz in a long time.
What is the best way to do a loader in a flex application? I have an animated .gif that is to be used as our loader (whenever I need to wait for an action to complete), and I am not sure the best way to do it.
This is how I am thinking:
Have the loader be a custom component.
On the parent application, add an event listener for my custom event AceEvent.SHOW_LOADER.
In the event listener, use the PopUpManager to show the loader.
Listen for AceEvent.HIDE_LOADER.
Get rid fo the loader via PopUpManager.
What do you think about this? Is there a better way to do it?
Thanks!
Andrew
Well, last I checked, animated gifs don't work in Flex unless you have a workaround. Still, I wouldn't use an animated gif to create an animation because of their low quality. I would just recreate it using Flash.
The way I would do the loader however would be very different. personally, I don't believe in 'system loaders' unless it's your application's preloader. The reason for this is that there could be more than one thing loading at the same time (which might not know about each other) which means that the loader popup could disappear before everything is loaded (first one loads, dispatches event and removes popup, while the other is still loading).
What I like to do is create a custom component for the popup loader (since it will be reused quite a bit) and from there I can either use states the are appropriate for my view or have a boolean flag binded to show the popup when true (this can easily be done using frameworks like Parsley). The popup would only cover the part of the system that's actually loading data (since I doubt that your whole app is loading data at the same time) which makes for a better UX.
I ended up using as3gif (until I can get this recreated as a .swf). The way I do this is by using my custom event class (AceEvent.SHOW_LOADER and AceEvent.HIDE_LOADER), which bubbles up to the top. I then use the PopUpManager to add/remove this with modal to disable the application.
I'm moving some Flex classes to pure Flash/AS3 to be part of a shared library. I have an event listener on FlexEvent.CREATION_COMPLETE to create and add display-objects once things are running, but I don't know the right way to do this in Flash?
edit: Maybe if my class subclasses Sprite rather than a Flex class, I can add children in the constructor, I don't need to wait for a "construction complete" event?
It depends on what you are trying to do: When you add children in the constructor, you will not be able to depend on any information about the stage and/or other elements on it. I have found it a better practice to add an event listener for Event.ADDED_TO_STAGE in the constructor, and have the handler method initialize the element.
You're really comparing apples and oranges here.
The Flex Framework is a UI Framework, and the CREATION_COMPLETE event is part of that framework.
Flash Professional is an IDE, primarily geared for creating animation. It has ActionScript support, but is not a framework and does not offer anything beyond native ActionScript other than libraries or classes you build, buy, create, or borrow.
If you want some parallel to creationComplete, you'll probably need to find--or create--a UI Framework. It is, in theory, possible (although not easy, nor something I'd recommend) to initialize the Flex Framework for use inside a Flash IDE created movie. After all, under the hood it is all ActionScript.
creationComplete Dispatched when the component, and all of its child components, and all of their children, and so on have been created, laid out, and are visible.
See more info on the flex life-cycle events and some that are plain flash here: also +1ed the added_to_stage as it's likely what you'll need in this case.
http://livedocs.adobe.com/flex/3/html/help.html?content=containers_intro_3.html
I have an MXML component in a website that I am reusing in a few different screens.
Based on what the user clicks, the component initializes a few values and starts playing media.
Now if I click through the site, and I play media in screen 1, the component initializes fine and plays the media.
If I then go to screen 2 and play the media, the component initializes twice. Once for screen one, and once for screen 2.
When I then go to screen three, it will start initializing three times.. So it is creating a new instance of the MXML component for each screen!!
How can I make sure that the MXML component only initializes for the screen that I need it to initialize for?
What I really want is that this component always has just one instance throughout the whole application. Is it possible to make that MXML component into a Singleton, so that I always have one instance of that MXML in my application?
Can you explain this a little more indepth? What do you mean by "screens"? It sounds like you have your component nested in some sort of view stack, and that your screens are different sections in the view stack, but it's hard to tell here.
Regardless, I think the solution is to abstract the part of your component that you want to be a singleton from the view. Flex initializes objects in view stacks in a lazy manner by default, but this can be overridden using the creationPolicy property on the ViewStack object. It sounds like your creationPolicy is initializing children as you access them, and something in your component code is causing other instances of the same object to re-fire some initialization code when others are created (possibly in your experimenting for an MXML singleton.)
To truly achieve your desired effect, you should probably just write a bit of actionscript that intelligently re-parents the display object you only want to be created twice. The idea of a "singleton" doesn't make as much sense when we're talking about view objects on screens - to have it displayed in many places, you need many instances, and the process of re-parenting is slightly more complicated than the singleton pattern, so you'll need to do a bit of creative logic around that.
Hope this helps - again, please feel free to post some more source code if you want a more specific response.
Why don't you make the component into a module and use it that way. You Load and/or Unload a module and use it where ever you like! in just calling it as a single item! and you have very much less overheads in your application.