[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now

x
?
Solved

Dynamic color on xml driven datagrid

Posted on 2006-11-06
7
Medium Priority
?
673 Views
Last Modified: 2012-05-05
Hi professionals.

I have a flash datagrid, that is XML driven, and uses a XML connector and a dataset.
This grid is displaying a price list.

I have been caught in a deadlock regarding how to dynamically set the color for sold objects red.

I have this object: <STATUS></STATUS>

This being sold or available. I would like the status column to check the status tag to see if it is sold or not, and then set the colors green or red respectively.

I have pondered this one for quite some time without figuring out how. Please help!?!?!

0
Comment
Question by:doomie
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 16

Expert Comment

by:ellandrd
ID: 17881526
Hi doomie,

I appologize for not giving an indepth answer however I think your problem will be easily fixed after reading through the following help guide supplied by Macromedia, Inc.

Customizing the DataGrid component (Flash Professional only)

You can transform a DataGrid component horizontally and vertically during authoring and runtime. While authoring, select the component on the Stage and use the Free Transform tool or any of the Modify > Transform commands. At runtime, use the setSize() method (see UIObject.setSize()). If there is no horizontal scroll bar, column widths adjust proportionally. If column (and therefore, cell) size adjustment occurs, then text in the cells may be clipped.

Using styles with the DataGrid component
You can set style properties to change the appearance of a DataGrid component. The DataGrid component inherits Halo styles from the List component. (For more information, see Using styles with the List component.) The DataGrid component also supports the following Halo styles:

Style
 Description
 
backgroundColor
 The background color can be set for the whole grid or for each column.
 
labelStyle
 The font style can be set for the whole grid or for each column.
 
headerStyle
 A CSS Style Declaration for the column header that can be applied to a grid or column.
 
vGridLines
 A Boolean value that indicates whether to show vertical grid lines (true) or not (false).
 
hGridLines
 A Boolean value that indicates whether to show horizontal grid lines (true) or not (false).
 
vGridLineColor
 The color of the vertical grid lines.
 
hGridLineColor
 The color of the horizontal grid lines.
 
headerColor
 The color of the column headers.
 

If the above table indicates that a style can be set for a column, you can use the following syntax to set the style:

grid.getColumnAt(3).setStyle("backgroundColor", 0xff00aa)

Using skins with the DataGrid component
The skins that the DataGrid component uses to represent its visual states are included in the subcomponents from which the data grid is composed (ScrollPane and RectBorder). For information about their skins, see Using skins with the ScrollPane component and Using skins with the List component.

The rollover and selection underlays, however, use the ActionScript Drawing API. To skin these portions of the data grid while authoring, modify the ActionScript code in the skin symbols in the Flash UI Components 2/Themes/MMDefault/datagrid/ skins states folder in the library of one of the themes FLA files.



If you need any help putting this into practice, let me know.

Cheers

Ellandrd
0
 

Author Comment

by:doomie
ID: 17908604
I am a step closer now, but had to abandon XMLConnector Dataset in order for the formatting to work.
Here is an example of my code:

function parseXML() {
      myXML = new XML();
      myXML.load("http://www.XXXXXXXXXX.com/html/prisliste.xml");
      myXML.ignoreWhite = true;
      myXML.onLoad = function(success) {
            if (success) {
                  //trace("xml loaded...");
                  makeArray();
            } else {
                  
            }
      };
}
function makeArray() {
      Users = [];
            nodes = myXML.firstChild.childNodes;
      for (i=0; i<nodes.length; i++) {
            Users.push({Leilighet:myXML.firstChild.childNodes[i].childNodes[0].firstChild.nodeValue,
                              BRA:myXML.firstChild.childNodes[i].childNodes[1].firstChild.nodeValue,
                              Innskudd:myXML.firstChild.childNodes[i].childNodes[2].firstChild.nodeValue,
                              Fellesgjeld:myXML.firstChild.childNodes[i].childNodes[3].firstChild.nodeValue,
                              Pris:myXML.firstChild.childNodes[i].childNodes[4].firstChild.nodeValue,
                              fpm:myXML.firstChild.childNodes[i].childNodes[5].firstChild.nodeValue,
                              rfpes:myXML.firstChild.childNodes[i].childNodes[6].firstChild.nodeValue,
                              Status:myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue});
                                    if (myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue == "Solgt")
                                          UserGrid.setCellStyle( i, 7, "textcolor", "0xFF0000" );
                                    {
}

            UserGrid.dataProvider = Users;
      }
}

parseXML();



This works ALMOST perfect, but only almost.

For some reason it formats the text red for a second, blinks and removes the formatting. The formatting reapers when the grid gets focus, (mouseclick or drag the scrollbar)

 Flash can be a joy! Any ideas?
0
 
LVL 16

Expert Comment

by:ellandrd
ID: 17908738
function makeArray()
{
      Users = [];

      nodes = myXML.firstChild.childNodes;

      for (i=0; i<nodes.length; i++)
      {
            Users.push(
            {
                  Leilighet:myXML.firstChild.childNodes[i].childNodes[0].firstChild.nodeValue,
                  BRA:myXML.firstChild.childNodes[i].childNodes[1].firstChild.nodeValue,
                  Innskudd:myXML.firstChild.childNodes[i].childNodes[2].firstChild.nodeValue,
                  Fellesgjeld:myXML.firstChild.childNodes[i].childNodes[3].firstChild.nodeValue,
                  Pris:myXML.firstChild.childNodes[i].childNodes[4].firstChild.nodeValue,
                  fpm:myXML.firstChild.childNodes[i].childNodes[5].firstChild.nodeValue,
                  rfpes:myXML.firstChild.childNodes[i].childNodes[6].firstChild.nodeValue,
                  Status:myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue});

                  if (myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue == "Solgt")
                        UserGrid.setCellStyle( i, 7, "textcolor", "0xFF0000" );
                        {
                              
                        }

                  UserGrid.dataProvider = Users;
      }
}


which when the indentation is done proper it should look like this.


function makeArray()
{
      Users = [];

      nodes = myXML.firstChild.childNodes;

      for (i=0; i<nodes.length; i++)
      {
            Users.push(
            {
                  Leilighet:myXML.firstChild.childNodes[i].childNodes[0].firstChild.nodeValue,
                  BRA:myXML.firstChild.childNodes[i].childNodes[1].firstChild.nodeValue,
                  Innskudd:myXML.firstChild.childNodes[i].childNodes[2].firstChild.nodeValue,
                  Fellesgjeld:myXML.firstChild.childNodes[i].childNodes[3].firstChild.nodeValue,
                  Pris:myXML.firstChild.childNodes[i].childNodes[4].firstChild.nodeValue,
                  fpm:myXML.firstChild.childNodes[i].childNodes[5].firstChild.nodeValue,
                  rfpes:myXML.firstChild.childNodes[i].childNodes[6].firstChild.nodeValue,
                  Status:myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue});

                  if (myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue == "Solgt")
                  {
                        UserGrid.setCellStyle( i, 7, "textcolor", "0xFF0000" );
                        {
                              
                        }
                  }      
            }
            
            UserGrid.dataProvider = Users;
      }
}

maybe skippin the if statement might be causing it....

ellandrd
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 16

Accepted Solution

by:
ellandrd earned 1500 total points
ID: 17908757
sorry i meant to say this is what your code looks like when indended.  you where missing a some closing }

the second ssegment of code that is indended proper is what it should look like...

sorry if ive confused you with my above
0
 

Author Comment

by:doomie
ID: 17929964
The code you provided does the job, but only for about half a second. Then the datagrid redraws(?) and and removes all formatting.
I have searched everywhere for a fix, but i am soooo stuck!

Take a look:
http://www.actiweb.no/html/olsen/test.html

The code i have tweaked so far is:

MyText = "xml loading...";
stop();
function parseXML() {
      myXML = new XML();
      myXML.load("http://www.birkebeinerbakken.no/html/prisliste.xml");
      myXML.ignoreWhite = true;
      myXML.onLoad = function(success) {
            if (success) {
                  MyText = "xml loaded...";
                  makeArray();
            } else {
                  MyText = "xml loading...";
            }
      };
}
function makeArray() {
      Users = [];
      nodes = myXML.firstChild.childNodes;
      for (i=0; i<nodes.length; i++) {
            Users.push({Leilighet:myXML.firstChild.childNodes[i].childNodes[0].firstChild.nodeValue, BRA:myXML.firstChild.childNodes[i].childNodes[1].firstChild.nodeValue, Innskudd:myXML.firstChild.childNodes[i].childNodes[2].firstChild.nodeValue, Fellesgjeld:myXML.firstChild.childNodes[i].childNodes[3].firstChild.nodeValue, Pris:myXML.firstChild.childNodes[i].childNodes[4].firstChild.nodeValue, fpm:myXML.firstChild.childNodes[i].childNodes[5].firstChild.nodeValue, rfpes:myXML.firstChild.childNodes[i].childNodes[6].firstChild.nodeValue, Status:myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue});
            if (myXML.firstChild.childNodes[i].childNodes[7].firstChild.nodeValue == "Solgt") {
                  UserGrid.setCellStyle(i, 7, "textcolor", "0xFF0000");
            } else {
                  UserGrid.setCellStyle(i, 7, "textcolor", "0x009933");
            }
      }
      UserGrid.dataProvider = Users;
      _root.UserGrid.dataProvider = Users;
}
parseXML();


Te0
"SuperBaffled"
0
 

Author Comment

by:doomie
ID: 17946445
Found a slolution :) The problem was in the  UserGrid.dataProvider = Users; statement.
This was set to soon. When i made a timer and populated the grid after all data was loaded, the colors are staying put :)

How do i fix this pointswise now?
0
 
LVL 16

Expert Comment

by:ellandrd
ID: 17946481
basically choose my comment on:

Date: 11/06/2006 03:27PM GMT
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

This is a very simple example to help those of you who are still migrating from AS2 to AS3 understand the redesigned event model in AS3. In AS2.0, event functions (that is, the function to be performed when an event is fired) were stored as a pro…
This article describes a solution to a problem of subloading one movie into another when they have different SWF versions. Sometime back, I was working on an ActionScript project while I came across an interesting fact which I would like to share…
In this tutorial viewers will learn how to create a basic shape tween animation in Flash including shape hints for smooth animation Open a new document in Flash: Draw a shape: Select another frame (how long you want the tween to be): Right click and…
The goal of the tutorial is to teach the user how to set there setting in Adobe Flash Media Live Encoder and YouTube for optimal video and audio quality.

656 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