A Flash Developer Resource Site

Results 1 to 14 of 14

Thread: KoolMoves Accordion Widget/Component?

  1. #1
    Member
    Join Date
    Dec 2005
    Location
    Park Slope, Brooklyn
    Posts
    56

    KoolMoves Accordion Widget/Component?

    I understand that Flash MX Pro has an Accordion Component.

    Does anyone have any ideas as to how to do something similar in KoolMoves?

    It doesn't have to be ActionScript based, but It would be cool if it could have some "glide" when the panels expand and collapse.
    Last edited by wozbk; 02-09-2006 at 11:22 PM.

  2. #2
    Senior Member
    Join Date
    Dec 2002
    Location
    Netherlands
    Posts
    1,632
    Hi there,

    Can you post a link to a site that has one ?
    I looked a bit around but if it's what I think it is, it looked terrible to me.
    Maybe I have a wrong idea about it.

    Wilbert

  3. #3
    theSWEEN thesween's Avatar
    Join Date
    Nov 2005
    Location
    Hertfordshire, England
    Posts
    305
    I'd also like to know how it looks. No exactly sure what it is?

  4. #4
    That web bloke Stoke Laurie's Avatar
    Join Date
    Jan 2006
    Location
    England
    Posts
    869
    The accordion component is new in Flash MX 2004 Professional. It contains a number of children movie clips, only one of which is displayed at a time. To navigate between each of these child movie clips the accordion component provides a header button for that child that the user clicks to view the child. The children can contain any information that you can have in a Flash movie clip – they can display text, images, movies of sections of a form that the user needs to fill out.
    Take a look here for more info
    http://www.dmxzone.com/ShowDetail.asp?NewsId=5648
    This illustrates the idea, this was built within KoolMoves, have a play let me know
    Attached Files Attached Files
    Last edited by Stoke Laurie; 02-10-2006 at 08:51 AM.

  5. #5
    Member
    Join Date
    Dec 2005
    Location
    Park Slope, Brooklyn
    Posts
    56

    Example of Accordion

    Quote Originally Posted by w.brants
    Hi there,

    Can you post a link to a site that has one ?
    I looked a bit around but if it's what I think it is, it looked terrible to me.
    Maybe I have a wrong idea about it.

    Wilbert
    Wilbert,
    Although this is a DOM JavaScript Version (which I have used) - the homepage navigation of which does more or less exactly the same thing as Flash Accordion Component so it should give you a good idea.

    I bet Stoke Laurie's example shows this "accordion concept" well too but I am on my Mac right now so I will have to wait till I boot up my Windows box a little later to check it out.

    Thanks for looking into this.
    Last edited by wozbk; 02-10-2006 at 01:31 PM.

  6. #6
    Member
    Join Date
    Dec 2005
    Location
    Park Slope, Brooklyn
    Posts
    56

    Stoke Laurie's Example Is Solid

    Quote Originally Posted by Stoke Laurie
    The accordion component is new in Flash MX 2004 Professional. It contains a number of children movie clips, only one of which is displayed at a time. To navigate between each of these child movie clips the accordion component provides a header button for that child that the user clicks to view the child. The children can contain any information that you can have in a Flash movie clip – they can display text, images, movies of sections of a form that the user needs to fill out.
    Take a look here for more info
    http://www.dmxzone.com/ShowDetail.asp?NewsId=5648
    This illustrates the idea, this was built within KoolMoves, have a play let me know
    Stoke Laurie,
    This is very close to what I was trying to describe (I just checked out the SWF on Mac/Firefox 1.5/Player 8).

    -----------

    Stoke Laurie and Wilbert,

    There are a few things I noticed with some of the DOM versions I have played with (I am more a HTML/XML/CSS/DOM handcoder than a Flasher or ActionScripter) and to some extent in your example I noticed the same issues, one where the bottom most nav parent pushes it's content below it rather than the "bar" sliding over and obscuring/hiding/covering the child content like on this Rico/Prototype Library Demo.

    The other thing I think is important is that the "container" or dimensions for the whole component need to be fixed (or at least have this be configurable) so that regardless of what state it is in it still takes up the same space (like in the Rico example) - if the child content was long it should get a scrollbar in it's content area - in an ideal world of course.

    There could be a much better way too - these are just my observations from trying to stick a similar component into a page totally laid out with CSS - I needed the "box" to fit into a fixed area in the layout and not bleed over.

    Stoke Laurie, I really appreciate the work you did and it is a great proof of concept for KoolMoves.
    Last edited by wozbk; 02-10-2006 at 05:26 PM.

  7. #7
    Senior Member
    Join Date
    Dec 2002
    Location
    Netherlands
    Posts
    1,632

    KoolMoves Accordion

    Example how it can be done (KoolMoves 5.1.8) ...
    http://www.waterlijn.info/km/accordion/

    I still don't know if such a thing is usefull.
    Attached Files Attached Files
    Last edited by w.brants; 02-11-2006 at 09:07 AM.

  8. #8
    Member
    Join Date
    Dec 2005
    Location
    Park Slope, Brooklyn
    Posts
    56

    Why an Accordion?

    Quote Originally Posted by w.brants
    Example how it can be done (KoolMoves 5.1.8) ...
    http://www.waterlijn.info/km/accordion/

    I still don't know if such a thing is usefull.
    Wilbert,

    That is really slick - I think when yout turn a series of DIV's into an accordion and consolidate the content like here - it makes more sense than just looking at a similar component regardless of if it is DOM or Flash/ActionScript based without context. It can be used as the navigation for a whole site - or allow the user to navigate a decent amount of content without the need to wait for another page to load (the accordion it it's DOM represention - with Flash this is far less an issue of course).

    Conceptually it is the evolution (though you may feel a devolution) of the tab concept that is used on Yahoo's hompage - and done with CSS/DOM you could easily turn your tabs into and accordian at a moments notice. For me it is about taking the structure of a well formed XML based document and being able to capitalize on it's orderly nodes to create UI elements without adding major overhead. That - too me - is very cool.

    I think what you've done is excellent. The persistent scrollbars (rather than appearing as needed like in CSS with #someDiv { overflow: auto; } was the only thing that wasn't spot on - I don't know if this is even possible, but I am sure you do. Maybe allowing the component to be tabs OR an accordion - that would make it even that much more useful. The accordion is the "flavor of the moment" in NYC - I wrote some AJAX for blackplanet.com and this widget was amongst the code that made it into the new dating app and jobs in partnership with monster. It a part of all the good AJAX libraries that the major players are using and is a part of Ruby's UI capabilities which lean on the Prototype.js.

    Thanks again for all your efforts. I was hoping that if you are happy with the finished component that it could be rolled into the product at some point.
    Last edited by wozbk; 02-11-2006 at 06:57 PM.

  9. #9
    Senior Member
    Join Date
    Dec 2002
    Location
    Netherlands
    Posts
    1,632
    Quote Originally Posted by wozbk
    Thanks again for all your efforts. I was hoping that if you are happy with the finished component that it could be rolled into the product at some point.
    This was mostly a demonstration to show it's possible. I used a dynamic textfield now for content but it would also be possible to use something else (for example a content pane) instead.

    If this is a feature request for KM, ask Bob.

  10. #10
    Member
    Join Date
    Dec 2005
    Location
    Park Slope, Brooklyn
    Posts
    56

    Gotcha...

    Quote Originally Posted by w.brants
    This was mostly a demonstration to show it's possible. I used a dynamic textfield now for content but it would also be possible to use something else (for example a content pane) instead.

    If this is a feature request for KM, ask Bob.
    Well it depends. I can and will put together something as a one-off (after taking a closer look at your prototype I am sure) - I thought it would be worthwile to have a UI component that can serve as out of the box navigation or as glorified "Tree" - a very common interface.

    I also wanted to show you this fully fleshed out weather widget using an accordian (you will need to enter a zip code to see it in action) - it appoximates the Flash that Open Lazlo can create but instead of XML that creates Flash it uses AJAX. It is a great example of when an accordion is the right UI element for the type of content being displayed and how that content is used, essentially creating a mini application.

    Perhaps I am the only one who thinks it is worthwile enough - also I thought you generally tried to keep up with Flash's components - obviously Macromedia (or Adobemac or Macradobe - whatever they are called now) thought the accordion worthwhile enough to include it in their flagship Flash product.

    Thanks again for looking into it at all. I appreciate your feedback and help a great deal.
    Last edited by wozbk; 02-11-2006 at 10:21 PM. Reason: Clarification

  11. #11
    Senior Member
    Join Date
    Dec 2002
    Location
    Netherlands
    Posts
    1,632
    Quote Originally Posted by wozbk
    Well it depends. I can and will put together something as a one-off (after taking a closer look at your prototype I am sure)
    Glad to hear that.

    Quote Originally Posted by wozbk
    Perhaps I am the only one who thinks it is worthwile enough - also I thought you generally tried to keep up with Flash's components - obviously Macromedia (or Adobemac or Macradobe - whatever they are called now) thought the accordion worthwhile enough to include it in their flagship Flash product.
    I'm not saying I don't think it's worthwhile. The difference is that MM has a team of professional programmers and a much larger user base. I'm not a programmer by profession. Besides that it doesn't only take my time but also time from Bob to integrate it into the gui. That's why I said you would have to ask Bob. He's the one that draws the roadmap for KM.

  12. #12
    Member
    Join Date
    Dec 2005
    Location
    Park Slope, Brooklyn
    Posts
    56

    Thanks Wilbert

    Quote Originally Posted by w.brants
    Glad to hear that.


    I'm not saying I don't think it's worthwhile. The difference is that MM has a team of professional programmers and a much larger user base. I'm not a programmer by profession. Besides that it doesn't only take my time but also time from Bob to integrate it into the gui. That's why I said you would have to ask Bob. He's the one that draws the roadmap for KM.
    I really appreciate your efforts and I understand the position you are in - you add a lot to the KM community and product.

    I will mention the accordion component to Bob - he seems pretty amenable to good ideas but I undertand if it doesn't make the grade or if he doesn't have time.

    Regards,
    John Woz

  13. #13
    Senior Member
    Join Date
    Dec 2002
    Location
    Netherlands
    Posts
    1,632
    Quote Originally Posted by wozbk
    I will mention the accordion component to Bob - he seems pretty amenable to good ideas but I undertand if it doesn't make the grade or if he doesn't have time.
    That's a good idea.

    A little remaining question just in case Bob decides the would like an implementation...
    How important is the animated aspect of it. Would it also be fine if it would jump right to the next state instead of with an animation ? Without an animation it would be easier to implement and cause less cpu load.

  14. #14
    Member
    Join Date
    Dec 2005
    Location
    Park Slope, Brooklyn
    Posts
    56

    Animation for the Accordion Component/Widget

    Quote Originally Posted by w.brants
    That's a good idea.

    A little remaining question just in case Bob decides the would like an implementation...
    How important is the animated aspect of it. Would it also be fine if it would jump right to the next state instead of with an animation ? Without an animation it would be easier to implement and cause less cpu load.
    A lot of UI elements are looking more and more like EA Playstation games, meaning that subtle animations seem to be becoming more and more the norm for user feedback and transitions.

    I realize it is more difficult but I think it is fairly important. Either way it would be cool to have but the more whizbang (within reason) the better.

    EDIT:
    Removed Example URL
    Last edited by wozbk; 02-14-2006 at 04:37 PM. Reason: Styled Widget Slightly For Better Presentability

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center