下面开始讲解如何实现如下指针转动的效果：
1.导入图片相关素材。
已经导入的素材位置 <KanziWorkspace>/Tutorials/Demo/Assets.
手动调节如下来调整大小。
2.添加定时器触发
timer的触发设置：
用脚本来响应触发，
3.脚本程序编写：
// Get the SpeedNeedle node.
var speedNeedleNode = node.lookupNode('#SpeedNeedle');
// Set the highest value for the speed needle.
var maxSpeed = 240;
// Set the number of seconds it takes for the needle to go from the lowes to the highest value and back
var cycleTimeSpeed = 10;
var timeOffsetSpeed = 0;
var fuelNeedleNode = node.lookupNode('#FuelNeedle');
var maxFuel = 100;
var cycleTimeFuel = 10;
var timeOffsetFuel = 3;
var batteryNeedleNode = node.lookupNode('#BatteryNeedle');
var maxBattery = 100;
var cycleTimeBattery = 10;
var timeOffsetBattery = 0;
function calculateNeedlePosition (maxValue, cycleTime, timeOffset)
{
var halfCycleTime = cycleTime / 2;
var now = (Date.now() + timeOffset * 1000) / 1000;
var needleValue = 0;
var percentOfHalfCycle = (now % halfCycleTime) / halfCycleTime;
if (now % cycleTime < halfCycleTime)
{
needleValue = maxValue * percentOfHalfCycle;
}
else
{
needleValue = maxValue - maxValue * percentOfHalfCycle;
}
return needleValue;
}
speedNeedleNode.setProperty('Demo.Speed', calculateNeedlePosition(maxSpeed, cycleTimeSpeed, timeOffsetSpeed));
fuelNeedleNode.setProperty('Demo.Fuel', calculateNeedlePosition(maxFuel, cycleTimeFuel, timeOffsetFuel));
batteryNeedleNode.setProperty('Demo.Battery', calculateNeedlePosition(maxBattery, cycleTimeBattery, timeOffsetBattery));
|
编写完程序，保存。
在下面的路径下可以找到自己所保存的程序。
这样就完成了。
