Changing text style dynamically in flex

Posted on 2009-07-13
Last Modified: 2012-05-07
I am working with flex piece of code there i want to change the text label style dynamically by taking the input from the user.
Question by:sandeep_manne
  • 2
LVL 37

Accepted Solution

zzynx earned 500 total points
ID: 24858033
Hi sandeep,
I took the Label example from the Flex documentation and extended it with an extra button "Click to change the style dynamically".
Fill in a (valid) color and press the button.
<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="">

<!-- Simple example to demonstrate the Label control -->




            private var htmlData:String="<br>This label displays <b>bold</b> and <i>italic</i> HTML-formatted text.";


            // Event handler function to change the image size.

            private function displayHTML():void {

                simpleLabel.htmlText= htmlData;



            // Event handler function to change the image size.

            private function displayText():void {

                simpleLabel.text="This Label displays plain text.";



            private function changeStyle():void {

            	simpleLabel.setStyle("color", "0x"+color.text); // Red




  <mx:Panel title="Label Control Example" height="75%" width="75%" 

      paddingTop="10" paddingLeft="10">


      <mx:Label id="simpleLabel" text="This Label displays plain text."/>

      <mx:Button id="Display" label="Click to display HTML Text" click="displayHTML();"/>

      <mx:Button id="Clear" label="Click to display plain text" click="displayText();"/>


        <mx:Label text="Color of the text in hex (ex. FF0000 for red):"/>

        <mx:TextInput id="color"/>

      	<mx:Button id="Style" label="Click to change the style dynamically" click="changeStyle();"/>






Open in new window

LVL 37

Expert Comment

ID: 24858441
Thanx 4 axxepting

Featured Post

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When deciding to adopt any help desk solutions many factors should be explored before taking decisions. This will change from business to another but in general there are some kind of rule of thumb. Here are some quick tips: Do we need only ticket…
First things first - Preparation We need all the part for this install and it's much nicer to have them all on hand when you need them so here's what's required. Download Eclipse 3.5 32 bit (I like the Classic flavour) from here. (http://www.e…
The purpose of this video is to demonstrate how to reset a WordPress password if you are locked out and cannot reset the password. A typical use would be if you cannot access the email to which WordPress would send the password recovery email to…
The purpose of this video is to demonstrate how to set up basic WordPress SEO. This will be demonstrated using a Windows 8 PC. The plugin used will be WordPress SEO by Yoast. Go to your WordPress login page. This will look like the following: myw…

896 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now