Published by Administrator on 05 Jul 2007 at 07:34 am
Flex Components Page
For questions/requests/bugs - post a comment at the bottom of the appropriate tutorial page.
Preloading Image
The Preloading Image is an Adobe Flex (2.0+) component. It is a mx.controls.Image subclass that adds graphical preloading display. You can use included preloaders or create your own.
Its free unders the Artistic license.
1. select preloader on the right
2. swap images in combo to see it in action (clear cache if its download becomes too fast).
Mask Image
The Mask Image is an Adobe Flex (2.0+) component, which moves a mask “window”
over an image following user mouse movements.
Its free unders the Artistic license.
- download
- quick start
- right click -> view source (on application below)
HSmoothBox
The HSmoothBox is an Adobe Flex (2.0+) HBox like component, which has animated smooth scrolling.
Smooth scrolling can be done with or without the blur effect.
Its free unders the Artistic license.
- download
- quick start
- right click -> view source (on application below)
VSmoothBox
The HSmoothBox is an Adobe Flex (2.0+) VBox like component, which has animated smooth scrolling.
Smooth scrolling can be done with or without the blur effect.
Its free unders the Artistic license.
- download
- quick start
- right click -> view source (on application below)
This page has the following sub pages.
Arzath on 14 Jan 2008 at 5:15 pm #
Hey, can’t believe such a great site of yours still got no comment yet.
Your stuffs are AWESOME!
Oscar on 29 Jan 2008 at 8:12 pm #
hey, nice work. all your components lokk great!!
are you planning to update your work to flex 3?
thanks for sharring!!
Administrator on 30 Jan 2008 at 8:39 am #
Thanks,
Planning to re compile them with the flex 3 sdk, soon. Should be straight forward.
I’ll notify you when I do.
Cheers
Dakshika on 04 Feb 2008 at 2:45 pm #
Such a great thing ….
Thanks
Dimitar G. on 20 Feb 2008 at 10:12 pm #
VSmoothBox and HSmoothBox are quite appealing.
I have couple of questions though. Please drop me a line at my email.
Anthony on 05 Mar 2008 at 7:54 pm #
SmoothBox = Nice job!!! I was looking for something like this for days. I was wondering if anyone has done this same thing but added an “iPhone” like drag to control the scrolling.
Well done man. Wicked cool.
Administrator on 06 Mar 2008 at 7:26 am #
stay tuned, a much improved version coming out in a week or so.
BigVirgil on 14 Mar 2008 at 11:37 am #
Hi, I’ve downloaded the HSmoothBox and VSmoothBox and tried and had a look at the source, but obviously some assets are missing:
[Embed(source=”../resource/arrowsd.png”)] among others…
Administrator on 14 Mar 2008 at 3:50 pm #
Sorry about that, forgot to add the resource pics to the distribution.
Download again and it should be fine.
Vipin on 11 Jun 2008 at 11:36 pm #
Hi,
I have downloaded and checking the component. I am trying to add childs dynamically using dataProvider. It does not work for me. I checked the source and found that ‘_initialCommitPropertiesDone’ is false and not building the childs from dataProvider.
Here is my MXML:
Here is my code which sets the dataProvider:
private function xmlLoadResult(e:ResultEvent):void
{
xmlCurrentBook = e.result as XML;
currentPageList = xmlCurrentBook.book.pages.page.(@visible==”true”);
currentPageListCol = new XMLListCollection(currentPageList);
book.dataProvider = currentPageListCol;
}
What could be wrong here?
Vipin on 11 Jun 2008 at 11:38 pm #
Sorry the MXML tag didnt come up in the post: let me try this.
<containerEx:VSmoothBox id=”book” borderStyle=”solid” width=”200″ height=”300″ itemRenderer=”BookPage”
itemHeight=”200″ itemWidth=”100″ verticalScrollPolicy=”on” />
Administrator on 12 Jun 2008 at 11:30 am #
Hi,
I think I see what might be causing the problem, the _initialCommitPropertiesDone flag should be lit in the commitProperties, regardless of the dataProvider existence.
For now, you could work around this by setting a dummy dataProvider (empty ArrayCollection or something, define it with binding) and replace it when your service result is in.
I will fix this in the next release.
Cheers
Vipin on 12 Jun 2008 at 12:17 pm #
Thank you. Its a great component… thanks for getting this…
Vipin
Vipin on 12 Jun 2008 at 12:35 pm #
I was able to load images. But when I try scrolling, I am getting a runtime error:
Error: out of bounds for scroll: 1
at containerEx::SmoothScrollerCore/scrollToItemIndex()[C:\Documents and Settings\Administrator\My Documents\Flex Builder 3\CatWidget\src\containerEx\SmoothScrollerCore.as:262]
at containerEx::SmoothBoxUI/onScroll()[C:\Documents and Settings\Administrator\My Documents\Flex Builder 3\CatWidget\src\containerEx\SmoothBoxUI.mxml:553]
Any reason for this?
Vipin
Administrator on 12 Jun 2008 at 1:25 pm #
Not sure about that one, what version do you have?
Lets take this offline, reply to the email I sent you and please send me the relevant code you are using if you can. I’ll try to get to it today or tomorrow.
Brian on 17 Jun 2008 at 9:57 pm #
@Vilpin
That happens for me when I don’t explicitly set a width/height on the child objects (itemWidth/itemHeight don’t seem to work for me).
@Administrator
Love the component. Tried making my own one day, but no where as nice as this!
I could use some help though… I’ve noticed an issue when using the component with states. For example, think of an app with two states, each with a different HSmoothBox (with different data, etc). I can load each state once, but if I try to go back to one that was already viewed, it crashes with “RangeError: Error #2006: The supplied index is out of bounds.”
It appears to be crashing in the function “commitProperties” on the “itemContainer.addChild(child);” line. I’ve been trying to debug the error to find out where it is going wrong, but cannot figure it out.
Any ideas? If you would like, I can put together a small example for you.
Brian
Brian on 17 Jun 2008 at 10:05 pm #
I think I might have figured it out…
##function commitProperties##
if( _childrenChanged )
{
itemContainer.removeAllChildren(); <—- ADDED THIS
for each( var child:DisplayObject in _children )
{
itemContainer.addChild(child);
}
}
I no longer crash
Is this the right approach though? I’m still very early with custom component development.
Administrator on 19 Jun 2008 at 5:10 am #
Hi Brian, [DefaultProperty(”children”)] ). So I actually override the parent children and save my own.
Interesting about the states, I am not sure about this fix. Seems ok on first sight, but I do need to check what the _children list holds. If it always holds all children then the fix is fine. I use a patteren I found on some post on how to create mxml components that can act as containers (using the
Regarding the post by Vipin, There was a bug using the dataProvider itemRenderer pattern at runtime. I fixed it and release a new version so 1.3.4 was released. Please see the download page If you don’t have that version.
In any case, I am on vacation and will be back in about a week so I’ll look at it then and get back to you. I would appreciate you sending me a sample of the code that uses the component.
Thanks for the info
Felipe Almeida on 24 Jun 2008 at 1:25 am #
How do i can view the source code of the samples above?
Administrator on 24 Jun 2008 at 6:51 am #
Haven’t got around to adding the view source option to the samples, It’s on my todo list. For now please check out the readme/quick start files attached.
Cheers
Vipin on 24 Jun 2008 at 10:12 am #
Thaks mate for the latest version.
Pythagoras on 01 Jul 2008 at 5:51 pm #
It seems that the SmoothVBox does not work when you populate it with the repeater component…
The following results in a blank page (works with VBox though):
Pythagoras on 01 Jul 2008 at 5:55 pm #
sorry, my code didn’t come through, here’s another try:
Administrator on 02 Jul 2008 at 4:20 pm #
Thanks for the info, I actually never use repeaters so I never tested it
or intended for it. I will try to look at it as soon as I can.
Posting code does not work too well here. I will send you and email so you can reply the code.
Cheers.
Krittiya on 09 Jul 2008 at 10:49 pm #
When I hold the mouse down at the scrollbar’s track, the scrollbar’s thumb will step continuously until it reaches the mouse position. After that, if I click at the scrollbar’s track (and this time ..not hold the mouse down), I notice that the thumb also moves like when the mouse was hold down and it doesn’t step per item anymore. Is this a bug?
Thanks again SP for sharing this awesome component
Administrator on 10 Jul 2008 at 6:51 am #
Sounds like a bug, I couldn’t get it to reproduce on the examples above, maybe more items are needed. I will test this soon and add it to my todo list.
Thanks for the info.
Dpatrick on 11 Jul 2008 at 8:43 pm #
Can I apply this to a list control ? If so how?
Administrator on 12 Jul 2008 at 3:55 pm #
Sorry, can you please elaborate on the quesiton? apply what to a list control?
Dpatrick on 13 Jul 2008 at 6:58 pm #
Sorry, for the lack of detail in my earlier post but I wanted to know if the SmoothVBox component could be extended and used in a list control for the selectedItem method. Or can you point me in the right direction to be able to add this method, if you could it would be great. Also I really appreciate your time for responding and creating these awesome components.
Administrator on 14 Jul 2008 at 6:55 am #
As you probably know, I did not implement any kind of selection mechanism into the SmoothBox classes. At first glance to add this kind of functionality would require hooking to clicks of item renderers in the addScrollChild() method and implementing a single selection (or multiple) behavior on the dataProvider. I’ll will add it as an option for a future release. In the mean time, one option you might be able to do is mark a “selected” attribute on the data of the renderer when you need to, and via event or binding have something go over all the dataProvider to unSelect all the other items.
Hope this helps.
Cheers.
borf gordon on 22 Aug 2008 at 5:09 pm #
Hi,
Great component, thanks. Is there a way to enable the user “dragging” in the list to go left or right?
Administrator on 24 Aug 2008 at 7:07 am #
I implemented a “dragging” behavior in the FlexWheel component (based on the VSmoothBox), but not in the containers on this page. I might add it in a future version.
Cheers.
flysnail on 02 Sep 2008 at 7:30 am #
Hi
Great component,I have some question to consult with you,how to define Preloading component ,and use it when page first initialize and loading. the Preloading component like wheel round.
Administrator on 02 Sep 2008 at 7:39 pm #
Can you elaborate? sorry but I didn’t fully understand the question. Did you look at the tutorial, or the sources of the sample above (right click -> view source)?