I'm asking for a little help with Index.js. I made, from the Amazfit's official online editor, a watchface for T-Rex 2 with editable backgrounds but I want to change also the other graphic elements like a theme (images, fonts) while swtiching background in the watchface settings. Something lilke:
Theme-1 (Background-1, Fonts-1, widgets-1)
Theme-2 (Background-2, Fonts-2, widgets-2)
Them...
Theme-n (Background-n, Fonts-n, widgets-n)
I don't need complicated functions to click on the screen but just standard long press to enter in the watchface settings like I'm doing already to change background, but also changing its elements coordinated. Right now just change background, but not its elements.
I couldn't find a code example that fit my needs and I'm not to skilled to figure out myself. I'm posting my example index.js, a short version without all the elements but just HH-MM-SS.
Can someone telle me where to put the different elements? Should a include a conditional instruction or case switch or?
Many thanksss in advance!
Code: Select all
try {
(() => {
const __$$app$$__ = __$$hmAppManager$$__.currentApp;
function getApp() {
return __$$app$$__.app;
}
function getCurrentPage() {
return __$$app$$__.current && __$$app$$__.current.module;
}
const __$$module$$__ = __$$app$$__.current;
const h = new DeviceRuntimeCore.WidgetFactory(
new DeviceRuntimeCore.HmDomApi(__$$app$$__, __$$module$$__)
);
const { px } = __$$app$$__.__globals__;
const logger = Logger.getLogger("watchface6");
__$$module$$__.module = DeviceRuntimeCore.WatchFace({
init_view() {
/* Change BG */
hmUI.createWidget(hmUI.widget.WATCHFACE_EDIT_BG, {
edit_id: 1,
x: 0,
y: 0,
bg_config: [
{ id: 1, path: "4.png", preview: "5.png",},
{ id: 2, path: "6.png", preview: "7.png",},
{ id: 3, path: "8.png", preview: "9.png",},
],
count: 3,
default_id: 1,
fg: "3.png",
tips_x: 0,
tips_y: 0,
tips_bg: "2.png",
show_level: hmUI.show_level.ONLY_NORMAL | hmUI.show_level.ONLY_EDIT,
});
/* End Change BG */
/* --------------------------------- START CYAN (xx-C.png) THEME ALL ELEMENTS ---------------------------- */
/* To make shorter to read I left just HH-MM-SS
/* Hours TXT-IMG Cyan */
hmUI.createWidget(hmUI.widget.IMG_TIME, {
hour_zero: 1,
hour_startX: 83,
hour_startY: 190,
hour_array: ["31-C.png","32-C.png","33-C.png","34-C.png","35-C.png","36-C.png","37-C.png","38-C.png","39-C.png","40-C.png",],
hour_space: 20,
hour_align: hmUI.align.LEFT,
/* Minutes TXT-IMG Cyan */
minute_zero: 1,
minute_startX: 256,
minute_startY: 190,
minute_array: ["31-C.png","32-C.png","33-C.png","34-C.png","35-C.png","36-C.png","37-C.png","38-C.png","39-C.png","40-C.png",],
minute_space: 20,
minute_align: hmUI.align.LEFT,
minute_follow: 0,
/* Seconds TXT-IMG Cyan */
second_zero: 1,
second_startX: 204,
second_startY: 276,
second_array: ["41-C.png","42-C.png","43-C.png","44-C.png","45-C.png","46-C.png","47-C.png","48-C.png","49-C.png","50-C.png",],
second_space: 7,
second_align: hmUI.align.LEFT,
second_follow: 0,
enable: false,
show_level: hmUI.show_level.ONLY_NORMAL,
});
/* --------------------------------- END CYAN THEME ALL ELEMENTS ---------------------------- */
/* --------------------------------- START YELLOW (xx-Y.png) THEME ALL ELEMENTS -------------------------- */
/* To make shorter to read I left just HH-MM-SS
//Widgets Yellow
/* Hours TXT-IMG Yellow */
hmUI.createWidget(hmUI.widget.IMG_TIME, {
hour_zero: 1,
hour_startX: 83,
hour_startY: 190,
hour_array: ["31-Y.png","32-Y.png","33-Y.png","34-Y.png","35-Y.png","36-Y.png","37-Y.png","38-Y.png","39-Y.png","40-Y.png",],
hour_space: 20,
hour_align: hmUI.align.LEFT,
/* Minutes TXT-IMG Yellow */
minute_zero: 1,
minute_startX: 256,
minute_startY: 190,
minute_array: ["31-Y.png","32-Y.png","33-Y.png","34-Y.png","35-Y.png","36-Y.png","37-Y.png","38-Y.png","39-Y.png","40-Y.png",],
minute_space: 20,
minute_align: hmUI.align.LEFT,
minute_follow: 0,
/* Seconds TXT-IMG Yellow */
second_zero: 1,
second_startX: 204,
second_startY: 276,
second_array: ["41-Y.png","42-Y.png","43-Y.png","44-Y.png","45-Y.png","46-Y.png","47-Y.png","48-Y.png","49-Y.png","50-Y.png",],
second_space: 7,
second_align: hmUI.align.LEFT,
second_follow: 0,
enable: false,
show_level: hmUI.show_level.ONLY_NORMAL,
});
/* --------------------------------- END YELLOW THEME ALL ELEMENTS --------------------------- */
/* --------------------------------- START WHITE (xx-W.png) THEME ALL ELEMENTS -------------------------- */
/* To make shorter to read I left just HH-MM-SS
//Widgets WHite
/* Hours TXT-IMG WHite */
hmUI.createWidget(hmUI.widget.IMG_TIME, {
hour_zero: 1,
hour_startX: 83,
hour_startY: 190,
hour_array: ["31-W.png","32.png","33.png","34.png","35.png","36.png","37.png","38.png","39.png","40.png",],
hour_space: 20,
hour_align: hmUI.align.LEFT,
/* Minutes TXT-IMG WHite */
minute_zero: 1,
minute_startX: 256,
minute_startY: 190,
minute_array: ["31-W.png","32.png","33.png","34.png","35.png","36.png","37.png","38.png","39.png","40.png",],
minute_space: 20,
minute_align: hmUI.align.LEFT,
minute_follow: 0,
/* Seconds TXT-IMG WHite */
second_zero: 1,
second_startX: 204,
second_startY: 276,
second_array: ["41-W.png","42-W.png","43-W.png","44-W.png","45-W.png","46-W.png","47-W.png","48-W.png","49-W.png","50-W.png",],
second_space: 7,
second_align: hmUI.align.LEFT,
second_follow: 0,
enable: false,
show_level: hmUI.show_level.ONLY_NORMAL,
});
/* --------------------------------------------- END WHITE THEME ALL ELEMENTS --------------------------------- */
},
onInit() {
logger.log("index page.js on init invoke");
},
build() {
this.init_view();
logger.log("index page.js on ready invoke");
},
onDestroy() {
logger.log("index page.js on destroy invoke");
},
});
})();
} catch (e) {
console.log("Mini Program Error", e);
e &&
e.stack &&
e.stack.split(/\n/).forEach((i) => console.log("error stack", i));
}