RealyUniqueName / StablexUI

UI engine for Haxe OpenFL designed to give as much freedom as possible in customizing UI
http://ui.stablex.ru/doc
Other
337 stars 80 forks source link

How to access Toggle buttons in box of options? #109

Open hopewise opened 10 years ago

hopewise commented 10 years ago

I need to access the toggle buttons of options, I did the default of options widget:

on-create="PropsBinder.setOptionColors($this);"
on-display="PropsBinder.setOptionColors($this);"

then, each time setOptionColors is called, box:

static public function setOptionColors(aOptions:Options):Void
{
    aOptions.box.numChildren always zero

    .
    .
}

What I need is to access each toggle to change its color, as I am trying to create a color picker..

Please help!

hopewise commented 10 years ago

I solved it by creating custom class, as I am trying to build a color picker:

class ColorPicker extends Options
{

public function new() 
{
    super();

}

override private function _buildList():Void 
{
    super._buildList();

    for(i in 0...this.options.length){
        var toggle:Toggle = cast(this.box.getChildAt(i), Toggle);
        toggle.graphics.beginFill(options[i][1]);
        toggle.graphics.drawRect(0, 0, toggle.w, toggle.h);
        toggle.graphics.endFill();
    }

}
override private function set__selectedIdx(idx:Int):Int 
{
    return super.set__selectedIdx(idx);
    this.skin.as(Paint).color = options[idx][1];
}

}

But, when selecting, how can I change color of skin? please see how I tried to do it at: set__selectedIdx above but, it didn't work .. always showing the same color of skin applied by defaults, can't I change the color of an attached skin?

RealyUniqueName commented 10 years ago

Hi! Try adding this.applySkin(); to the end of your set__selectIdx().

hopewise commented 10 years ago

Thank you ) I have a nice color picker now! I also changed the color of the circle and triangle inside it ( the ico ) by assigning it a filter of ColorMatrixFilter with a darker color of current selected color, it looks very nice : )

Would you like me to fork the library and add my color picker? : )

Have a look:

image

RealyUniqueName commented 10 years ago

Do circle and triangle look the same for cpp target as for flash target?

hopewise commented 10 years ago

Yes, I've tested it at windows, and it looks the same, but, I changed it to drop shadow instead of color matrix, as it will not be visible at dark colors, as I always choose darker color..

I think there should be a smart way to calculate a high contrast color for the selected color, so that triangle and circle always visible ..

Both drop shadow and color matrix works well at CPP targets.. ( tested on android and windows )

hopewise commented 10 years ago

Dropping black shadow without anything else looks very good: image