DataGrid Headerrenderer - Header Tooltip


package mypackage
{
import mx.controls.Text;

public class DGHeaderRenderer extends Text
{
public function DGHeaderRenderer()
{
height = 20;
}


override public function set data(value:Object):void {
super.data = value;

this.toolTip = "Click to sort by this column or reverse sort order.";
super.invalidateDisplayList();
}
}
}

and use the above as
<mx:DataGridColumn id="mycol" headerText="Col" dataField="col1" headerRenderer="mypackage.DGHeaderRenderer"/>




http://www.cflex.net/showFileDetails.cfm?ObjectID=443&Object=File&ChannelID=1

View Demo

Passing parameters to SWF

• Open index.template.html (embed html)

• Browse to function "AC_FL_RunContent" under "else if (hasRequestedVersion) "
  
• Update 'flashvars' to pass appropriate parameters

1. Passing static parameters
AC_FL_RunContent(

"src", "${swf}",
"width", "${width}",
"height", "${height}",
"align", "middle",
"id", "${application}",
"quality", "high",
"bgcolor", "${bgcolor}",
"name", "${application}",
"flashvars",'param1=value1&historyUrl=history.htm%3F&lconid=' + lc_id + '',
"allowScriptAccess","sameDomain",
"type", "application/x-shockwave-flash",
"pluginspage", "http://www.adobe.com/go/getflashplayer",
"wmode", "opaque"

);

Inside your flex application you can access the above as:

Application.application.parameters.param1

This will give you the result : 'value1'

2. Passing dynamic parameters or parameters typed in the url
e.g. http://localhost:8080/flextest/DirectLinks.html?a=b&c=d

AC_FL_RunContent(
"src", "${swf}",
"width", "${width}",
"height", "${height}",
"align", "middle",
"id", "${application}",
"quality", "high",
"bgcolor", "${bgcolor}",
"name", "${application}",
"flashvars",'urlparams='+escape(window.location.search)+'&historyUrl=history.htm%3F&lconid=' + lc_id + '',
"allowScriptAccess","sameDomain",
"type", "application/x-shockwave-flash",
"pluginspage", "http://www.adobe.com/go/getflashplayer",
"wmode", "opaque"
);

Inside your flex application you can access the above as:

Application.application.parameters.urlparams

This will give you the result : '?a=b&c=d'

Enabling both HTTP and HTTPS access to your Flex Application

To enable both HTTP and HTTPS access to you Flex app, you need to do the following:


1. Open remoting-config.xml (can be located at /WEB-INF/flex)

2. Look for <default-channels>

3. Add reference to the secure channel
<default-channels>
<channel ref="my-amf"/>
<channel ref="my-secure-amf"/>
</default-channels>


4. Define "my-secure-amf" in "services-config.xml" if not aleady defined.
<channel-definition id="my-secure-amf" class="mx.messaging.channels.SecureAMFChannel">
<endpoint uri="https://{server.name}:{server.port}/{context.root}/messagebroker/amfsecure" class="flex.messaging.endpoints.SecureAMFEndpoint"/>
</channel-definition>

Exporting Datagrid data to excel

This is a updated version of http://www.cflex.net/showFileDetails.cfm?ObjectID=298&Object=File&ChannelID=1

Algo:
===
1. Convert the datagrid data to csv string
2. Post data to a servlet
3. Servlet returns the same csv string back with content -type of the HTTPResponse set to "application/ms-excel"


1. Convert the datagrid data to csv string
This is a generic version and should work with any datagrid.

public class DataGridCSVTransformer
{
private static var csvSeparator : String = "\t";
private static var lineSeparator = "\n";

public static function toCSV(dg : DataGrid) : String
{
var str : String = "";
for(var i : int = 0; i <>
{
var dgc : DataGridColumn = dg.columns[i];
if(!dgc.visible)
continue;
str += "\""+dgc.headerText+"\"";
if(i < (dg.columnCount -1))
str += csvSeparator;
}
str += "\r\n";
var rowCount : int = dg.dataProvider.length;

for(var j:int = 0; j <>
{
for(var k : int = 0; k <>
{
var dgc : DataGridColumn = dg.columns[k];
if(!dgc.visible)
continue;
var obj : Object = null;
if(dg.dataProvider is ArrayCollection)
obj = (dg.dataProvider as ArrayCollection).getItemAt(j);
else
obj = (dg.dataProvider as Array)[j];

str += "\""+dgc.itemToLabel(obj)+"\"";
if(k < (dg.columnCount -1))
str += csvSeparator;
}
if(j < (rowCount - 1))
str += lineSeparator;
}

Alert.show("String :: "+str);
return str;
}
}

2. Post the CSV data to servlet
private function doPost(event:Event) : void
{
var csvConverter : DataGridCSVTransformer = new DataGridCSVTransformer();
var dgCSV : String = csvConverter.toCSV(dg);
var url : String = "http://localhost:8080/flextest/reports/genreport";
var urlr : URLRequest = new URLRequest(url);
urlr.method = "POST";
var urlv : URLVariables = new URLVariables();
urlv.reportdata = dgCSV;
urlr.data = urlv;
navigateToURL(urlr,"_blank");
}

3. Servlet returns the same csv string back with content -type of the HTTPResponse set to "application/ms-excel"

public void generateReport(HTTPServletRequest req, HTTPServletResponse res)
throws ServletException, IOException
{
String csvData = req.getParameter("reportData");
res.setContentType("application/ms-excel");
res.getOutputStream().print(csvData);
}

Open source flex projects and 3rd Party Flex Components

There are a number of useful Flex projects and components being developed by various Flex gurus for the Flex community.
This post is an attempt to list them down at a single place:


1. Flex ANT Tasks
http://labs.adobe.com/wiki/index.php/Flex_Ant_Tasks

2. Flex Lib : A combination of various flex components

http://code.google.com/p/flexlib/

AdvancedForm, Base64Image, EnhancedButtonSkin, CanvasButton, ConvertibleTreeList, Draggable Slider, Fire, Highlighter, HorizontalAxisDataSelector IconLoader, ImageMap, PromptingTextArea, PromptingTextInput, Scrollable Menu Controls, SuperTabNavigator, Alternative Scrolling Canvases, Horizontal Accordion, TreeGrid, FlowBox, Docking ToolBar, Flex Scheduling Framework

3. FlexUnit : U testing framework for Flex
http://code.google.com/p/as3flexunitlib/

Specifying Flex component's width and height in 'percent' ActionScript

Instead of using 'width' and 'height' attributes, use 'percentWidth' and 'percentHeight' field.

e.g.
var btn : Button = new Button();
btn.percentWidth = 90;

the above snip sets the percentage width of the button to 90%