2022-5-21更新:优化从应用列表返回造成秒针停止不动的问题。
2022-5-11更新:添加淡入动画,可避免开启息屏显示后亮屏秒针跳动问题。
2022-2-20更新:优化未开启息屏显示时,亮屏秒针跳动问题,优化方法由 Dex 提供。
1.先找一个带指针的表盘,以官方【经典时刻】为例:
2.提取表盘源文件,zip格式,把里面watchface文件夹中的index.js解压出来(如果格式是zab/zpk直接改后缀成zip)
3.打开 index.js 文件,电脑端推荐使用【VS Code】或者【notepad--地址】(不建议使用notpad++,注意区别,推荐的是--,不推荐++)软件,手机端也可以用【MT管理器】。
如果js文件是这样的,只有一行
可以到这个网站:js格式化 格式化一下
然后到js文件里面,替换一下格式化后的代码
4.找到以下位置 //dynamic modify end
如果没有该位置,也可以搜索
.currentApp
5.在上图红框位置的下方粘贴以下代码:
let secondPic = null;
let now = null;
let timer_sec_anim = null;
let lastTime = 0;
let animDuration = 1000;
var secAnim = {
"anim_rate": 'linear',
"anim_duration": animDuration,
"anim_from": 0,
"anim_to": 360,
"repeat_count": 1,
"anim_fps": 25,
"anim_key": "angle",
"anim_status": 1,
}
function easeInAnim(){
secondPic.setProperty(hmUI.prop.ANIM, {
"anim_rate": "easein",
"anim_duration": 100,
"anim_from": 0,
"anim_to": 255,
"anim_fps": 30,
"anim_key": "alpha",
});
}
/**
* 在合适的层级调用此方法即可
*/
function setSec() {
if (now == null) {
now = hmSensor.createSensor(hmSensor.id.TIME);
}
var screenType = hmSetting.getScreenType();
if (screenType == hmSetting.screen_type.AOD) {
stopSecAnim();
} else {
secondPic = hmUI.createWidget(hmUI.widget.IMG, {
x: 0,
y: 0,
w: 480,
h: 480,
pos_x: 480 / 2 - 9,
pos_y: 480 / 2 - 232,
center_x: 240,
center_y: 240,
src: '59.png',
angle: 0,
show_level: hmUI.show_level.ONLY_NORMAL,
})
}
var vDelegate = hmUI.createWidget(hmUI.widget.WIDGET_DELEGATE, {
resume_call: (function () {//划入表盘
console.log('ui resume');
if (timer_sec_anim != null && timer_sec_anim != 0) return;
easeInAnim();
let duration = now.utc - lastTime;
if (duration < animDuration) {
duration = animDuration - duration;
} else {
duration = 0;
}
timer_sec_anim = timer.createTimer(duration, animDuration, (function (option) {
lastTime = now.utc;
startSecAnim();
}));
}),
pause_call: (function () {
console.log('ui pause');
stopSecAnim();
}),
});
}
function startSecAnim() {
let sec = now.second * 6;
secAnim["anim_from"] = sec;
secAnim["anim_to"] = sec + animDuration * 6 / 1000;
secondPic.setProperty(hmUI.prop.ANIM, secAnim);
}
/**
* onDestroy()中要调用一下这个方法
*/
function stopSecAnim() {
timer.stopTimer(timer_sec_anim);
timer_sec_anim = 0;
}
6.搜索hmUI.widget.TIME_POINTER
找到以下位置,记好红框位置的参数,下一步要用。
7. 搜索secondPic = hmUI.createWidget回到第5步复制的代码块,修改参数。
屏幕宽度:gtr3是454,gtr3pro是480,gts3是390(gts3还要做一个特殊修改,其它机型不用改,下图y值改成30,即y:30,)
秒针的旋转中心:修改成上图里面的second_posX 和second_posY的值
表盘的旋转中心:修改成上图里的second_centerX和second_centerY的值
秒针图片:修改成上图的 second_path的值
8.修改完参数后,回到第6步的位置,做如下修改。
将此处
second_posX 和second_posY的值改到1000以上。(这样修改可以避免抬腕时秒针跳动一下的问题,感谢Dex提供的方法 )
下方加入setSec()
- 搜索
onDestory(),找到以下位置
最后加入一行代码 stopSecAnim()
按Ctrl+s 保存修改。
然后把修改后的index.js文件替换掉zip里面的就全部完成了。