No Padding when Extending ButtonBar as Item Renderer in AdvancedDataGrid
I am using an ActionScript Class to extend the ButtonBar
component as my Item Renderer in an AdvancedDataGrid. However, when
I set the styles and properties of the ButtonBar in the
constructor, it shifts the ButtonBar all the way to the left of the
Column, with no padding to the left. Any thoughts? Here is my
constructor function:
public class SavedReportsButtonBar extends ButtonBar
public function SavedReportsButtonBar()
super();
setStyle("horizontalAlign", "left");
width=450;
percentHeight=100;
Any help is greatly appreciated - I'm really trying to grasp
and use the whole OO programming idea.
2) You do not set an item editor only an item renderer.
<mx:AdvancedDataGridRendererProvider columnIndex="0"
columnSpan="1" depth="1" renderer="mx.controls.CheckBox">
3) You do not have rendererIsEditor on any columns that I can
see.
<mx:AdvancedDataGridColumn dataField="@sel"
headerText=" " width="25" rendererIsEditor="true"
editable="true" editorDataField="selected"/>
If I use the itemrender for that column, i am gettting the
check box for all the rows. Which i dont want . I want check box
only for the folder node. so i am using renderer provider
I want only one column to be editable
Similar Messages
-
Flex SDK 3.4 Tree Item Renderer Root Folder displays Tooltip for Child
I have a Flex Tree that uses a custom item renderer. The item renderer extends Tree Item Renderer and I add my button in commit properties (since the data is dynamic) and I use update displaylist to move it to the right position. I set the button to be visible on rollover and make the icon invisible. On rollout I reverse that logic.
When I have my item renderer add the button, it causes only one problem and it seems to be under certain conditions:
- Single root folder for the tree
- Upon opening the tree, the root folder displays the tool tip for the last child in the tree
Any idea why the tooltip comes up?
public function AssetTreeItemRenderer ()
super();
addEventListener(MouseEvent.ROLL_OVER, onItemRollover);
addEventListener(MouseEvent.ROLL_OUT, onItemRollout);
addEventListener(ToolTipEvent.TOOL_TIP_SHOWN, toolTipShown);
addEventListener(ToolTipEvent.TOOL_TIP_CREATE, onCreateToolTip);
// OVERRIDEN FUNCTIONS
* override createChildren
override protected function commitProperties():void {
super.commitProperties();
if(data is IAsset) {
if(playBtn === null) {
playBtn = new Button();
playBtn.styleName = "previewPlayButton";
playBtn.toolTip = "Play";
playBtn.width = icon.width + 2;
playBtn.height = icon.height + 2;
playBtn.visible = false;
playBtn.addEventListener(MouseEvent.CLICK, onPlayBtnClick);
addChild(playBtn);
} else {
if(playBtn !== null) {
removeChild(playBtn);
playBtn = null;
* override updateDisplayList
* @param Number unscaledWidth
* @param Number unscaledHeight
override protected function updateDisplayList(unscaledWidth:Number,
unscaledHeight:Number):void
super.updateDisplayList(unscaledWidth, unscaledHeight);
//Move our play button to the correct place
if(super.data && playBtn !== null)
playBtn.x = icon.x;
playBtn.y = icon.y;You are not clearing tooltip if data is not IAsset
-
Image in item renderer issue for List Components
Hello,
I have an issue when I use an item renderer with an image in
it. This happens when I do this with a List or TileList component
that has enough items to create a scroll bar. What happens is the
images load fine, then I scroll down and the other items and their
images start appearing, but then the first and last images start
loading the wrong image. I'll scroll back up and the first item now
has a different image, and when I scroll back down, the last images
changes too.
Has anyone had this problem with image itemrenderers in List
components?
Thanks for any help.
BradeThe creationComplete event is called ONCE and that's it. But
each time an itemRenderer is recycled it will have its data
property reset with new a new record from the dataProvider. Thus
overriding the set data function lets you inspect the data and do
what you want with it.
Data binding in MXML <mx:Image source="{data.image}" />
is set up by the Flex compiler. When the data property is reset it
will trigger the data binding notifications. The Flex
compiler-generated code will intercept that and update the Image
source property.
If you use MXML, then use data binding. If you write your
itemRenderer in ActionScript, override the set data
function. -
Datagrid item renderer destroys on mouse over
Hi,
I used Flex 3.5 datagrid. I used item renderes in my datagrid. and i set 'rendererIsEditor = true'.
Everything is very smooth and good. But somtimes my datagrid acting badly. When i put cursor on itemRenderer, It open-up for
editing. When i move mouse, item renderer destroyed.
Once it happens it is the default behaviour of my datagrid. No editing can be performed.
But i can not reproduce it always. sometimes it a happens.
please help me. anybody know about this?Simplify your test case. Try using a simple TextInput as the renderer and
see if you have the same problem. -
Passing a parameter to a Item Renderer
I have a dataGrid with about 12 columns. I want to render an
image in each cell based on the value of that node. Problem is: I
need the renderer to know what node to evaluate.
<mx:DataGridColumn width="20"
itemRenderer="com.apts247.www.renderers.Test" paddingLeft="0"
color="#990000"/>
<mx:DataGridColumn width="20"
itemRenderer="com.apts247.www.renderers.Test" paddingLeft="0"
color="#990000"/>
When these hit the item renderer, how can i make it know what
data to evaluate. I want to pass it, for example, "task_0", or
"task_1"If the Itemrenderer implements the IDropInListItemRenderer
interface, you have access to the listData property which contains
information like column index and dataField.
Check out this tutorial:
http://flexgeek.wordpress.com/2007/05/30/tutorial-using-same-itemrenderer-for-multiple-col umns/
or the flex docs for more info.
Tracy -
On i-pad, when I try to enable itunes match, it says, "you are not currently subscribed to iTunes Match. Use iTunes on your computer to subscribe." I am subscribed though! Then it says no to my request and, "item not available in the U.S. store." My Mac will not use update iTunes to any later version than the one I have because my os is also out of date, but when I try to update that i cant, so what do I have to do? Please don't tell me I have to buy a new Mac to be up to date.
On the iOS device you must be logged into the store with the exact same Apple ID you used to originally purchase the service. Go to Setting > iTunes & App Stores and if necessary sign out/in and then enable iTM.
-
When to use Drop In Item renderer and InLine Item Renderers ??
Hi ,
I am getting confused in where to use Inline ItemRenderer and DropIn Item Renderer .
What i feel is that DROP in Item Renderer are easy to use , and those can satisfy any requirements .
What i read from tutorilas that we cant use Drop In because they say , The only drawback to using drop in is that them is that you cannot configure them
Please help me .Hi Kiran,
Here is the detailed explanation you needed:
You can also refer the link below:
http://blog.flexdevelopers.com/2009/02/flex-basics-item-renderers.html
Drop-In Item Renderers
Drop-In Item Renderers are generic in nature and don't rely on specific data fields to render data. This allows them to be used with a wide range of data sets, hence, the term “drop-in”. Drop-In Item Renderers can be “dropped-in” to any list-based control regardless of the dataprovider’s data properties.
In our previous example, the employee photo property requires use of a custom Item Renderer to render properly in the UI. In this scenario the Image component satisfies our rendering needs out of the box. Implemented as a Drop-In Item Renderer, the Image component takes any data property regardless of name and uses it as the Image component's source property value. Assuming our employee photo property contains a valid image path, the Image Drop-In Item Renderer will work perfectly and resolve the image path as an image in the UI.
<!-- Drop-in Item Renderer: Image control -->
<mx:DataGridColumn dataField="photo"
headerText="Employee Photo"
itemRenderer="mx.controls.Image"/>
Drop-In Item Renderers are simple and easy to use and satisfy specific use cases nicely. However, they provide no flexibility whatsoever. If your needs are not satisfied by a Drop-In Item Renderer, you must create your own Item Renderer as an inline component or an external component.
Inline Item Renderers
Generally used for simple item rendering requiring minimal customization, inline Item Renderers are defined as a component nested within the MXML of your list-based control.
It is important to note that Item Renderers nested within the itemrender property of a list-based control occupy a different scope than the list-based control. Any attempt to reference members (properties or methods) of the parent component from the nested Item Renderer component will result in a compile-time error. However, references to the members of the parent component can be achieved by utilizing the outerDocument object.
<mx:DataGrid id="myGrid" dataProvider="{gridData}">
<mx:columns>
<mx:DataGridColumn headerText="Show Relevance">
<mx:itemRenderer>
<mx:Component>
<mx:Image source="{'assets/images/indicator_' + data.showRelevance + '.png'}"
toolTip="{(data.showRelevance == 1) ? 'On' : 'Off'}"
click="outerDocument.toggle()" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
Remember, rules of encapsulation still apply. Mark all properties or methods public if you want them accessible by your inline Item Renderer. In the previous example, the toggle() method must have a public access modifier to expose itself to the inline Item Renderer.
public function toggle():void
Inline Item Renderers can also be reusable by creating a named component instance outside of the list-based control. This component must have an id property and contain the rendering logic of the Item Renderer. Using data bindings, the component is assigned to the itemrenderer property of one or more data properties of a list-based control.
<!-- Reusable inline Item Renderer -->
<mx:Component id="ImageRenderer">
<mx:VBox width="100%" height="140"
horizontalAlign="center" verticalAlign="middle">
<mx:Image source="{'assets/'+data.image}"/>
<mx:Label text="{data.image}" />
</mx:VBox>
</mx:Component>
<!-- Used within a list-based control-->
<mx:DataGridColumn headerText="Image"
dataField="image" width="150"
itemRenderer="{ImageRenderer}"/>
In the previous example, note that the Item Renderer component contains 2 UI controls – Image and Label. When using multiple controls within an Item Renderer, a layout container is required. In this example, a VBox was used.
If this post answers your question or helps, please kindly mark it as such.
Thanks,
Bhasker Chari
Message was edited by: BhaskerChari -
DataGrid Horizontal Scroll Problem when datagrid contains Item renderer
I have datagrid with horizontal scroll policy enabled. Grid
contains some item renderer also.One of the item renderer is
datefield when i select a date from the datefield and say the
adjacent cell of the grid also contain datefield itemrenderer
and i am selecting date from that itemrenderer also.When i
scroll horizontally the date in the itemrender changes to any one
of the two itemrenderer.Some time it works fine.I am getting the
issue for combobox itemrender also.Can any one help me to solve
this issue."happybrowndog" <[email protected]> wrote in
message
news:ge11ag$jdo$[email protected]..
>
quote:
Originally posted by:
ravi_bharathii
> I have datagrid with horizontal scroll policy enabled.
Grid contains some
> item
> renderer also.One of the item renderer is datefield when
i select a date
> from
> the datefield and say the adjacent cell of the grid also
contain datefield
> itemrenderer
> and i am selecting date from that itemrenderer also.When
i scroll
> horizontally
> the date in the itemrender changes to any one of the two
itemrenderer.Some
> time
> it works fine.I am getting the issue for combobox
itemrender also.Can any
> one
> help me to solve this issue.
>
> Ravi, I am having a similar problem. I subclass a
TextInput as an
> itemrenderer for a column in a datagrid. My subclassed
TextInput checks
> to see
> the value in the overriden set() method, and depending
on the value, sets
> the
> background color of the TextInput to green. When the
datagrid scrolls
> horizontally, some unrelated cell colors also change
green and some of the
> data
> gets duplicated in the cells. The underlying data
provider's data is not
> confused however. Seems the rendering is screwed up when
the Datagrid
> scrolls.
>
> Did you find a solution to this problem? I think
Datagrid is a piece of
> screwed up code.
http://www.magnoliamultimedia.com/flex_examples/Amys_Flex_FAQ.pdf
Q2 -
I have an item renderer that adds a checkbox to my tree and
checks it. My problem is that when i uncheck the box and scroll
down the tree there are random boxes that are unchecked. Does
anyone know how to get around this? Here is the renderer, and any
help would be greatly appreciated!!
package components
import mx.core.Container;
import mx.core.IDataRenderer;
import mx.controls.CheckBox;
import mx.controls.treeClasses.*;
import mx.collections.*;
import flash.xml.*;
import flash.events.Event;
import flash.events.MouseEvent;
import mx.controls.Alert;
import mx.controls.listClasses.*;
public class myTreeItemRenderer extends TreeItemRenderer
private var nodeType:String;
// myCheckBox: holds the CheckBox we are adding to the tree
nodes
protected var myCheckBox:CheckBox;
// set the margin between the image we are adding, and the
label
private var cbToLabelMargin:Number = 2;
// show default branch icon?
private var showDefaultBranchIcon:Boolean = false;
// show default leaf icon?
private var showDefaultLeafIcon:Boolean = false;
public function myTreeItemRenderer()
super();
// InteractiveObject variables.
mouseEnabled = false;
public function openBranch(evt:Event):void
// get the TreeListData
var myListData:TreeListData = TreeListData(this.listData);
// get the selected node
// var selectedNode:Object = myListData.node;
var selectedNode:Object = myListData.item;
var selectedNodeXML:XMLList = new XMLList(selectedNode);
// get the tree that owns us
var theTree:Tree = Tree(myListData.owner);
// find out if the selected branch is already open
//var isBranchOpen:Boolean = theTree.getIsOpen( selectedNode
//mx.controls.Alert.show(selectedNode.toString());
// if the selected branch is open, let's close it
// and if it's closed, let's open it
//var isBranchOpen:Boolean = isBranchOpen ? false : true;
//theTree.setIsOpen( selectedNode, isBranchOpen, true, false
if(theTree.id=="soTree")
this.parentApplication.soCheckBoxChanged(evt,selectedNodeXML);
//mx.controls.Alert.show(selectedNodeXML.attribute('id')+"
"+selectedNodeXML.attribute('type')+" False");
else if(theTree.id=="ntaTree")
override protected function createChildren():void
// create a new CheckBox() to hold the CheckBox we'll add to
the tree item
myCheckBox = new CheckBox();
myCheckBox.setStyle( "verticalAlign", "middle" );
myCheckBox.selected=true
// and apply it to the tree item
addChild(myCheckBox);
// add the event listener to the whole tree item
// this will let us click anywhere on the branch item to
expose the children of this branch
myCheckBox.addEventListener( MouseEvent.CLICK, openBranch );
super.createChildren();
override public function set data(value:Object):void
if(value==null)
return;
else
super.data = value;
// get the tree that owns us
var _tree:Tree = Tree(this.parent.parent);
// if the current node is a branch node
if(TreeListData(super.listData).hasChildren)
// set styles...
setStyle("color", 0x000000);
setStyle("fontWeight", 'bold');
// if we don't want to show the default branch icons, let's
empty them
if( !showDefaultBranchIcon )
_tree.setStyle("folderClosedIcon", null);
_tree.setStyle("folderOpenIcon", null);
else
// if we are in here, then the current node is a leaf node
// set styles...
setStyle("color", 0x000000);
setStyle("fontWeight", 'normal');
// if we don't want to show the default leaf icons, let's
empty them
if( !showDefaultLeafIcon )
_tree.setStyle("defaultLeafIcon", null);
override protected function
updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
super.updateDisplayList(unscaledWidth, unscaledHeight);
if(super.data)
// if the current node is a branch
if(TreeListData(super.listData).hasChildren)
// get the current node and it's children as XMLList
// var currentNodeXMLList:XMLList = new
XMLList(TreeListData(super.listData).node);
var currentNodeXMLList:XMLList = new
XMLList(TreeListData(super.listData).item);
nodeType= currentNodeXMLList.attribute('type');
// get the number of children under the current node
var numOfImmediateChildren:int =
currentNodeXMLList[0].children().length();
// set the image to be displayed in the branches
//myImage.source = branchImage;
// set the label text
super.label.text = TreeListData(super.listData).text + "(" +
numOfImmediateChildren + ")";
else
// if we are in here, then the current node is a leaf node
//myImage.source = leafImage;
// reset the position of the image to be before the label
myCheckBox.x = super.label.x;
// reset the position of the label to be after the image,
plus give it a margin
super.label.x = myCheckBox.x + 10 + cbToLabelMargin;
}Hi,
The links you have refered are really useful. Unfortunatelly, my environment is just flex sdk 3.
So I have to find some other solution to finish this logic.
Nith -
Datagrid item renderer with drop down need help.
Hi Guys,
I am populating an advance data grid in which one column has an item renderer containing a drop down. This drop down has 4 items. When user selects more than one row the drop down should contain only two items. In my case when user selects multiple rows using control key and then clicks on any of the rows drop down then that row gets de selected which I don’t want I tried stop propagation and stop immediate propagation but that also didn’t helped. Please help
Thanx
Mahesh.Hi
This is a default bahviour of dropdown.. dropdown will not allow you multiple selections.. you should create your own component by extending the combobox and try your thing,, If you click on one item.. then it calls internally change event. If the change event called then the dropdown will automatically closed.. so you should restrict this ...
Thanks
Ram -
Setting Focus to datagrid next Item renderer column
Hi
I am having spark datagrid with 7 colum, I am facing problem to set focus for item renderer element.
Below is my datagrid, when user enter some text in text input and press TAB key, I want trade button to be in focus. and from trade column Tab key press I want delete button to be in focus.
I tried giving
tabEnabled="true" tabChildren="false" tabFocusEnabled="true" editable="true" hasFocusableChildren="true"
for datagrid.
Also i tried giving selectedCell
var _focusedCell:Object = new Object();
_focusedCell.rowIndex = dgTermDepo.selectedIndex;
_focusedCell.columnIndex = 5;
dg.selectedCell = _focusedCell as CellPosition;
but nothing is working, I know I am missing some logic or property, Please suggest me on this
Thanks
SonuYou need to dig down into the event object and look at the
listData.
public function clickMe(e : MouseEvent ):void {
var rowIndex : int = e.currentTarget.listData.rowIndex
var colIndex : int = e.currentTarget.listData.columnIndex
if the listData object is null when you try this you may need
to add the following methods as overrides to the renderer or create
a base renderer and extend all your renderers from the base
renderer so that you always override these methods.
[Bindable("dataChange")]
private var _listData : BaseListData;
override public function get listData() : BaseListData {
return _listData;
override public function set listData( value : BaseListData )
: void {
_listData = value;
} -
Zoom item renderer out of scroller boundaries
Hi everyone, hoping someone has the easy Answer. I want to have an item renderer that can zoomIn and display outside the scroller boundaries for which it resides in.
I have
Scroller set depth property =1
|
Datagroup (tile layout) depth=2
|
custom zoomable LabelItemRenderer depth=3 (depth=4 when zooming in so it overlaps the other renderers in the datagroup) ....these tiles, when zoomed, will increase in size by 50%.
So in other words, the datagroup is wrapped in a scroller, and I extended the LIR to zoom.
If I take the scroller out of the picture, everything works great...if I zoom on an IR(tile) that is on the very border of the datagroups boundaries, it will display over the DG's boundaries so that the whole zoomed tile is shown.
Now if I wrap the DG in a scroller, the IRs will zoom, but any tiles on the boundary will get clipped by the boundary, like it is underneath the scroller.
I want a zoomed tile to display completely, even if that means overlapping the boundaries of the scroller. Like I said, works great when the DG doesn't have a scroller wrapped around it.
Is this possible?
I should add its a 4.6 mobile project.I don't use jbuilder
This is what apears at the commandpromt:
Exception occurred during event dispatching:
java.lang.OutOfMemoryError
<<no stack trace available>>
Exception occurred during event dispatching:
java.lang.OutOfMemoryError
<<no stack trace available>>
java.lang.OutOfMemoryError
<<no stack trace available>>
java.lang.OutOfMemoryError
<<no stack trace available>>This is the version of java i use (I use the compiler that comes with it it does not answer to -version itself)
java version "1.3.1"
Java(TM) 2 Runtime Environment, Standard Edition (build 1.3.1-b24)
Java HotSpot(TM) Client VM (build 1.3.1-b24, mixed mode)This is my ListCell renderers get method:
public Component getListCellRendererComponent(JList list,Object value,int index,boolean isSelected,boolean cellHasFocus)
String[] ss=((arrayjanus) value).getArray();
JPanel p=new JPanel();
p.setLayout(new BoxLayout(p,BoxLayout.X_AXIS));
for(int i=0;i<lenghts.length;i++)
JTextField jt=new JTextField(lenghts);
jt.setText(ss[i]);
jt.setCaretPosition(0);
p.add(jt);
return p;
I run in the same problem if i switch of the DB access and on a selection do nothing but System.out.println the count of selections (I get it after ~ 800 clicks in rapid succession under theese circumstances)
I am having about 50 items in the list. -
How to dispatch custom events from an item renderer used for Datagrid Column
Hi,
I am using an Item Renderer for a Data Grid Column and in that mxml, I am dispatching a custom event with data.
But the main mxml which has the DataGrid is not able to resolve the event. How can I solve this?
ThanksHi,
This is the constructor for Event.
public function Event(type:String, bubbles:Boolean = false, cancelable:Boolean = false)
When you created your custom event after extending from Event, for the parent container receives the event, the bubbles property must be set to true.
Please check if you have done so. That should solve the problem. Let me know if it doesn't.
Nishad -
How do you measure performance of an item renderer?
I'm creating an ItemRenderer in Flex 4.6 and I want to know how to measure total time to create, view and render an item renderer and how long it takes to view and render that item renderer when it's being reused.
I just watched the video, Performance Tips and Tricks for Flex and Flash Development and it describes the creation time, validation time and render time and also the reset time. This is described at 36:43 and 40:25.
I'm looking for a way to get numbers in milliseconds for total item renderer render time and reset time (what is being done in the video).To answer your first question, in this video Ryan Frishberg recommends measuring and tuning your code. I'm trying to follow his example for my own item renderers.
I've taken some key slides out to show you. -
Data provider problem in custom item renderer
I have a complex, custom item renderer for a list. I add
items that I extracted from an xml to the data provider using the
IList interface. But when displaying the list, the items are all
screwed up. Each rendered item has some parts which are initialized
as different components depending on the values from the xml. This
initialization is called in the item renderer for the
creationComplete event.
The weird thing is that when I output the dataProvider to
check its values, some of the items have internal uids sometimes
and sometimes they don't. If I output the dataProvider right after
I add the items to it, none of them get internal uids. But from the
initialize method, some of them do and some don't.
To make things weirder, sometimes, as I scroll up and down
the list, the dynamic components get all switched up. I'm either
having a problem with internal uids or with the creation policies
for lists. Or it's probably some simpler mistake I have yet to see.
Anyone have any idea where the problem could lie? Any help is
greatly appreciated.Any successful render must:
1) override the set data property of the component
Further, best practice is to store any data you need in the
override set data(), and call invalidateProperties(). Then do the
actual work in an override commitProperties() function.
The framework is smart about when to call commitProperties
efficiently. set data() gets called much more often.
Tracy
Maybe you are looking for
-
I need to install a printer on my Macbook Pro. I downloaded and installed the driver from the manufacturer, Brother MFC 7820N. Then clicked the plus on add printer from System Preferences. I selected the printer I want to add as a nearby printer and
-
I have my settings on block pop-up ads and, stil, the blocker is not working on ANY ads. It used to work just fine. Has anyone else had this specific problem, and how can I fix this issue? Please and thank you!
-
Is there an easy way to find all records where an ID is found in a list? For example if I have the following: TABLE: resource FIELDS: resourceID | listOfIDs | title RECORDS: 1 | 1,7,9 | Item 1 2 | 2,3,7,8 | Item 2 3 | 8,17 | Item 3 4 | 2,7 | Item 4 I
-
FINDING, TIME STAMPING, AND SAVING SELECTED PORTIONS OF WAV FILE
Hello Everyone, LV 6.1 What I'm trying to do is build an app that captures, timestamps and saves peaks only in a *.wav file from the sound card. Specifically, dog barking. My dream would be that I have a constant input from a mike into the sound car
-
I am getting servlet exception(javax.servlet.jsp.tagext.TagAttributeInfo)
javax.servlet.ServletException: javax.servlet.jsp.tagext.TagAttributeInfo.<init>(Ljava/lang/String;ZLjava/lang/String;ZZ)V org.apache.jasper.servlet.JspServlet.service(JspServlet.java:272) javax.servlet.http.HttpServlet.service(HttpServlet.