Vai al contenuto
Emanuele C

Bip WF Editor by ilGruppoTester

Recommended Posts

Ecco la guida integrale all'uso del Bip WF Editor by ilGruppoTester, scritta direttamente dai creatori dell'applicazione!

 

L'idea dell'editor nasce con i primi file res, quando per vedere l'anteprima di una watchface occerreva flashare tutto il file ed attendere svariati minuti per il caricamento, per poi magari rendersi conto che per pochi pixel bisognava rifare tutto.

Grazie ai file bin e alla possibilità di modificare il file json per cambiare gli elementi il processo era molto più veloce, ma anche in questo caso, quando è iniziato lo sviluppo, l'unico modo per avere un'anteprima era creare il file bin e flasharlo.

Via via, ai tool esistenti, sono state aggiunte la generazione della preview e sono stati creati strumenti online per l'editing, ma l'idea di base era quella di avere tutto sempre a disposizione, anche in caso di assenza di connessione, e di velocizzare ulteriormente il processo.

L'editor nasce appunto con lo scopo di avere tutto sempre sotto mano, di potere cambiare un file png “al volo” e vedere subito l'effetto.

Immaginate la comodità di lavorare con l'editor grafico aperto, salvare l'immagine ed ottenere immediatamente l'anteprima aggiornata

Quello che era partito come un progettino ad uso personale da fare a tempo perso, per risparmiare un po' di tempo nell'editing delle watchfaces, grazie agli stimoli ed al supporto de ilgruppotester, è diventato un programma da oltre 6.500 righe di codice, che ha richiesto più di due mesi di lavoro. Per questo motivo ho deciso di condividerlo con chiunque voglia cimentarsi in questo "lavoro".

Grazie ai loro suggerimenti e al feedback dei beta tester ( a questo proposito grazie a Biagio, Gianni, Luca e Paolo ), le features sono aumentate fino ad arrivare alla versione Beta 0.80, nella quale si possono creare nuove watchfaces partendo da zero, oppure editare file json esistenti, con una comoda interfaccia che consente di aggiungere/rimuovere elementi e modificare le proprietà per ognuno di essi.

Inoltre, è possibile impostare i valori degli elementi per ottenere una preview. Ad esempio, a quanti è successo che se il numero da visualizzare aumenta di una cifra, va a coprire un'altro oggetto? Ecco, in questo modo non succederà più, in quanto è possibile provarlo prima di creare il file bin.

Un minimo di conoscenza del formato json e di come vengono gestiti gli oggetti da parte del firmware è utile per capire come muoversi nel tool. Il mio suggerimento è quello di iniziare modificando watchfaces già esistenti, per prendere confidenza con le varie opzioni e capire quali proprietà influiscono su cosa.

Guida all'uso

Prerequisiti:

  • librerie VCRedist 2008

  • Bip WF editor

  • watchface.exe versione 1.0.2.8 per estrarre i file bin e/o crearli una volta terminato l’editing

Prima di iniziare

  • Se si vuole modificare una watchface esistente, è necessario prima di tutto estrarre il contenuto del file .bin. Una volta scompattato watchface, è sufficiente trascinare il file bin sopra all’icona dell’eseguibile

  • Nel caso in cui si voglia invece creare una nuova watchface, non sono necessarie operazioni particolari

 

Panoramica generale

Spoiler

 

image.png

Area checkbox per abilitare / disabilitare la visualizzazione di un oggetto. Nel caso delle icone con proprietà On / Off, la checkbox ha tre stati: oggetto non visualizzato, icona di stato OFF e icona di stato ON

image.png

Components tree : Rende possibile l’aggiunta / rimozione di oggetti dal file json.Per effettuare modifiche, occorre selezionare/deselezionare gli oggetti desiderati e cliccare sul bottone Add/Remove Features

image.png

Preview Settings: Area dove possono essere cambiati i valori mostrati nella preview. Attenzione: alcuni oggetti sono legati al valore impostato, come ad esempio Step progress: fino a che il numero dei passi inserito non permette di raggiungere un livello tale da poter essere disegnato, non ci sarà alcun riscontro visivo. Gli avanzamenti sono calcolati sull’obiettivo standard di 8.000 passi. Premendo il bottone Refresh, viene generata la nuova anteprima

image.png

Preview: qui viene visualizzata l’anteprima del risultato. Cliccando sul pulsante Save Screenshot, verrà salvato un file jpg dell’anteprima nella stessa cartella del file bin

image.png

Edit Area: selezionando un oggetto dalla dropbox, si potranno cambiare le proprietà disponibili. Cliccando sul bottone Apply, i nuovi valori verranno inseriti nel json e verrà generata una anteprima Aggiornata.

image.png

Alignment Check Area: Quando la checkbox Auto Alignment Check è selezionata, ad ogni refresh verrà eseguito un controllo dell’allineamento. Se disabilitato, è possibile forzare un controllo manuale cliccando sul bottone “Check Alignment”.

image.png

Alignment Error Nel caso in cui vengano rilevati possibili errori nell'allineamento, viene mostrato un messaggio simile a questo, riportando gli oggetti per i quali potrebbe esserci il problema. E’ possibile risolverli automaticamente cliccando sul bottone “Fix it for me!” oppure cliccare su OK per ignorare il messaggio. Per ulteriori dettagli, vedi Allineamento in “Informazioni utili”

image.png

Editor Json: E’ possibile anche intervenire manualmente sul file Json (operazione sconsigliata se non si sa bene quello che si sta facendo). Il pulsante Save Json è usato per salvare i progressi delle modifiche. Non è prevista nessuna operazione di salvataggio automatico, sarà quindi necessario salvare manualmente il file.

 

 

Istruzioni

  1. Scompattare il file zip in una qualsiasi cartella e lanciare l’eseguibile “Amazfit_Bip_WF_Editor_ilgruppotester_v090.exe”
    1.jpg
  2. All’avvio, si aprirà un'interfaccia pulita dalla quale si dovrà scegliere se creare una nuova watchface o editarne una esistente, attraverso il menu "File \ New” oppure “File \ Open”
    2.jpg
  3. In caso di nuova wf, verrà richiesto di selezionare la cartella dove creare il file json, in caso di apertura di una esistente, invece, occorrerà selezionare il file json desiderato. 
  • Se viene creata una nuova wf, un file di background sarà copiato nella cartella e la relativa parte del json verrà popolata.
    3.jpg
  • Se invece viene selezionato un json esistente, tutti gli elementi presenti nella wf verranno caricati e visualizzati, inoltre la sezione del json verrà popolata con l’intero contenuto.
    4.jpg

Da questo momento in poi, si procede allo stesso modo per entrambi i casi:

si potranno aggiungere e rimuovere oggetti semplicemente selezionandoli o deselezionandoli dalla visualizzazione ad albero “Components” e cliccando sul bottone "add/remove features". In caso di aggiunta, delle immagini di default saranno copiate nella cartella del json, in modo da avere subito un riscontro visivo.

5.jpg6.jpg

Selezionando invece un oggetto dalla dropdown list, verranno visualizzate le relative proprietà e, una volta impostate, cliccando sul bottone "Apply", i dati saranno inseriti nel json e verrà mostrata l'anteprima aggiornata.

7.jpg8.jpg

Da ricordare, il json non viene salvato automaticamente, ma sarà necessario cliccare sul bottone "Save Json".

Per avere una anteprima dettagliata del risultato, si possono cambiare i valori visualizzati attraverso l’apposita area, in maniera tale da non avere brutte sorprese quando i valori cambieranno sullo smartwatch.

9.jpg10.jpg

E' anche possibile salvare uno screenshot della watchface cliccando sul bottone "Save Screenshot": verrà creato un file jpg nella stessa cartella del json.

11.jpg

Per creare il file .bin da caricare sul bip, basta trascinare il file json sull’eseguibile di watchface.

image.png

A questo punto, gli unici limiti sono la fantasia dell'utilizzatore e la palette di colori gestita dal bip, che ricordo essere 0x000000, 0xFFFFFF, 0xFF0000, 0xFFFF00, 0xFF00FF, 0x00FF00, 0x00FFFF, 0x0000FF e il trasparente.

 

Sono già in programma ulteriori modifiche per semplificare ancora di più la creazione, ma per questo dobbiamo aspettare le prossime versioni


Changelog:

Spoiler

Release Notes v.90:


Fixed Bugs:
# Fixed draworder bug that caused time to not be displayed after bin creation
# Added exception feedback in case of json failure
# Avoid overlapping of Date \ sparated and Date \ Oneline
# Fixed a bug in Status \ Off index display
# Fixed Single line Date display
# Fixed bug in case of missing Off Status icons


Improvements:
# Wrong alignment check and alignment autofix features added
# Added guides menu in toolbar
# Unsaved changes check on app close
# Improved visual feedback in case of wrong bottom coordinates
# Default Background is displayed at startup to have UI already set

Guida completa alle funzionalità

 

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Bip WF editor

Cita

 

Error (429)

This link is temporarily disabled. The person who shared it hit their daily limit of traffic or downloads. Learn about traffic limits.

 

watchface.exe 

Cita

That link has no power here

Return to the previous page or go back to your dashboard.

 

Reupload ? THX ...

Modificato da Luba

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti
11 ore fa, sergio1970 dice:

Purtroppo non riesco a scaricare  watchface.exe da ancora errore

Se puoi riaggiornare, grazie

Ciao il link era corretto , c'era solo uno spazio di troppo. Riprova

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Buongiorno a tutti, prima di tutto grazie per questa guida è davvero fantastica!!

Vorrei chiedere, se possibile ovviamente, se qualcuno che ha già provato ad usare questo tool se mi può indicare come si gestiscono i colori dei vari componenti delle watchface, perché ho provato a modificarne una esistente ma non trovo il modo per cambiare il colore di alcuni elementi.

Grazie anticipatamente a chi vorrà darmi delucidazioni.

Edit.

Ho risolto da solo, bisogna modificare i vari file all'initerno del file json. Grazie comunque!

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Ciao a tutti ragazzi ho un problemino, io sto provando questo programmino e  sto provando a editare una watchfaces e ho riscontrato un po di problemi:

 

Usando la base creata con la temperatura che funziona correttamente ho cambiato il carattere usando quello di altri numeri e editando il simbolo del meno e dei gradi,
1_temperatura con i setting della prima foto tutto va bene ma nel momento in cui carico la wf la temperatura su display si vede solo qualche istante e poi sparisce per riapparire se "sblocco" l'orologio sempre e solo qualche istante

caso1.JPG.d0c1897d07b399478ed9b339627039c6.JPG
2_rimuovendo la funzione e ricreandola cosi da impostare i valori da 0 non riesco nemmeno ad allieneare le  cifre e mi sballano se passo da cifra sigola a doppia cifra o addirittura col meno davanti.

caso2b.thumb.JPG.85dad2443111cae34d7b07b1246a9a8f.JPGcaso2.thumb.JPG.c1ab1cacd43c65f080d9431ccbeeb649.JPG

3_un problema di allineamento l'ho avuto anche con il battito cardiaco, i numeri si allineano a partire da sinistra nonostante io provi a cambiare l'allineamento

 

4_il draw order cosa è?

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Ciao, ecco le risposte in ordine:

Per quanto riguarda il punto 1, potrebbe essere un problema legato alla presenza dei secondi. In numerose wf, se allineati ad altri elementi diversi dall'ora, ci sono stati problemi di questo tipo. Puoi provare a rimuoverli per fare un test della wf.

I punti 2 e 3 sono legati tra di loro: usando l'allineamento a destra, le coordinate Top e Bottom non possono coincidere, in quanto devono formare  un riquadro all'interno del quale verranno disegnati i png. Se la dimensione delle immagini è superiore a quella del rettangolo, il bip allinea a TopLeft, prendendo come coordinate iniziali TopLeftX e TopLeftY.

4. Draw order viene usato per ottenere effetti di sovrapposizione sull'ora. un esempio si trova sulla watchface stock con la casetta innevata dentro mifit

Nelle prossime release la gestione degli allineamenti verrà migliorata, ma se vuoi mandarci lo zip della wf possiamo controllare più da vicino il problema

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Ciao. Ho una domanda: e' possibile mettere sulla watchface l'indicazione del barometro?

Per intenderci e' quella che si trova nel menu' della "bussola ", nel riquadro in basso a destra,

con l'indicazione  Pressure (hPa).

 

Grazie

Alfio

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Ciao, al momento non è possibile integrare la pressione nelle WF. Se in futuro l'opzione si renderà disponibile provvederemo a integrarla anche nell'editor!

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Salve a tutti,

volevo utilizzare questo editor per modificare della WF ma, una volta aperte, non compare la preview rendendo impossibile verificare le modifiche.

Forse sbaglio qualcosa io....

questo è il file di log:

Traceback (most recent call last):
  File "Amazfit_Bip_WF_Editor_ilgruppotester_v092.py", line 7231, in changeJson
  File "Amazfit_Bip_WF_Editor_ilgruppotester_v092.py", line 7113, in openJson
  File "Amazfit_Bip_WF_Editor_ilgruppotester_v092.py", line 2876, in drawpreview
TypeError: list indices must be integers, not str

utilizzo windows 10 64bit

P.S.: se invece creo una WF la preview funziona correttamente

Grazie 1000

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Crea un account o accedi per lasciare un commento

You need to be a member in order to leave a comment

Crea un account

Iscriviti per un nuovo account nella nostra comunità. È facile!

Registra un nuovo account

Accedi

Sei già registrato? Accedi qui.

Accedi Ora

×