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_d_k <ck...@christiankiefer.de> on 2014/12/01 15:34:03 UTC

What is the best way to show html-formatted text in a flex mobile app?

I just want to display a text with some bold or colored words in an
itemRenderer. What is the best way (performance, ...) to achive this?

Best regards

Christian



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: What is the best way to show html-formatted text in a flex mobile app?

Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Tue, Dec 2, 2014 at 5:47 AM, chris_d_k <ck...@christiankiefer.de> wrote:

> Thanks for the great responses... But one question left...
>
> Aren't there problems with performance when using a RichText in a Mobile
> Air
> App? I remember Adobe warned to use it in Mobile Apps. Has something
> changed
> ...
>

I have used it in mobile apps.  I haven't seen real performance problems.

Thanks,
Om


>
> Thanks
>
> Christian
>
>
>
> --
> View this message in context:
> http://apache-flex-users.2333346.n4.nabble.com/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917p8941.html
> Sent from the Apache Flex Users mailing list archive at Nabble.com.
>

Re: What is the best way to show html-formatted text in a flex mobile app?

Posted by chris_d_k <ck...@christiankiefer.de>.
Thanks for the great responses... But one question left...

Aren't there problems with performance when using a RichText in a Mobile Air
App? I remember Adobe warned to use it in Mobile Apps. Has something changed
...

Thanks

Christian



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917p8941.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: What is the best way to show html-formatted text in a flex mobile app?

Posted by OmPrakash Muppirala <bi...@gmail.com>.
I responded to a similar question a while ago.  Something similar to what
Jude has explained above:
http://apache-flex-users.2333346.n4.nabble.com/Style-First-Word-of-List-Items-Differently-tp8361p8365.html

Thanks,
Om

On Mon, Dec 1, 2014 at 12:20 PM, jude <fl...@gmail.com> wrote:

> You might be able to reuse the LabelItemRenderer renderer and substitute in
> the old text field and set it's htmlText property rather than the text
> property. That might be the fastest but a lot more work if it uses Spark or
> FTE API methods.
>
> You could create an item renderer with the old text field and set it's
> htmlText property. Something like,
>
>
> <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
>     xmlns:s="library://ns.adobe.com/flex/spark"
>     xmlns:mx="library://ns.adobe.com/flex/mx"
> creationComplete="addComponents()">
>
>     <fx:Script>
>         <![CDATA[
>
>
>             public var textField:TextField;
>             public function addComponents():void {
>                 textField = new TextField();
>                 addElement(textField);
>             }
>
>             override public function set data(value:Object):void {
>
>                 textField.htmlText = String(value);
>             }
>         ]]>
>     </fx:Script>
>
> </s:ItemRenderer>
>
> The above is pseudo code so it will need to be tweaked.
>
> You could also use a RichText and use a TextFlow or use the HTML
> importer class.
>
> <?xml version="1.0" encoding="utf-8"?>
> <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
>     xmlns:s="library://ns.adobe.com/flex/spark"
>     xmlns:mx="library://ns.adobe.com/flex/mx">
>
>     <fx:Script>
>         <![CDATA[
>
>             override public function set data(value:Object):void {
>                 //super.label = value;
>                 if (value is TextFlow) {
>                    labelDisplay.textFlow = value as TextFlow; }
>                 else if (value is String) { // import HTML markup
>                    labelDisplay.textFlow =
> HTMLImporter.importToFlow(value); }
>         ]]>
>     </fx:Script>
>
>     <s:states>
>         <s:State name="normal"/>
>         <s:State name="hovered"/>
>         <s:State name="selected"/>
>     </s:states>
>
>     <s:Rect left="0" right="0" top="0" bottom="0">
>         <s:stroke.selected>
>             <s:SolidColorStroke
>                 color="0x000000"
>                 weight="1"/>
>         </s:stroke.selected>
>         <s:fill>
>             <s:SolidColor
>                 color.normal="0xFFFFFF"
>                 color.hovered="0xCEDBEF"
>                 color.selected="0x00FF00"/>
>         </s:fill>
>     </s:Rect>
>     <s:RichText id="labelDisplay"
>         fontWeight.selected="bold"
>         verticalCenter="0"
>         left="3" right="3"
>         top="6" bottom="4"/>
> </s:ItemRenderer>
>
> The code above is also pseudo code.
>
>
> On Mon, Dec 1, 2014 at 6:36 AM, pkumar.flex <pr...@gmail.com> wrote:
>
> > Check for textflow
> > On Dec 1, 2014 8:11 PM, "chris_d_k [via Apache Flex Users]" <
> > ml-node+s2333346n8917h12@n4.nabble.com> wrote:
> >
> > > I just want to display a text with some bold or colored words in an
> > > itemRenderer. What is the best way (performance, ...) to achive this?
> > >
> > > Best regards
> > >
> > > Christian
> > >
> > > ------------------------------
> > >  If you reply to this email, your message will be added to the
> discussion
> > > below:
> > >
> > >
> >
> http://apache-flex-users.2333346.n4.nabble.com/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917.html
> > >  To unsubscribe from Apache Flex Users, click here
> > > <
> >
> http://apache-flex-users.2333346.n4.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=1&code=cHJhc2hha3VtYXJAZ21haWwuY29tfDF8LTU0MTcyMzE2NA==
> > >
> > > .
> > > 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/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917p8918.html
> > Sent from the Apache Flex Users mailing list archive at Nabble.com.
> >
>

Re: What is the best way to show html-formatted text in a flex mobile app?

Posted by jude <fl...@gmail.com>.
You might be able to reuse the LabelItemRenderer renderer and substitute in
the old text field and set it's htmlText property rather than the text
property. That might be the fastest but a lot more work if it uses Spark or
FTE API methods.

You could create an item renderer with the old text field and set it's
htmlText property. Something like,


<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/mx"
creationComplete="addComponents()">

    <fx:Script>
        <![CDATA[


            public var textField:TextField;
            public function addComponents():void {
                textField = new TextField();
                addElement(textField);
            }

            override public function set data(value:Object):void {

                textField.htmlText = String(value);
            }
        ]]>
    </fx:Script>

</s:ItemRenderer>

The above is pseudo code so it will need to be tweaked.

You could also use a RichText and use a TextFlow or use the HTML
importer class.

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/mx">

    <fx:Script>
        <![CDATA[

            override public function set data(value:Object):void {
                //super.label = value;
                if (value is TextFlow) {
                   labelDisplay.textFlow = value as TextFlow; }
                else if (value is String) { // import HTML markup
                   labelDisplay.textFlow = HTMLImporter.importToFlow(value); }
        ]]>
    </fx:Script>

    <s:states>
        <s:State name="normal"/>
        <s:State name="hovered"/>
        <s:State name="selected"/>
    </s:states>

    <s:Rect left="0" right="0" top="0" bottom="0">
        <s:stroke.selected>
            <s:SolidColorStroke
                color="0x000000"
                weight="1"/>
        </s:stroke.selected>
        <s:fill>
            <s:SolidColor
                color.normal="0xFFFFFF"
                color.hovered="0xCEDBEF"
                color.selected="0x00FF00"/>
        </s:fill>
    </s:Rect>
    <s:RichText id="labelDisplay"
        fontWeight.selected="bold"
        verticalCenter="0"
        left="3" right="3"
        top="6" bottom="4"/>
</s:ItemRenderer>

The code above is also pseudo code.


On Mon, Dec 1, 2014 at 6:36 AM, pkumar.flex <pr...@gmail.com> wrote:

> Check for textflow
> On Dec 1, 2014 8:11 PM, "chris_d_k [via Apache Flex Users]" <
> ml-node+s2333346n8917h12@n4.nabble.com> wrote:
>
> > I just want to display a text with some bold or colored words in an
> > itemRenderer. What is the best way (performance, ...) to achive this?
> >
> > Best regards
> >
> > Christian
> >
> > ------------------------------
> >  If you reply to this email, your message will be added to the discussion
> > below:
> >
> >
> http://apache-flex-users.2333346.n4.nabble.com/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917.html
> >  To unsubscribe from Apache Flex Users, click here
> > <
> http://apache-flex-users.2333346.n4.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=1&code=cHJhc2hha3VtYXJAZ21haWwuY29tfDF8LTU0MTcyMzE2NA==
> >
> > .
> > 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/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917p8918.html
> Sent from the Apache Flex Users mailing list archive at Nabble.com.
>

Re: What is the best way to show html-formatted text in a flex mobile app?

Posted by "pkumar.flex" <pr...@gmail.com>.
Check for textflow
On Dec 1, 2014 8:11 PM, "chris_d_k [via Apache Flex Users]" <
ml-node+s2333346n8917h12@n4.nabble.com> wrote:

> I just want to display a text with some bold or colored words in an
> itemRenderer. What is the best way (performance, ...) to achive this?
>
> Best regards
>
> Christian
>
> ------------------------------
>  If you reply to this email, your message will be added to the discussion
> below:
>
> http://apache-flex-users.2333346.n4.nabble.com/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917.html
>  To unsubscribe from Apache Flex Users, click here
> <http://apache-flex-users.2333346.n4.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=1&code=cHJhc2hha3VtYXJAZ21haWwuY29tfDF8LTU0MTcyMzE2NA==>
> .
> 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/What-is-the-best-way-to-show-html-formatted-text-in-a-flex-mobile-app-tp8917p8918.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.