For example, I've created 2 horizontal lists with different heights: 50px and 100px.
I'd like to use 1 item renderer to display both.
The item renderer has to create square items, so it has to produce 50x50 items for the first list and 100x100 items for the second one.
How should I set up the item renderer to get the result?
It is always the parents responsibility to size it's children. In this case, the list is the parent and the itemRenderer is the child. The best you can do is offer suggestions in the way of measuredWidth and measuredHeight.
So, you could override the measure method of your itemRenderer component to set the values (50x50 or 100x100) based on some criteria. But, what would that criteria be?? We don't know because it wasn't provided inyour question. In an ideal world, it cannot be the height or width of the List; because the itemRenderer should know nothing about the list.
Ignoring the itemRenderer for a moment...
In an MX List, you can use the rowHeight property.
In a Spark List, you can set the rowHeight property on the List's layout.
You may be able to use a typicalItem on the List class instance.
I think these approaches are more likely to give you the results you want than doing something in the itemRenderer.
Related
I have a list which displays votes cast on things in a descending order (=the dataprovider has a sort assigned).
The elements have variable height, but there are not so many elements, so i do not need to use a virtual layout
My problem is that this list needs to be updated real-time and i want to make this happen with a nice animation.
(e.g. if an item overtakes another by votes, then they swap places.)
Anyone knows how to make this animation with Flex 4.5 (spark list)?
Do i need to write a custom layout?
Thanks
If I were you, I'd just create a custom component which would have a simple layout (VGroup, maybe within a Scroller if you need a scrollbar) which then dynamically add item renderers to it. The thing about this one though is that your item renderer never changes it's data property. Make sure that the item renderer uses binding for it's data, and then on whatever you're sorting, have an animation between indexes of 2 items, make sure you set 'includeInLayout=false' before the animation for both items and just tween between their positions.
There are other ways of doing it using List, but then you'd have to make duplicates of the item renderers for the animations while the real ones are hidden and change their values. Not sure which one would be best in this case...
I have a s:List where I've defined my own itemRenderer, and would like to insert a horizontal line separating items, similar to the way the mx:LinkBar works. I don't want to have a line at the top or bottom of the list, so I can't just include an upper or lower border in the itemRenderer. I was hoping the itemRenderer could be made aware of its index in the list, but I don't see how. Is there a way to do this?
" I was hoping the itemRenderer could be made aware of its index in the list, but I don't see how. Is there a way to do this?"
If your itemRenderer implements the IDropInListItemRenderer interface, you can just access the rowIndex property of the listData object.
The cleanest solution I've found to this is to put a gap between the items and let a background Rect (or something) show through between the items. To do this on List you can just reskin it and customize the VerticalLayout to have a gap.
I have the following scenario :
A Flex 3 DataGrid is sitting here
At runtime, a column is added to this grid
The column has a custom ItemRenderer
The ItemRenderer inherits from HBox, and adds a few items to the HBOx dynamically
My problem is that the width of the column doesn't change. As a consequence, my column stays small, and an ugly horizontal scrollbar is displayed in the line, instead of my content (which is completely unreadable).
I would like the column to adapt its width to the content of the HBox in the ItemRenderer. I tried the following :
Setting the 'percentWidth' of the ItemRenderer to '100'
Invalidating the properties of the ItemRenderer after adding the items
The only thing that has a "visible" effect it to force the width of the DataGridColumn. Obviously this is not acceptable since I'm dynamically adding components to the ItemRenderer, and I don't know how many or how big they are.
Besides, when I am in the ItemRenderer, I have no access to the column itself (or do I ?) so I cannot force the size of the column from here.
So is there a way around this ? Would AdvancedDataGrid help here (notwhistanding the fact that I cannot really use it for other reasons ...)
Alternatively, I would be happy enough if someone has a solution where the column cell is displayed without the ugly horizontal scrollbar (don't mention setting horizontalScrollPolicy to "off", been there, tried that, lost shirt ;) ).
Thanks
PH
I did not found a solution for the size, however I found the way to remove the scrollbar ; you must put the "horizontalScrollPolicy : 'off'" in the list of properties of the itemRenderer Factory (rather then on the itemRenderer itself).
I want to make editable cells with multi-lines content in QTreeWidget and I use for this purpose QPlainTextEdit as a delegate. I need to set proper size to all rows that switching between editing and displaying went smooth, without any visible changes.
rect = textEdit.blockBoundingRect(textEdit.firstVisibleBlock())
With this I can find out the height I need to set for the row, but I missing the place where I can do it.
How can I set proper height to QTreeWidget's rows on initialization stage and how to handle it's changes?
You need to reimplement delegate's sizeHint(). It will automatically handle row's height and width.
And note, that QTreeWidget::uniformRowHeight property must be false in this case, though it will slow tree element rendering if it contains many rows.
I have custom list item renderers and editors for a List control. I need for the editor to have a greater height then the renderer, i.e., the row should expand(in height) when it goes into edit mode. However, even when the list's variableRowHeight is set to true, it doesn't do what I want: the height seems to be based on the height of the renderer only, not the editor. Is there any way to do what I want?
Have you tried setting the height of each of the renderers on the row that the editItemRenderer is on.
If my memory serves me correctly the varible row height takes its height from the first column cells (this may be wrong?)
If you have varibleRowHeight then when you go to edit a cell make sure all cells in the row are the same height and you may also have to invalidate the size and display.
If you have already solved this post your answer as it would be interesting to see what different approaches you may have taken.