What's the best-approach to swap to elements in a Flex Array Collection?
I am binding a ArrayCollection as a dataprovider to combo-box.
Selecting a row, should move the object to the top of the combo-box list, and move the top-object to selected object's position.
I would do this instead:
dataProvider.addItemAt(dataProvider.removeItemAt(selectedIndex), 0);
The only problem is that this would make the combobox rebind twice, but for simplicity sake it shouldn't be an issue.
Tried setItemAt?
This worked!
var temp:Object = myDataProvider.getItemAt(0);
var pos:int = myDataProvider.getItemIndex(selected);
myDataProvider.setItemAt(selected,0);
myDataProvider.setItemAt(temp,pos);
myDataProvider.refresh();
Related
Per this thread, I am attempting to do the following... (simplified for discussion sake).
TreeItem<Step> item = new TreeItem<>(step);
parent.getChildren().add(0, item);
int row = treeView.getRow(item); //row here is -1?
The reason for this is I am trying to select the added item in it's absolute position in the tree using...
TreeTableViewSelectionModel<Step> msm = treeView.getSelectionModel();
msm.select(row);
So, the first child doesn't get selected. But, this works for all added Tree items except the very first child item of any parent. Following TreeItems have the correct row number and are properly selected. Not understanding why the position isn't correct. The other odd thing is I tried the following..
if (row == -1)
{
TreeItem<Step> parent = newStep.getParent(); //First parent at 0
row = treeView.getRow(parent) + 1; //Now row = 1
}
msm.select(row);
The parent TreeItem is STILL selected instead of the child. Again, all this works after adding the first child. Any help would be greatly appreciated.
EDIT: After further testing, it seems as the the item is technically selected. That is to say the application behaves as if the correct item is selected, but the parent TreeItem still graphically appears to be selected in the TreeView (i.e. it is highlighted). Hope this makes sense.
I´m adding multiple dropdowns via component factory by clicking a button. Every time i add a new dropdown, it appears on top of the previous one, which is a problem, because i need it below. Is there a way to set the position of the new component in relation to other components of the same type?
#ViewChild('additionalDropdown', { read: ViewContainerRef })
private additionalDropdown: any;
...
let componentFactory = this.resolver.resolveComponentFactory(MultiselectComponent);
let componentRef = this.additionalDropdown.createComponent(componentFactory, 0, this.additionalDropdown.injector)
Template:
<ng-container #additionalDropdown></ng-container>
The inserted component's position is the second argument to createComponent().
You're doing createComponent(componentFactory, 0) so you're always inserting the component as the FIRST view in the container (zero = first position).
If you passed no value for the second argument, the component would be inserted as the LAST view, but you can't do that since you want to pass 3 arguments.
You could try to pass null as the second argument, but I'm not sure it will work:
this.additionalDropdown.createComponent(componentFactory, null, this.additionalDropdown.injector);
Or you could have a manual counter (this would work for sure):
const counter = 0;
this.additionalDropdown.createComponent(componentFactory, counter++, this.additionalDropdown.injector);
i would like to have one list select that will have more than one style, i put two kinds of object's one is a group of users (bold), rest are users (italic or regular) is it possible to add style that will be added to part of added obj?
My code looks like this:
for(Usr usr: userSearchResult){
listSelect.addItem(usr);
}
listSelect.addStyleName("bold");
for (Gr gr : groupSearchResult) {
searchList.addItem(gr);
}
and also have style set in css correct similar to this
.v-select-bold .v-select-select {
font-weight:bold;}
i would be glad to solve this by myself but that was two days ago now i'm in a dot ;)
Thanks in advance for help!
You can store your row as a label with style. In the container there will be a label instance. There you can simply add the style.
Container container = new IndexedContainer();
container.addContainerProperty(NAME_PROPERTY, Label.class , "");
for (int i = 0; i <= 50 ; i++) {
Item item = container.addItem(i);
Label label = new Label(HashUtils.getRandomSalt());
label.addStyleName(style)
item.getItemProperty(NAME_PROPERTY).setValue();
}
return container;
You can't style rows of a ListSelect. You can use a Table component with one column to achieve a similar result. Table.setCellStyleGenerator method is used for differentiating styles for each cell (each row in your case).
<mx:DataGrid id="calendarGrid"
dataProvider="{rows}"
width="100%"
height="100%">
<mx:columns/>
</mx:DataGrid>
I dynamically add columns and rows to it in this way:
var dgc0:DataGridColumn = new DataGridColumn("timeSlot");
dgc0.headerText="Hours";
hoursColumns=new Array();
hoursColumns.push(dgc0);
for (var i:int=7;i<21;i++)
{
var dgc:DataGridColumn = new DataGridColumn();
dgc.headerText=i+":00-"+(i+1)+":00";
dgc.itemRenderer=new ClassFactory(CustomRenderer);
hoursColumns.push(dgc);
}
calendarGrid.columns=slotsColumns;
for(var i:int =0;i<maxNum+1;i++)
{
rows.addItem({timeSlot:"Day n° "+(i+1)});
}
My CustomRenderer detects user clicks and changes the color of the selected cell.
When I select one cell on, say, the first column, it is colored but if I select another cell on the same column the first one is uncolored and the second isn't colored.
Maybe the same renderer is used for all cell in the column?
There's a way to avoid it?
Thanks a lot.
I've got it!
Sorry my second unnecessary question :( my custom renderer constructor has this code inside:
addEventListener(FlexEvent.DATA_CHANGE, resetCell);
which reset cell color, I've remove it and now seems work...
sorry again.
In my flex app I store the widths and visiblility of columns in an xml file. When the app loads it reads from the xml file and sets he columns values as applicable:
for(i = 0; i < columnsOrder.length; i++){
newOrder[i] = myDG.columns[Number(columnsOrder[i]) - 1];
newOrder[i].visible = (Number(columnsVisiblity[i]) == 1);
newOrder[i].width = Number(columnsWidth[i]);
}
myDG.columns = newOrder;
myDG.invalidateList();
The problem appears to be setting the visibility (it sets the visible field correctly but messes up the width)... I've tried setting it after setting the width (outside of the loop) and before the loop as well. It resizes the columns properly if I don't do anything with the visibility.
Any ideas?
Add an import statement at the top of your class file:
import mx.core.mx_internal;
Then remove using the mx_internal namespace, remove the owner of the column, change the width and then reasign the parent:
public static function resizeColumn(col:DataGridColumn, size:int):void
{
var owner:* = col.mx_internal::owner
col.mx_internal::owner = null;
col.width = size;
col.mx_internal::owner = owner;
}
This ought to do the trick (well, it did for us after a couple of days of swearing)
Is you horizontalScrollPolicy set to false on the datagrid?
"If the DataGrid's horizontalScrollPolicy property is false, all visible columns must fit in the displayable area, and the DataGrid will not always honor the width of the columns if the total width of the columns is too small or too large for the displayable area."
http://livedocs.adobe.com/flex/3/langref/mx/controls/dataGridClasses/DataGridColumn.html#width
I was able to get it to work by calling the above loop in a function twice... the first time it add the visible columns, the second time it sets the correct width. Not the best solution but I cannot spend any more time on it.