Enhanced Flex MDI Interface
Two weeks ago, I posted a prototype MDI (Multiple Document Interface) application. Well, I am very happy to say that this has been seriously improved. I'll say it again, this is one concept that Flex handles very well. I have yet to find anoter web development technology that allows as rich of an interface, with such easy of use, extensibility, and resusability. Hopefully this will help you to spur your own ideas.
Check out the demo (2 MB captivate movie):
...Or try it out yourself.
Basically, here's what I've done to make it better:
That's all the changes that I can think of off the top of my head, but there could be more... Sorry, I'm not sharing the source of this. If you have questions or comments, feel free to let me know at andrew.trice(at)cynergysystems.com.
Try out the MDI interface for yourself.
Check out the demo (2 MB captivate movie):
...Or try it out yourself.
Basically, here's what I've done to make it better:
- Animation! Yes, that's correct. There are now animations for minimize, maximize, resize, etc... Inside my WindowComponent class I've taken advantage of Flex effect's easing functions on the animations. It will turn into some neat mac-genie-like effects (but I've toned it down b/c it can also make you nauseous).
- Did you say resize? Yes, I did. You can click and drag on the bottom right corner of the window to resize it (if resize is enabled).
- Ability to minimize windows to the bottom of screen (and they stay on the bottom when the screen is resized).
- Enable/Disable window options. The window options (minimize, maximize, resize, close) can be enabled/disabled per window instance through either mxml code or actionscript.
- When a window is maximized, it can't be dragged & dropped. It can only be dragged and dropped once it has been minimized or restored to default state.
- Did I just say that it could be implemented in mxml? Yes, I did. It has been modified so that you can create window components using either mxml or actionscript (your choice). This is the extensibility and resuability that I am talking about. It is extremely easy to build amazing applications using this approach. For example:<mdi:WindowComponent title="Example Window" >
<mdi:content>
<mx:Text width="100%" height="100%" text="This is a window." />
</mdi:content>
</mdi:WindowComponent>
That's all the changes that I can think of off the top of my head, but there could be more... Sorry, I'm not sharing the source of this. If you have questions or comments, feel free to let me know at andrew.trice(at)cynergysystems.com.
Try out the MDI interface for yourself.





4 Comments:
This post has been removed by a blog administrator.
Why would you have a blog and publish this and then say its closed source? You are obviously using your "blog" to advertise your company/component. At least have the decency to be up front about it.
I sure do wish you would share this MDI windowing code. I have to do exactly this for my next project. Since I'm brand new to Flex, what probably took you weeks to do, will take me months. Don't you want to help train/grow the Flex community??? If you change your mind, or if anyone else out there has similar code you are willing to share, please send it to kvandyken@pervasive.com.
There is an open source project that is very similar: http://code.google.com/p/flexmdi/
Post a Comment
<< Home