bigdigital / xDrip-miband

Nightscout version of xDrip+ miband integration
https://bigdigital.home.blog
GNU General Public License v3.0
14 stars 16 forks source link

Watcface creation amazfit GTR2(2e), GTS2(2e) #5

Open bigdigital opened 3 years ago

bigdigital commented 3 years ago

I've moved Questions from Patreon thread

  1. is it possible to have multiple config.json for different watchfaces?
  2. In the config it says:
    "graph": { ....... "position": {

    "x":0, "y":0 Does that mean the graph is centered right in the middel of the watchface?

  3. Do you have a tip to find the right alignment, without uploading and testing it?
  4. No, it is possible to have only one config.json at the same time in xdrip folder. To get different watcfaces, you would need to replace this file together with my_watchface.bin, my_image.png and my_mask.png(if it was used).
  5. No, this means that the graph would be drawn on my_image.png and it's starting point (left top corner) would be at position 0 0.
  6. Usually i take all coordinates directly from photoshop. Please note in case of images (like arrows, graph), the position defines left top corner of the image. But in case of Text (like bg, treatments, etc), the position point may vary depending on the alignt settings. The Y coordinate is set at the base line of the text (not the most bottom, as you notice it is not at the bottom tip of the y letter, but below all other letters that doesn’t have a ‘tail’).
    1_95_RgC-580vCjGgKWksXPA The X coordinate is default set on the left side of the text. It can be changed to center or right, in this case, the staring point would look like this 1_1iK4nDltMXWu93fUDcLCtQ
twinko commented 3 years ago

@bigdigital Ok i have done some Photoshop magic :D It looks horrible so far but its pretty small. There is a lot of room to make it pretty, but not a lot of reducing the size. Perhaps i coudl reduce the size by 5-10 more kb. But i think thats the absolute maximum.

https://github.com/twinko/GTR-2-WF-Xdrip-EN/tree/main/small_v2 Could you compare the upload and processing time for this watchface with your own one?

bigdigital commented 3 years ago

The complete watchface uploading takes 6-7 seconds. I think this is not bad results IMG_20210712_211609

twinko commented 3 years ago

Sounds great. I'll try to reduce the size even more and adapt the look a little bit. Just to let you know: I used the "Save for Web" feature under Data in Photoshop. Than i reduced the colors to 8. This is possible with every image. Especially with images that have gradient. But i noticed it helps also with pictures that are only white text on a trasparent background. The file size got cut up to 1 third of the original filesize.

bigdigital commented 3 years ago

Reducing the number of colors actually not influence to the watch face size. Unfortunately, this watch model understands only 32 bit true color images with transparency. So every pixel here takes 4 bytes of the data. The watcface packer will anyway convert your 8 bit image to true color image.

bigdigital commented 3 years ago

Reducing number of the colors, was actual for miband and bip watch series. But for gtr it does not work.

twinko commented 3 years ago

hmmmm, ok, looks like my trick doesnt work. But i would love to know if Photoshop does anything elso to reduce the image size. I will create the same WF with the original images today. If that takes the same time to completly upload, my photoshop magic didnt work :D As soon as i know how to minimzie the images as good as possible, I'll create more watchfaces. But i think it shouldn take longer than the 6-7 seconds. My goal was 5 sec ^^

btw thank you for all he in depth details and testing :)

One more thing. you didnt upload the graph, would that slow down the process even more?

bigdigital commented 3 years ago

Want to add one more thing, the watch takes a packed watcface. It uses a QuickLZ algorithm to compress the watcface. I am not familiar in detail how it works, but i guess, if using a images with the same color in a row, the compression rate can be higher. This can reduce the watcface size. So maybe, the number of colors can affect the final file size. In this case watcface would be transferred faster. And i guess such watcface can be uncompressed faster on the watch itself (not sure) so this can also affect "activation" state. Regarding the graph, in this case it would be added on the background image, so the image size would be the same. The only difference can be in the compression, but i don't think adding the graph would significantly affect the uploading time. Also I'll try to make a test watcface with different varieties of number of colors ,and will see how it would affect the final size and uploading speed

bigdigital commented 3 years ago

Ok, yes, the number of colors indeed can influence the watcface uploading time because of compression. I made a watface with only one fullscreen background image. Here is my test image 0002-full and test results with full and reduced colors

uncomp size,bytes | compr size, bytes | uploading time | num of colors 824712 | 345814 | 19s | all colors 824712 | 157739 | 13s | 256 colors 824712 | 81074 | 5s | 6 colors 824712 | 24660 | 2s | 6 colors latest image has the same number of colors but another pattern 0002

So i can conclude the number of colors indeed may influence the watcface size and uploading speed, but image pattern also can affect the final size.

twinko commented 3 years ago

Hey @bigdigital ,

thank you for the investigation. Reducing colors is pretty bad for complex designs but for a simple design it would help a ton to reduce the colors in total. Sometimes you find a color thats used but not really visible on the watch.

1. Regarding compressed and uncompressed. Im a little confused by that. The watchface editor only lets me save my WF in a compressed form ("Pack and compress .bin"). -->When you mean "uncompressed", you mean all png files and the json file?

Because, my compressed .bin is way bigger than the files in the folder on my PC.

all png and json: 45 kb compressed .bin: 90 kb https://github.com/twinko/GTR-2-WF-Xdrip-EN/tree/main/01-WF%20MD225

2. Moreover i tried to implement the graph and all the xdrip data. You wrote om patreon: "Please note you should place UNCOMPRESSED watface into xdrip folder." --> Same question as above: what do you mean by "uncompressed"? Here you added: "To get different watcfaces, you would need to replace this file (config.json) together with my_watchface.bin, my_image.png and my_mask.png(if it was used)." -->Where do i get the my_image.png from? Is that the background image (0001.png) or is it the canvas.png(found it in your releace in the watcface folder of the gtr2) from your watchface? If its the canvas.png, where is that located on the watchface, because its way smaller than the whole watchface? Moreover, is it possible to place the changed config.json in the xdrip folder aswell or do i have to compile a whole new release, to be honest that doesnt sound practical :D ? As you see i have some difficulties to understand how to set everything up to have the xdrip data shown :D

3. -->One more question: Is the background of the graph invisible or does it have a solid color (is the canvas.png the background of the graph?)?

######################################

And attached the latest version of the WF. Its way better looking and reduced the size down to 90kb. But i dont see any more space to reduce the size without loosing pretty bad in looks. https://github.com/twinko/GTR-2-WF-Xdrip-EN/tree/main/01-WF%20MD225 Moreover edited a similar WF that has less gradiants. It's at about 81KB. Getting closer to your 69kb of the default .bin ;D https://github.com/twinko/GTR-2-WF-Xdrip-EN

bigdigital commented 3 years ago
  1. Yes AmazFit_Watchface_Editor_2 tool automatically "pack" and compress the watchface so as a result you will receive a packed watcface which is suitable to upload to watch, but not for xdrip (because we need to inject some additional data). Personally, i use the python tool "py_amazfit_tools" to pack the watchface https://github.com/bigdigital/py_amazfit_tools/tree/GTR2 or its fork https://github.com/Tnxec2/py_amazfit_tools/tree/GTS2. But it is possible to use the same python tool which was bundled into AmazFit_Watchface_Editor_2 tool. Here the py_amazfit_tools packer was converted to exe file (so you don't need to configure and install python on your computer). This packer is located in AmazFit_Watchface_Editor_2 under "Tools" folder. and has a name "main.exe". To pack your json you only need to navigate to tools folder and execute command like this main.exe --gtr2 47 --file config-file.json where config-file.json is a location to your json. As a result, you should receive a unpacked bin file. This file you would need to use in the xdrip. Xdrip will inject the required resource into this file, compress it and sent it to the watch.
bigdigital commented 3 years ago
  1. my_image.png is the same as canvas.png, but this is a default canvas name for custom watcface. This is the resource on which the xdrip will draw information from your custom my_config.json file. The resulting image will replace the content of the first resource in the my_watchface.bin ( you can also redefine which resource to replace by specifying "resource_to_replace" property in config file ) To use a custom watfcface you only need to place your custom files my_watchface.bin, my_image.png config.json and my_mask.png(this is an optional file) into xdrip folder and enable option "Use custom watchface" in miband menu settings.
bigdigital commented 3 years ago
  1. You can use any color for graph background. If you want the transparent background, just assign a color with alpha channel property for "bg_color" property.
twinko commented 3 years ago

HEy @bigdigital thank you for your detailed reply!

3. You can use any color for graph background. If you want the transparent background, just  assign a color with alpha channel property for "bg_color" property.

Would the following work? Or without " ?

"graph": {
    "bg_color": "rgba(0, 0, 0, 0)",

I used everything you told me above and created the following. https://github.com/twinko/GTR-2-WF-Xdrip-EN/tree/main/01-WF-MD225-Version3-xdrip-ready Im really nervouse about the .bin size. its 1MB. Thats a huge difference to your .bin i found in your release. I thought your bin is already compressed as well. Moreover i dont understand how a folder with a size of 38,5kb including the json becomes 1 MB, but whatever ;) . Btw i used the packer from AmazFit_Watchface_Editor_2.

Im not 100% sure regarding the positioning of the xdrip data. Sadly my watch still isnt shipped, i already contacted the seller, having some trouble there. Could you test the files regarding complete watchface uploading time and how it looks? If you dont have the time, let me know, I'll ask at patreon.

As soon as i have a working watchface, I'll create a guide for others to create own watchfaces. It was a steep learning curve for me :D Thank you for your support :)

*Update:

looks like i did something wrong :( https://github.com/twinko/GTR-2-WF-Xdrip-EN/issues/9#issuecomment-887797873 Would be great if you have a look :)

bigdigital commented 3 years ago

Sorry for the delay in response, was busy last week to take a look. I have long wanted to start writing a guide for creating custom watch faces, but I still can't find the time for this. It would be cool if you can do it :)

twinko commented 3 years ago

@bigdigital I'll create a guide with all the stuff i learned so far. I'll link it here and if possible I'll give you ediing rights, to add things if you feel like i missed something.

twinko commented 3 years ago

@bigdigital startet writing the guide, if you want to edit something, let me know. Than i need to figure out how to give you writing rights :) https://github.com/twinko/GTR-2-WF-Xdrip-EN

dubidrubi commented 3 years ago

1634306854391 I've created a WF for GTS2e. I took nike WF and adjusted it to make update time comparable to the built-in one from xDrip. I can share my files if anyone is interested in testing/improving the WF. BTW the only option to remove graph I've found is to make it 1x1 size.

twinko commented 3 years ago

@dubidrubi looks sweet. would be great if we could upload it here: https://github.com/twinko/xdrip-watchface-collection

Please upload the necessary files, than i upload it and add it to the collection. :)

btw thx for the update on the graph. hadn't time to tinker with it.

bigdigital commented 3 years ago

@dubidrubi Looks nice. Yep, there is no way to remove the graph. In future versions, it would be possible to do this by removing "graph" item in the config file. For now, i guess you can simply set XY graph position to the outside of the canvas.

dubidrubi commented 3 years ago

@dubidrubi looks sweet. would be great if we could upload it here: https://github.com/twinko/xdrip-watchface-collection

Please upload the necessary files, than i upload it and add it to the collection. :)

btw thx for the update on the graph. hadn't time to tinker with it.

Here you go https://ufile.io/f/rjgxn

Thanks @twinko and @bigdigital

twinko commented 3 years ago

@dubidrubi awesome, could you do me a favor and upload an gif aswell (the oes you can createwithe the watchface editor, to see a preview)?

dubidrubi commented 3 years ago

@twinko absolutely Preview

bigdigital commented 3 years ago

@dubidrubi Can i know how long watchface uploading takes for you? I see the uncompressed watchface has size 790kb. I did some optimization in your watchface, so the wathcface size decreased to 245kb . When compressed, it takes only 27kb, so i think wf uploading should be much faster now. Can you test it? my_watchface_nike_optimized_v1.bin.zip

dubidrubi commented 3 years ago

@bigdigital Thanks, indeed update time improved a bit. Before the change - 6-7 sec After the change approx 5 sec

May I know what have you changed exactly?

dubidrubi commented 3 years ago

Btw, graph position adjustment doesn't seem to be working, moving it outside the image doesn't work for me :(

bigdigital commented 3 years ago

I've cut your bg image into small parts and set them as a icons for the corresponding elements image As a main background was set a simple color.

dubidrubi commented 3 years ago

Thanks, didn't know that makes a difference.

twinko commented 3 years ago

@dubidrubi btw if you want even faster upload times, you ca reduce the size of every image by following the guide here: https://github.com/twinko/GTR-2-WF-Xdrip-guide#111-reducing-image-size

This can cut the size in half or even further and you wont notice the quality reduction on your watch. But it takes some time to modify every image.

@bigdigital @dubidrubi Wanted to upload the watchface. One question: do i need the my_image.png from dubi, can i remove it entirely or do i replace it with an image of 1 black pixel?

bigdigital commented 3 years ago

Checked my_image.png image. As i can see from @dubidrubi photo , the image size can be also decreased image i think it is possible to change image height to 51 px, without any negative consequences for watcface design. But this should also a little increase fw uploading speed. @dubidrubi can you try to do this?

dubidrubi commented 3 years ago

@bigdigital I'll definitely check it but don't have much time during the week, most likely next weekend. Also, I'm planning to add AOD with watch/BG values on it.

twinko commented 3 years ago

Hey @dubidrubi ,

i added the WF to the collection, let me know if you update the watchface, ill update the collection :) https://github.com/twinko/xdrip-watchface-collection/blob/main/README.md

regards

dubidrubi commented 3 years ago

thanks @twinko Title states BipS but it is not a Bip WF, it is GTS 2e

twinko commented 3 years ago

@dubidrubi Thank you for checking, now it should be fine :)

HaraldS76 commented 3 years ago

Thank you for your incredible work, but I have an Issue with the watchface for GTS2, it only starts synchronisation till 99% and breaks up. So what is the reason for this ? Are there any other watchfaces with xdrip+-Integreation ? How to upload the watchface-files on the watch ? (I ve tried notify for amazfit)

Is there a chance to use GTR2 watchfaces on GTS2 ? (Differences between GTS2e and GTS ?)

Hope someone will have an useful advice on my issues/problems

twinko commented 3 years ago

@HaraldS76 hi, im really confused by your questions. please specify which question belongs to which watchface? Does your first question is about the default watchface or the one provided by dubidrubi?

You can find different watchfaces (only 1 at the moment for the GTS), including a tutorial here: https://github.com/twinko/xdrip-watchface-collection If you finde more, let us know.

Its possible to convert GTR2(e) watchfaces to GTS2(e) ones, i think! Please read here for more information. I think the last releases of the watchface Editor are able to convert watchfaces. https://amazfitwatchfaces.com/forum/viewtopic.php?t=1888

mavricaaa commented 3 years ago

Hi :) Thank you for the incredible work and the guide to create something by ourselves:) I have created a WF for GTR2E if someone is interested I am happy to share it here - I am a total newbie in this so be kind to me haha. I didn't add a lot of functions as for me the steps, battery and big fonts for time are the most important things in a WF.

IMG_20211109_110139

Preview

twinko commented 3 years ago

@mavricaaa looks awesome! Does ithave AOD (always on Disply)-functionality, to see data when the screen is off?

Feel free to share the files, i will add them to the collection: https://github.com/twinko/xdrip-watchface-collection

btw is the small ":" separator in the time a mistake or did you do it intentionally? and what are your watchface upload times, how long des it take to upload the watchface?

mavricaaa commented 3 years ago

@twinko Thanks:) Puhh thanks, i uploaded the wrong separator file, I corrected it now:) I personally don't use AOD function but I have added it now, but only the BG info without the time etc. i don't know if that affects battery life. Upload time is cca 13secs, even though the files and .json together are 36Kb. The time and day of the week digits arent system fonts in this case so I guess that might be the problem, or some colors? IMG_20211109_130258 IMG_20211109_130309

twinko commented 3 years ago

@mavricaaa looks great now, btw sweet change of the strap :) Feel free to Upload the watchface files, including a final gif from the watchface editor, I will add it to the collection. Im not a pro with gira, if you finde a way to directly contribute to the collection feel free as well.

mavricaaa commented 3 years ago

@twinko I have uploaded them here I will figure out the direct way to upload it for the next time :P The upload time still bothers me so when I catch some time I will try to figure it out, but in the meantime if anyone else has and idea feel free to modify it of course:)

twinko commented 3 years ago

@mavricaaa could you do me a favor, i need to have to download every single file one after another. Please upload it as .zip or .rar :)

mavricaaa commented 3 years ago

@twinko Oh right, sorry:) I uploaded a zip now:) https://ufile.io/hpaa4q63

twinko commented 3 years ago

@mavricaaa now it says file removed ^^ Perhaps a google drive or dropbox upload is a better way.

mavricaaa commented 3 years ago

@twinko https://www.dropbox.com/s/7vhacxxhtgeyoc4/GTR2EXDRIP.zip?dl=0 OMG I am really clumsy these days -.- . I guess it was a limited time availability file sharing site. Hopefully it is okay now:)

HaraldS76 commented 3 years ago

Hi Twinko,

 

my question belongs to watchface nr. 14 for GTS2, in detail:

 

 

But: No bloodsugar values are displayed from xdrip+

 

So who can help me to find the xdrip+-folder on Android Phone and how to put the files there ?

Which part of xdrip+ you are using, the amazfit-sync-service or MiBand as Smartphone ? Is there any how to set the right buttons ?

 

Best regards

HaraldS76

   

Gesendet: Dienstag, 09. November 2021 um 11:22 Uhr Von: "twinko" @.> An: "bigdigital/xDrip-miband" @.> Cc: "HaraldS76" @.>, "Mention" @.> Betreff: Re: [bigdigital/xDrip-miband] Watcface creation amazfit GTR2(2e), GTS2(2e) (#5)

 

@HaraldS76 hi, im really confused by your questions. please specify which question belongs to which watchface? Does your first question is about the default watchface or the one provided by dubidrubi?

You ca find different watchfaces (only 1 at the moment for the GTS), including a tutorial here: https://github.com/twinko/xdrip-watchface-collection If you finde more, let us know.

Its possible to convert GTR2(e) watchfaces to GTS2(e) ones, i think! Please read here for more information. I think the last releases of the watchface Editor are able to convert watchfaces. https://amazfitwatchfaces.com/forum/viewtopic.php?t=1888

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe. Triage notifications on the go with GitHub Mobile for iOS or Android.

Klaus3d3 commented 3 years ago

Is anyone already trying to implement this to GTS/GTR3?

I already applied on huami's developer portal. But as an individual developer the access is very limited.

twinko commented 3 years ago

@mavricaaa added your WF to the collection, thank you for contribution :) https://github.com/twinko/xdrip-watchface-collection

@HaraldS76 im sorry about the missing xdrip folder, i cant help with that. You need to find it or ask the xdrip community about where to find it here (https://github.com/NightscoutFoundation/xDrip/issues). You need to upload the new watchface in the xdrip folder! Using notify - app wont work! You need to use miband, not amazfit syn service! When you found the folder, you need to follow this guide, to create a xdrip compatible watchface: https://github.com/twinko/GTR-2-WF-Xdrip-guide

@Klaus3d3 i follow artems patreon and right now he didnt wrote anything about plans to implement this to gts or gtr3. I think a much requestet watch lately was the gts 2 mini. Some days ago he puplished miband6 support.

bigdigital commented 3 years ago

@Klaus3d3 I already did some research regarding GTR3. The watcface modification in GTR3 version is now much easier, and do not require a watcface deobfuscation or any special compilation. The watcface for this watch is a simple zip package which contains a javascripts and images. The javascript defines the watcface representation and image resources are encoded with a slightly modified TGA images protocol. But since this watch has a new OS, not sure it would have a similar communication protocol. So most possibly the implementing integration for this watch would require a lot of time to reverse-engineer the communication protocol. For now, i guess, the next watcface for implementation would be a gts 2 mini. I also have plans to separate miband project from the xdrip. This would allow adding a new features and devices without touching xdrip core.

Klaus3d3 commented 3 years ago

@Klaus3d3 I already did some research regarding GTR3. The watcface modification in GTR3 version is now much easier, and do not require a watcface deobfuscation or any special compilation. The watcface for this watch is a simple zip package which contains a javascripts and images. The javascript defines the watcface representation and image resources are encoded with a slightly modified TGA images protocol. But since this watch has a new OS, not sure it would have a similar communication protocol. So most possibly the implementing integration for this watch would require a lot of time to reverse-engineer the communication protocol. For now, i guess, the next watcface for implementation would be a gts 2 mini. I also have plans to separate miband project from the xdrip. This would allow adding a new features and devices without touching xdrip core.

Thanks for looking into it. Yes, the watchfaces are much easier to design. Huami already provided a watchface editor via their developer platform. I applied as an individual developer, but sadly they don't give access to their standard sdk for this type of developer. There is also a documentation for the standard sdk. Should be pretty easy to, once you get access to the sdk. But i guess we have to missuse some other data entries like weather data to get these on the watchface directly.