Picture in a watchface

Hello,

and first of all - I know there are already several threads on this topic.

A Picture on a watchface. Done! - Discussion - Connect IQ - Garmin Forums

...

But they all didn't help me get mine running, so please let me ask for help cause I really can't see the fault.

I tried to stick to the altitude8k example but I just can't get it running

https://github.com/worksasdesigned/altitude8k

as soon as I add the resources.xml it doesn't work any more and putting the png file in the drawables folder,

listing it in the drawables.xml

         <drawables>
              <bitmap id="LauncherIcon" filename="launcher_icon.png" />
              <bitmap id="Picture" filename="everestline.png" />
        </drawables>

and calling it via

        dc.setColor(Gfx.COLOR_BLACK, Gfx.COLOR_BLACK);
        dc.clear();
       
        var picback = null;
        dc.setColor(Gfx.COLOR_WHITE, Gfx.COLOR_TRANSPARENT);
       
        picback = WatchUi.loadResource(Rez.Drawables.Picture);
        dc.drawBitmap(1, 42, picback);

only results in no errors accuring and the simulator is showing me the time but no image.

So please. Anybody any ideas?

Regards Marcus

  • That's mayfull code of the viewfile. drawables you find above:

    using Toybox.Graphics as Gfx;
    import Toybox.Lang;
    using Toybox.System as Sys;
    import Toybox.WatchUi;

    class testWFView extends WatchUi.WatchFace {
        var picback;

        function initialize() {
            WatchFace.initialize();
        }

        function onLayout(dc as Dc) as Void {
            setLayout(Rez.Layouts.WatchFace(dc));
           
        }

        function onShow() {
        }

        function onUpdate(dc) {
            dc.setColor(Gfx.COLOR_BLACK, Gfx.COLOR_BLACK);
            dc.clear();
           
            var picback = null;// FREE MEMORY    
            dc.setColor(Gfx.COLOR_WHITE, Gfx.COLOR_TRANSPARENT);
           
            picback = WatchUi.loadResource(Rez.Drawables.Picture);
            dc.drawBitmap(1, 42, picback);

            var clockTime = System.getClockTime();
            var timeString = Lang.format("$1$:$2$", [clockTime.hour, clockTime.min.format("%02d")]);
            var view = View.findDrawableById("TimeDisplay") as Text;
            view.setText(timeString);

            View.onUpdate(dc);
        }

        function onHide() as Void {
        }

        function onExitSleep() as Void {
        }

        function onEnterSleep() as Void {
        }

    }
  • When you call View.onUpdate)_ that clears the screen first so anything you draw using the dc (drawBitmap) is lost.  Include the bitmap in your layout, or don't use a layout and use dc.DrawText() to draw the time over the bitmap and comment out View.onUpdate()

  • Hey Jim,

    thanks - that was the part I didn'z understood. Ithought the view.onupdate would be essential to update the screen to see new figures ... but now it see it also works without.

    Regards Marcus