Usability of the layout system

Travis, thanks for your input. At some point in the future we will need to redesign bits of the drawables section of the resource compiler (admittedly the drawable-list came into existence before the concept of a Drawable object did). We have a task in our back log to redo this part of the resource compiler. I will link to this thread in that issue as I think the design you highlighted here needs to be taken into consideration when that happens.

You could use an approach similar to what SHARKBAIT suggested. You could define drawables for movebar20, movebar40, movebar60, etc and then replace them in the layout based on the current status in onUpdate using layout.getDrawableById(). This would allow you to define the movebar drawables to be device specific but the code to set the proper movebar would be device independent. I know this option isn't great; obviously for a battery indicator this gets a bit more tedious.

I don't have time to write code to fully test this but here's a general idea of what I'm thinking.
var moveBar20, moveBar40, moveBar60, moveBar80, moveBar100;

function onLayout(dc) {
// Load move bar drawable resources.
moveBar20 = Ui.loadResource(Rez.Drawables.moveBar20);
}

function onUpdate(dc) {
var moveBar = View.findDrawableById("moveBar");
// Decide which move bar needs to be displayed
view = moveBarXX;
}


I am stuck at this. Also struggle to have my move bars as drawables that can be differently drawn for different devices

For the system proposed (by Ken) to work, you need to create device-specific layout resources. It can easily be done for a move bar, but doing a steps bar on something like a 920xt would require 205 different drawables to get the most accurate representation of the percent of steps completed. i.e., it wouldn't work.

For the system proposed (by Ken) to work, you need to create device-specific layout resources. It can easily be done for a move bar, but doing a steps bar on something like a 920xt would require 205 different drawables to get the most accurate representation of the percent of steps completed. i.e., it wouldn't work.

Sure. I've already sorta covered in my original post. You create a layout with a label at the position you want the bitmap to appear.

<layout id="TestLayout" background="Gfx.COLOR_WHITE">
<!-- snip -->
<label id="Battery" x="2" y="2" />
<!-- snip -->
</layout>


If you want, you can define one drawable for each of the bitmaps you want to render. Then every time the battery status changes you can load the drawable resource and swap it into your layout.

hidden var batteryBitmap;

function onLayout(dc) {
var layout = Rez.Layouts.TestLayout(dc);

batteryBitmap = new Ui.Bitmap({});

// replace the label with a bitmap
for (var i = 0; i < layout.size(); ++i) {
if ("Battery".equals(layout.identifier)) {
batteryBitmap.setLocation(layout.locX, layout.locY);
layout= batteryBitmap;
}
}

updateBatteryBitmap();
}

hidden var previousBatteryLevel;

hidden function updateBatteryBitmap()
{
var batteryLevel = Sys.getSystemStats().battery / 25;

if (previousBatteryLevel == null ||
previousBatteryLevel != batteryLevel) {

previousBatteryLevel = batteryLevel;

var rezId;
if (batteryLevel == 0) {
rezId = Rez.Bitmaps.Battery0to25;
}
else if (batteryLevel == 1) {
rezId = Rez.Bitmaps.Battery25to50;
}
else if (batteryLevel == 2) {
rezId = Rez.Bitmaps.Battery50to75;
}
else {
rezId = Rez.Bitmaps.Battery75to100;
}

batteryBitmap.setBitmap(rezId);
}
}

function onUpdate(dc) {
updateBatteryBitmap();

View.onUpdate(dc);
}
[/code]

Thank you so much!!