I am using Alloy and normally target an element in ui.xml with the contoller easily:
ui.xml
<Label id ="block1">
controller.js
$.block1.backgroundColor = "red";
But how can I target UI elements that are created within the controller filer (outside the function that creates the elements)? In particular, how can I later and dynamically set the background color of block2 to "green" when the elements are created by the for loop?
$.block2.backgroundColor = "green";
does not work as the element is not in the .xml file
function createBlocks(){
for (i=0;i<=27;i++){
var block = Ti.UI.createLabel({
id: "block"+ i,
backgroundColor: "red",
text: i,
width: 10,
left: 2 + (10 * i),
});
$.hammerListStats.add(block);
}
}
The block
elements you are creating only life under that name inside the loop. You either need to store them in an array or use $.hammerListStats.children
ot access them.
So either create an empty array before the loop var elements = []
, use elements.push(block)
inside the loop and use elements[0].text=...
to change the text.
Or just use $.hammerListStats.children[0].text = ...
to access them. This works fine as long as you don't have any other components inside $.hammerListStats
or if you know their position you just add the value to it.