You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@flex.apache.org by Chris Ellem <ch...@gmail.com> on 2015/03/18 02:38:58 UTC
weird Radio Button UI with mobile project using 4.14 SDK?
has anyone else seen this...?
the radio button UI is different..
<http://apache-flex-users.2333346.n4.nabble.com/file/n9808/weird_RB.png>
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.
Re: weird Radio Button UI with mobile project using 4.14 SDK?
Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Mar 17, 2015 7:41 PM, "Justin Mclean" <ju...@classsoftware.com> wrote:
>
> HI,
>
> Possibly a silly question (as I've been a bit out of the loop with the
mobile skins) but should t have the white ring around it? I would of
expected that to be transparent.
The outer white ring is part of the skin, so that's why it looks this way.
Thanks,
Om
>
> Thanks,
> Justin
Re: weird Radio Button UI with mobile project using 4.14 SDK?
Posted by Justin Mclean <ju...@classsoftware.com>.
HI,
Possibly a silly question (as I've been a bit out of the loop with the mobile skins) but should t have the white ring around it? I would of expected that to be transparent.
Thanks,
Justin
Re: weird Radio Button UI with mobile project using 4.14 SDK?
Posted by Chris Ellem <ch...@gmail.com>.
Thanks..
I will reference the old class..
s|RadioButton {
skinClass: ClassReference("spark.skins.mobile.RadioButtonSkin");
}
I already have a far superior looking custom Radio button component, but if
its not broken don't fix it.
Feel free to use my custom component...just replace the dynamic cairngorm
theme color references..
<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://
ns.adobe.com/flex/spark"
xmlns:fc="http://ns.adobe.com/flashcatalyst/2009"
width="99" height="24">
<fx:Script>
<![CDATA[
import com.client.model.ModelLocator;
[Bindable]private var modelLocator:ModelLocator =
ModelLocator.getInstance();
]]>
</fx:Script>
<fx:Metadata>
[HostComponent("spark.components.RadioButton")]
</fx:Metadata>
<s:states>
<s:State name="up" />
<s:State name="over" />
<s:State name="down" />
<s:State name="disabled" />
<s:State name="upAndSelected" />
<s:State name="overAndSelected" />
<s:State name="downAndSelected" />
<s:State name="disabledAndSelected" />
</s:states>
<!-- label -->
<s:RichText id="labelDisplay" left="50"
verticalAlign="middle"
verticalCenter="1" fontFamily="Arial"/>
<s:Ellipse x="2" y="-10" width="36" height="36">
<s:stroke>
<s:SolidColorStroke color="#999999"/>
</s:stroke>
<s:fill>
<s:LinearGradient rotation="90">
<s:GradientEntry alpha="1" color="#EEEEEE" ratio="0"/>
<s:GradientEntry alpha="1.0" color="#CCCCCC" ratio="1"/>
</s:LinearGradient>
</s:fill>
</s:Ellipse>
<s:Ellipse x="8" y="-4" width="24" height="24" alpha="0.4"
alpha.down="1"
alpha.downAndSelected="1"
alpha.over="1"
alpha.overAndSelected="1"
alpha.upAndSelected="1">
<s:stroke>
<s:SolidColorStroke caps="none" color="#CCCCCC" joints="miter"
miterLimit="4" weight="1"
color.upAndSelected="{modelLocator.theme_radio_button_color}"/>
</s:stroke>
<s:fill>
<s:LinearGradient rotation="90">
<s:GradientEntry alpha="1.0" color="#CCCCCC"
ratio="0.3215686274509804"
color.over="{modelLocator.theme_radio_button_color}"/>
<s:GradientEntry alpha="1.0" color="#FFFFFF"
ratio="0.6823529411764706"/>
</s:LinearGradient>
</s:fill>
<s:fill.over>
<s:SolidColor color="{modelLocator.theme_radio_button_color}"/>
</s:fill.over>
<s:fill.down>
<s:SolidColor color="{modelLocator.theme_radio_button_color}"/>
</s:fill.down>
<s:fill.upAndSelected>
<s:SolidColor color="{modelLocator.theme_radio_button_color}"/>
</s:fill.upAndSelected>
<s:fill.overAndSelected>
<s:SolidColor color="{modelLocator.theme_radio_button_color}"/>
</s:fill.overAndSelected>
<s:fill.downAndSelected>
<s:SolidColor color="{modelLocator.theme_radio_button_color}"/>
</s:fill.downAndSelected>
</s:Ellipse>
</s:Skin>
On Thu, Mar 19, 2015 at 1:02 AM, quick6black [via Apache Flex Users] <
ml-node+s2333346n9818h40@n4.nabble.com> wrote:
> You can use the old skin by using this in your css or reference your own
> radio button skin.
>
> @namespace "library://ns.adobe.com/flex/spark";
>
> RadioButton
> {
> skinClass: ClassReference("spark.skins.mobile.RadioButtonSkin");
> }
>
> I disagree that it is "so ugly" the intent of the skin is to replicate the
> Android 4x radio button. If you like the style of the Android 4x but do not
> like the white background ring you can change the background color by
> doing
>
> <s:RadioButton label="Radio" groupName="mygroup" chromeColor="#FF0000"/>
>
> I created a radio button that replicates the android material design which
> is similar to Om's Android 4x button. You can download here
>
> <https://github.com/quick6black/flex-Android-Material-Skins/blob/master/src/spark/skins/android5/RadioButtonSkin.as> and
> update your css using this
>
> RadioButton
> {
> skinClass: ClassReference("spark.skins.android5.RadioButtonSkin");
> backgroundAlpha: 0; /*background alpha*/
> chromeColor: #000000; /*background color*/
> selectColor: #009688;
> unselectColor: #6D6D6D;
> }
>
>
>
> ------------------------------
> If you reply to this email, your message will be added to the discussion
> below:
>
> http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808p9818.html
> To unsubscribe from weird Radio Button UI with mobile project using 4.14
> SDK?, click here
> <http://apache-flex-users.2333346.n4.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=9808&code=Y2hyaXNlbGxlbUBnbWFpbC5jb218OTgwOHwtMTAzMzgxOTA1MQ==>
> .
> NAML
> <http://apache-flex-users.2333346.n4.nabble.com/template/NamlServlet.jtp?macro=macro_viewer&id=instant_html%21nabble%3Aemail.naml&base=nabble.naml.namespaces.BasicNamespace-nabble.view.web.template.NabbleNamespace-nabble.view.web.template.NodeNamespace&breadcrumbs=notify_subscribers%21nabble%3Aemail.naml-instant_emails%21nabble%3Aemail.naml-send_instant_email%21nabble%3Aemail.naml>
>
--
Regards
Chris Ellem
Adobe Certified Expert - Flash & ColdFusion
[e] chrisellem@gmail.com
[m] 0431 194 234
[int] +61 431 194 234
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808p9826.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.
Re: weird Radio Button UI with mobile project using 4.14 SDK?
Posted by quick6black <an...@gmail.com>.
You can use the old skin by using this in your css or reference your own
radio button skin.
@namespace "library://ns.adobe.com/flex/spark";
RadioButton
{
skinClass: ClassReference("spark.skins.mobile.RadioButtonSkin");
}
I disagree that it is "so ugly" the intent of the skin is to replicate the
Android 4x radio button. If you like the style of the Android 4x but do not
like the white background ring you can change the background color by doing
<s:RadioButton label="Radio" groupName="mygroup" chromeColor="#FF0000"/>
I created a radio button that replicates the android material design which
is similar to Om's Android 4x button. You can download here
<https://github.com/quick6black/flex-Android-Material-Skins/blob/master/src/spark/skins/android5/RadioButtonSkin.as>
and update your css using this
RadioButton
{
skinClass: ClassReference("spark.skins.android5.RadioButtonSkin");
backgroundAlpha: 0; /*background alpha*/
chromeColor: #000000; /*background color*/
selectColor: #009688;
unselectColor: #6D6D6D;
}
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808p9818.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.
Re: weird Radio Button UI with mobile project using 4.14 SDK?
Posted by Chris Ellem <ch...@gmail.com>.
Ok thanks. My suggestion is to roll it back to the old one as the new one
is so ugly. Is the old skin still in the SDK? This has just crucified my
killer UI.
On 18/03/2015 12:35 PM, "OmPrakash Muppirala [via Apache Flex Users]" <
ml-node+s2333346n9810h92@n4.nabble.com> wrote:
> That's the new skin for the mobile radio button. So yes, it is expected
> behavior :-)
>
> Thanks,
> Om
> On Mar 17, 2015 7:21 PM, "Chris Ellem" <[hidden email]
> <http:///user/SendEmail.jtp?type=node&node=9810&i=0>> wrote:
>
> > has anyone else seen this...?
> >
> > the radio button UI is different..
> > <http://apache-flex-users.2333346.n4.nabble.com/file/n9808/weird_RB.png>
>
> >
> >
> >
> > --
> > View this message in context:
> >
> http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808.html
> > Sent from the Apache Flex Users mailing list archive at Nabble.com.
> >
>
>
> ------------------------------
> If you reply to this email, your message will be added to the discussion
> below:
>
> http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808p9810.html
> To unsubscribe from weird Radio Button UI with mobile project using 4.14
> SDK?, click here
> <http://apache-flex-users.2333346.n4.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=9808&code=Y2hyaXNlbGxlbUBnbWFpbC5jb218OTgwOHwtMTAzMzgxOTA1MQ==>
> .
> NAML
> <http://apache-flex-users.2333346.n4.nabble.com/template/NamlServlet.jtp?macro=macro_viewer&id=instant_html%21nabble%3Aemail.naml&base=nabble.naml.namespaces.BasicNamespace-nabble.view.web.template.NabbleNamespace-nabble.view.web.template.NodeNamespace&breadcrumbs=notify_subscribers%21nabble%3Aemail.naml-instant_emails%21nabble%3Aemail.naml-send_instant_email%21nabble%3Aemail.naml>
>
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808p9813.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.
Re: weird Radio Button UI with mobile project using 4.14 SDK?
Posted by OmPrakash Muppirala <bi...@gmail.com>.
That's the new skin for the mobile radio button. So yes, it is expected
behavior :-)
Thanks,
Om
On Mar 17, 2015 7:21 PM, "Chris Ellem" <ch...@gmail.com> wrote:
> has anyone else seen this...?
>
> the radio button UI is different..
> <http://apache-flex-users.2333346.n4.nabble.com/file/n9808/weird_RB.png>
>
>
>
> --
> View this message in context:
> http://apache-flex-users.2333346.n4.nabble.com/weird-Radio-Button-UI-with-mobile-project-using-4-14-SDK-tp9808.html
> Sent from the Apache Flex Users mailing list archive at Nabble.com.
>