Index
The HT
system is available to achieve animation effects through the ht.Default.startAnim
function introduces form Beginners Manual, or the animation plug-in extension package describes in Animation Manual.
This manual will introduce the DataModel
function of the scheduling function, it is mainly used at the specified time interval for function callback processing, often used to achieve graphics flow and flicker and other animation effects.
The example above should be noted:
Graph3dView
turns off the dashed line by default, and if you want to enable can throughgraph3dView.setDashDisabled(false)
to start the dashed drawing function, the dashed line is described in the Shape Manual of the spatial pipeline section.
The scheduling process in HT
is, add the scheduling task by DataModel
, and DataModel
will be in the scheduled task at the time interval to arrive, traversing all the data of DataModel
callback schedule task's action
function, can achieve the animation effect by incoming modify the related properties of Data
data to the function.
DataModel#addScheduleTask(task)
Adds a scheduling task where the task
is a JSON
object, which can be specified as follows:
interval
: Interval number of milliseconds, the default is 10
enabled
: Whether enable the switch, the default is true
action
: Interval action function, the function must be setDataModel#removeScheduleTask(task)
Deletes the scheduling task where task
is the scheduled task object that was already added.
blinkTask
changes the color value of screen.color
at intervals of 500
milliseconds, while modelMap['LCD'].color = { func: 'attr@screen.color' };
bound the mtl
material for LCD
to attr@screen.color
, so the scheduling task eventually makes the mac
computer's screen color alternate with the flicker effect:
blinkTask = {
interval: 500,
action: function (data){
if(data !== mac){
return;
}
if(data.a('screen.color') === 'red'){
data.a('screen.color', undefined);
}else{
data.a('screen.color', 'red');
}
}
};
dataModel.addScheduleTask(blinkTask);
When dataModel.removeScheduleTask(blinkTask);
remove the flashing schedule task, can use mac.a({ 'screen.color': 'red' });
restore to the screen original color, to avoid deleting a scheduled task when it is in a blinking dark phase:
checkBox: {
label: 'Enable Blink',
selected: true,
onValueChanged: function (){
if(this.isSelected()){
dataModel.addScheduleTask(blinkTask);
}else{
dataModel.removeScheduleTask(blinkTask);
mac.a({ 'screen.color': 'red' });
}
}
}
scaleTask
constantly change the size of the data in interval 40
millionseconds, scale.s3
keeps the original data size, scale.value
saves the current zooming, scale.shrink
saves the current zoomIn or zoomOut state:
scaleTask = {
interval: 40,
action: function (data){
if(data !== mac){
return;
}
var shrink = data.a('scale.shrink'),
value = data.a('scale.value'),
s3 = data.a('scale.s3');
if(shrink){
value -= 0.02;
if(value < 0.94){
value = 0.94;
data.a('scale.shrink', false);
}
}else{
value += 0.02;
if(value > 1.06){
value = 1.06;
data.a('scale.shrink', true);
}
}
data.a('scale.value', value);
data.s3(s3[0]*value, s3[1]*value, s3[2]*value);
}
};
dataModel.addScheduleTask(scaleTask);
rotationTask
at intervals of 50
milliseconds constantly change the direction of the data rotation:
rotationTask = {
interval: 50,
action: function (data){
if(data !== mac){
return;
}
mac.setRotation(mac.getRotation() + Math.PI/20);
}
};
dataModel.addScheduleTask(rotationTask);
Except for DataModel#removeScheduleTask(task)
delete schedule task can stop the task, the enabled
attribute on the json
parameter object of the schedule task can also controls the start and stop of the schedule task, and if the property is not set, HT
defaults to set this property to true
when addScheduleTask
, the user can be closed by explicitly setting false
. From the previous example, we know that in the action
of the scheduling processing, we only animating in the data data === mac
, so in fact, the start-stop of the scheduled can also by the specific data attributes information to do more fine-grained switch control in the action
.
The starting and stopping of the scheduling task can be achieved through DataModel#removeScheduleTask
, setting the enabled
attribute of the task object, and the three ways to do the filtering process of the action
action, users can choose the best way to design their own projects according to the specific scene.