Hi, i try to create a structure to make my own watchface, i have very little developing background, i achieve to understand how to create placeholders for heart rate, date and such, but i can't find any method reliable to draw a bitmap behind everything.
Actually my project look like this :
XML Files :
Here's the drawables including my bitmap:
<drawables>
<bitmap id="background" filename="download.png" />
<bitmap id="LauncherIcon" filename="launcher_icon.png" />
</drawables>
Here's the data i want to update :
<layout id="WatchFace">
<label id="BatteryDisplay" x="center" y="center" font="Graphics.FONT_SMALL" justification="Graphics.TEXT_JUSTIFY_CENTER" color="Graphics.COLOR_RED" />
<label id="TimeDisplay" x="center" y="top" font="Graphics.FONT_SMALL" color="Graphics.COLOR_RED" justification="Graphics.TEXT_JUSTIFY_CENTER"/>
<label color="Graphics.COLOR_RED" font="Graphics.FONT_SMALL" id="DateDisplay" justification="Graphics.TEXT_JUSTIFY_CENTER" x="center" y="bottom"/>
<label color="Graphics.COLOR_RED" id="HeartrateDisplay" font="Graphics.FONT_SMALL" justification="Graphics.TEXT_JUSTIFY_CENTER" x="left" y="center"/>
</layout>
Code :
using Toybox.Graphics;
using Toybox.Lang;
using Toybox.System;
using Toybox.Time;
using Toybox.Time.Gregorian;
using Toybox.ActivityMonitor as Mon;
using Toybox.WatchUi;
class MyView extends WatchUi.WatchFace {
var myBitmap;
function initialize() {
WatchFace.initialize();
}
// Load your resources here
function onLayout(dc) {
setLayout(Rez.Layouts.WatchFace(dc));
}
// Called when this View is brought to the foreground. Restore
// the state of this View and prepare it to be shown. This includes
// loading resources into memory.
function onShow() {
}
// Update the view
function onUpdate(dc) {
View.onUpdate(dc);
setBatteryDisplay();
setDateDisplay();
setClockDisplay();
setHeartrateDisplay();
}
function onHide() {
}
function onExitSleep() {
}
function onEnterSleep() {
}
private function setClockDisplay() {
var clockTime = System.getClockTime();
var timeString = Lang.format("$1$:$2$", [clockTime.hour, clockTime.min.format("%02d")]);
var view = View.findDrawableById("TimeDisplay");
view.setText(timeString);
}
private function setDateDisplay() {
var now = Time.now();
var date = Gregorian.info(now, Time.FORMAT_LONG);
var dateString = Lang.format("$1$ $2$, $3$", [date.month, date.day, date.year]);
var dateDisplay = View.findDrawableById("DateDisplay");
dateDisplay.setText(dateString);
}
private function setBatteryDisplay() {
var battery = System.getSystemStats().battery;
var batteryDisplay = View.findDrawableById("BatteryDisplay");
batteryDisplay.setText(battery.format("%d")+"%");
}
private function setHeartrateDisplay() {
var heartRate = "";
if(Mon has :INVALID_HR_SAMPLE) {
heartRate = retrieveHeartrateText();
}
else {
heartRate = "";
}
var heartrateDisplay = View.findDrawableById("HeartrateDisplay");
heartrateDisplay.setText(heartRate);
}
private function retrieveHeartrateText() {
var heartrateIterator = ActivityMonitor.getHeartRateHistory(null, false);
var currentHeartrate = heartrateIterator.next().heartRate;
if(currentHeartrate == Mon.INVALID_HR_SAMPLE) {
return "";
}
return currentHeartrate.format("%d");
}
}
So i don't know if someone can share a working code, even only a code who JUST draw a bitmap on the screen. The SDK samples do a *** ton of others useless things for my case and it mess my mind even more. I tried to understand the primates one, but nothing worked :/
Display data placeholders was an easy task, but i can't find a clue on internet for bitmap drawing ...
Please help me, i'll struggle an entire month on this *** if nobody comes xD