Discussion

1. Samuel BatistaSeptember 19, 2012 at 7:59 pm

   It seems this UI framework is really making significant strides.

2. Philip BulleySeptember 20, 2012 at 1:16 am

   Love the new UI site, looks very promising. Haven’t had a chance yet to compile tests for Android/iOS. Still think it would be a great move to publish a Feathers Component Explorer app on each platform, especially now with the new nicely packaged branding 🙂 This would be far more useful than the web demo (seeing as most people are probably going to use Feathers on devices anyway). Great work!

   By the way, are you really a karaoke addict? If so, we should most definitely have a chat!

3. Josh TynjalaSeptember 20, 2012 at 7:22 am

   Yes, some kind of published app to demo Feathers components on devices is something I will consider. Probably after 1.0. Also yes, I really am a karaoke addict. I sing twice a week, most of the time. Sometimes more.

4. RodjakSeptember 20, 2012 at 3:30 pm

   Great components.
   Can you explain how to add scrollbar to List and apply custom skin?

5. Josh TynjalaSeptember 20, 2012 at 4:31 pm

   A scroll bar is created automatically, but it won’t be skinned. There are a couple of different ways to skin the scroll bars.

   First, you could go down the properties chain using the @ syntax that I’ve provided for that:

   list.scrollerProperties.@verticalScrollBarProperties.@thumbProperties.defaultSkin = new Image( texture );

   Instead, you might create a custom scroll bar factory:

   list.scrollerProperties.verticalScrollBarFactory = function():SimpleScrollBar
   {
       var scrollBar:SimpleScrollBar = new SimpleScrollBar();
       scrollBar.thumbProperties.defaultSkin = new Image( texture );
       return scrollBar;
   }

   If you want a more desktop-like scroll bar, you could use the ScrollBar class instead of SimpleScrollBar.

6. FlorianOctober 8, 2012 at 3:08 am

   Hi Josh,

   I tried the above code to add a SimpleScrollBar to my ScrollContainer but it appears on the right side, half hidden by the items, and it doesn’t move up/down. It only appears/disappears on touch down/up.

   Any suggestion? I can’t find any documentation about that.

   Thank you!

   Regards

7. Josh TynjalaOctober 8, 2012 at 9:03 am

   The default behavior for a scroll bar is for a mobile device. If you want interaction more like desktop where you can actually use the scroll bar with your mouse, you need to set the interactionMode on the Scroller to Scroller.INTERACTION_MODE_MOUSE. You might also want to change the scrollBarDisplayMode. The default is Scroller.SCROLL_BAR_DISPLAY_MODE_FLOAT, which places the scroll bar floating above the content in the scroller.

8. FlorianOctober 8, 2012 at 9:51 am

   Hi Josh,

   Thank you for the fast answer.
   I’m working on mobile so I need the default state.

   Here is the texture:
   http://dl.dropbox.com/u/10483409/Flo/scrollbar/snapshot.png

   And here is the result when I scroll (you can see a 1 px line on the right):
   http://dl.dropbox.com/u/10483409/Flo/scrollbar/0_listScrollbar.png

   Thanks for your feedback.

9. Josh TynjalaOctober 8, 2012 at 10:15 am

   What does your code look like? I don’t know why the scroll bar would appear as a 1 pixel line.

10. FlorianOctober 8, 2012 at 9:51 pm

    starling = new Starling( App, stage, new Rectangle( 0, 0, stage.fullScreenWidth, stage.fullScreenHeight ), null, "auto", "baseline" );
    starling.stage.stageWidth  = 320;
    starling.stage.stageHeight = 480;
    starling.simulateMultitouch = true;
    starling.enableErrorChecking = false;
    starling.start();
    

    _resultContainer = new ScrollContainer();
    _resultContainer.layout = new VerticalLayout();
    _resultContainer.scrollerProperties.verticalScrollPolicy = Scroller.SCROLL_POLICY_ON;
    _resultContainer.scrollerProperties.snapScrollPositionsToPixels = true;
    _resultContainer.maxHeight = 560;
    _resultContainer.onScroll.add( onContainerScroll );
    _resultContainer.addEventListener( TouchEvent.TOUCH, resultContainerTouchHandler );	
    _resultContainer.scrollerProperties.verticalScrollBarFactory = function():SimpleScrollBar
    {
    	var scrollBar:SimpleScrollBar = new SimpleScrollBar();
    	scrollBar.thumbProperties.defaultSkin = new Image( TextureFactory.getTexture( TexturesList.COM_LISTSCROLLBAR ) );
    	return scrollBar;
    }
    

11. Michael SchmalleOctober 11, 2012 at 5:49 am

    Hey Josh,

    We met back in 2005 at the Adobe component dev summit, I have followed you doing yahoo and all that component stuff. It’s great to see you doing this component framework.

    I had to laugh at your statement of;

    ”
    It’s been so long since I was excited about my work like this, and I love that I’m returning to component development with such enthusiasm.
    ”
    I to fell off the train last year with component dev, but I have an Android mobile project I’m working on that I was considering doing all the UI in Java Android. I have been stalling by investigating all the new stuff that might becoming out of the Flash genre since I love ActionScript.

    Long story short, I think you have convinced me to put my effort here with the Android Caustic Audio framework and it’s UI.

    See; http://blog.teotigraphix.com/2012/08/23/caustic-toolkit-android-apache-flex-audio-synth-sequencer-framework/

    Flex was just getting to heavy for what I wanted to do. I’ll let you know what I come up with.

    Thanks for your components!

    Mike

12. Josh TynjalaOctober 11, 2012 at 8:49 am

    Thanks, Mike. I remember meeting you at the component dev summit, and I check in on your components from time to time to see what’s new. I always admired the fact that you went commercial with them. I’m partial to open source, but the thought was always in the back of my mind that it would be interesting to try some commercial components. Anyway, looking forward to seeing what you come up with.

13. Michael SchmalleOctober 11, 2012 at 11:33 am

    Yeah, well I’m out of the commercial components for the most part, haven’t really switched my site over.

    Basically I’m partial to open-source now as well since last November. 🙂

    I just got the component explorer running in the FlashBuilder beta and on my tablet, very impressive!

    I really have decided to grab onto this framework and see what I can do. Besides, the audio framework I’m working on with the developer of Caustic is very fun if your into sequencers and synths.

    Plus the fact that Flash is so artistic, I figure that allowing this on AIR first would be fun and I might get some interest From the Flash community. All my stuff will be opensource with this (Android).

    The only component I need to make right now is a dial/knob implementation.

14. Loc LuuOctober 22, 2012 at 10:09 am

    Hi Josh,
    Can i set the button’s states with new Image like doing with the Starling default button?
    I have tried to change skins (defaultSkin, upSkin…) but unsuccessful.

15. Josh TynjalaOctober 22, 2012 at 11:19 am

    Yes, you can use Images for a button’s skin states. defaultSkin, upSkin, downSkin, etc. are what you should use, as you guessed. I’m not sure what you could have done wrong, though. Take a look at the Getting Started with Feathers tutorial. Maybe you can figure it out from reading that one.

16. Loc LuuOctober 22, 2012 at 9:09 pm

    Maybe i have not used setInitializerForClass() function.
    Is it always need to use this function for customize skins?

17. Josh TynjalaOctober 22, 2012 at 9:44 pm

    Are you using a theme? If so, and you want to customize a specific button, then yes, you need to extend the theme.

    If you’re not using a theme, then no, you shouldn’t need to use setInitializerForClass().

18. Loc LuuOctober 22, 2012 at 10:03 pm

    yes, thank you very much 😀