Flex BreadCrumb Navigator with Degrafa

I was able to catch a degrafa connect session last month in Denver and have been tinkering part time with the framework since then and I had a need to put together a bread crumb (like-ish) navigator so I decided try and use degrafa skinning to get a better look and feel, and it was surprisingly easy! Go Team.

At any rate, this was my first attempt at a BreadCrumbNavigator. I used ComboBox’s, because the lists are gonna have to be filter-able, but for now that code isn’t complete, yet. And also parts of the style is defined in the skins, so I’ll pull them out.

Here’s an example.  Here’s the code.

Learn about Degrafa here.

Tags: degrafa, breadcrumb, flex, component

Comments

[Juan Sanchez]

Nice example! You can also have multiple states in one skin:

[ More graphics here. ]

[ More graphics here. ]

And so on for other skin states. This will be changing a bit in Degrafa beta 3 to be a bit more like real Flex states and make it much easier to do transitions.

One thing I've been experimenting with is having all skins for a ScrollBar, for example, in one MXML file so you can create skins that interact with other skins within one component. For example, on a ScrollBar as a user drags the thumb up the upArrowSkin would illuminate and the same for dragging the thumb down.

Keep an eye out for some awesome stuff in Degrafa beta 3.

[Brian Holmes]

@juan,
Yeah, i figured there was a lot more I could do to make the code simpler. It was just a first pass. I was more interested in understanding how everything worked together and I think accomplished that.

[Wayne Posner]

Awesome example!!! Very cool. I need to do something very similar in a project I'm working on, as I don't want to use a tree control. Will this work with with a hierarchical ArrayCollection? Also, I'd be really interested in seeing your final code.

Thanks!
Wayne

[Brian Holmes]

@Wayne, Ideally it would work with a hierarchical ArrayCollection and XmlListCollection. This was just a first pass, I'll post a little more complete example soon though.

[Wayne Posner]

Hi Brian...

Any chance you can email me about this component. I'd really love to use it in an app I'm working on, but definitely need the hierarchical arraycollection support. Perhaps if you can guide me in whatever modifications need to be made, I can take a shot at implementing it and can then share the code with you?

Thanks!
Wayne

[Wayne Posner]

Hi Brian...

Well, actually, it wasn't so difficult to modify. I have it working so that you can specify the property name that would be associated with the "children" property of a hierarchical array collection. You also don't need the BreadCrumbItem object. I realize you were doing it to keep things type-safe, but definitely not necessary.

I tried posting the changes to your code, but for some reason, text keeps getting stripped out. Email me and I'll send you the changes I made.

Thanks!
Wayne

[Brian Holmes]

Hey wayne, that sounds great. I'll email you about it.

[codecraig]

Is there any update to the component? is the download for the code up-to-date with any changes mentioned in these comments?

Just curious b/c I'd like to use it as well.