[GUIDA][M10] Virtuous Ten Studio

[cesco]

Premessa:

cos'e' Virtuous Ten Studio (VTS) ?
VTS e' un programma di Reverse Engineering per decompilare, modificare e ricompilare QUALSIASI tipo di Apk. Nel nostro caso, serve per decompilare e ricompilare i file .M10, un nuovo tipo di file introdotto da htc che contiene tutte le immagini e il necessario perche' la skin funzioni e che non e' decompilabile utilizzando un semplice programma di gestione archivi.
Il programma e' free to use, ma la versione unregistered, alla ricompilazione, aggiunge un watermark a tutte le immagini che sono state modificate ( una piccola V semitrasparente). La licenza d'uso invece costa 15 euro e puo' essere effettuata qui : Get a License

Capitolo 1 : Modificare le skin stock

Necessario:

• Windows Vista e successivi
• Microsoft Net Framework : .NET Framework
• Java Runtime (JRE) : Java Runtime
• Virtuous Ten Studio: Virtuous Ten Studio
• Una Rom Sense ICS o JB da cui estrarre questi files ( in /system/app):
  
  • com.htc.resources.apk ( il framework, ci servira' dopo)
  • fusion.apk (Skin)
  • Aluminium.apk (Skin Alluminio)
  • Concrete.apk (Skin Cemento)
  • Graphite.apk (Skin Grafite)
  • Matte.apk (Skin Opaca)
  • Steel.apk (Skin Acciaio)

Preparazione delle Skin per VTS:

• con un gestore di archivi, tipo 7zip o winrar aprite senza scompattare il fusion.apk e la skin che volete modificare ( per esempio Concrete.apk)
• nel fusion.apk andate nella cartella Assets
• nel Concrete.apk andate nella cartella Assets
• prendete la cartella Concrete nel fusion.apk e trascinatela nella cartella Assets del Concrete.apk
• ora nella cartella Assets nel Concrete.apk dovreste avere 2 cartelle: Image e Concrete (vedi immagini qui sotto)

Spoiler:

Impostare Correttamente VTS:

• Aprite VTS
• cliccate su File
• poi Open Settings
• andate alla voce Frameworks
• in basso vedrete il pulsante Add Framework [tag]
• nel campo tag inserite un nome per il framework che andremo ad importare ( ad esempio HOX-tag)
• cliccate ora il pulsante Add Framework
• cliccate su import
• selezionate il file com.htc.resources.apk
• una volta importato premete OK
  
  Spoiler:
  

Decompilazione della skin:

• cliccate File > New Project
  
  Spoiler:
  

  [IMG]http://dl.dropbox.com/u/13475549/VTS/newproj1.PNG[IMG]

• nel campo Project name date un nome al vostro progetto ( es: ConcreteMod)
• nel campo Solution name inserite un nome di riferimento ( es: Concrete.Mod)
• cliccate Apk-Tool e selezionate il Framework Tag creato prima (HOX-Tag)
  
  Spoiler:
  
• cliccate Smali e nel campo API Level selezionate Android 4.1 (flaggate anche l'opzione Use Smali Debug Output)
  
  Spoiler:
  
• cliccate M10-Engine, flaggate Use M10-Tools to decompile M10 files, nel campo Sense Version selezionate Sense 4.5
  
  Spoiler:
  
• cliccate Import e cliccate il pulsante con i 3 puntini [ ... ]
• al campo Local file, cliccate il pulsante con i 3 puntini e importate la skin modificata precedentemente con winrar o 7zip (es: Concrete.apk)
  
  Spoiler:
  
• cliccate Import
• cliccate OK per avviare la decompilazione dell'APK

[cesco]

Setup iniziale del nuovo progetto:

Editare l'AndroidManifest.xml:

• Aprite il file AndroidManifest.xml
• editate il valore package, ad esempio da:
  

   package="com.htc.skin.Concrete"

  in :
  

  package="com.htc.skin.ConcreteMod"

  Spoiler:
  
  
  
• premete la piccola [X] in alto e salvate il file

Editare l'Arrays.xml :

• andate in res/values e aprite il file Arrays.xml
• editate le righe 18 e 20 rimuovendo la parola reference- ma lasciando intatta la sintassi, ossia da:
  

  <reference-array name="carousel_colors">
          <item>@color/overlay_color</item>
      </reference-array>

  in
  

  <array name="carousel_colors">
          <item>@color/overlay_color</item>
      </array>

  Spoiler:
  
  
  
• premete sulla piccola [X] e salvate il file

Editare lo Strings.xml:

• in res/values aprite il file Strings.xml
• editate il nome della skin in questo modo:
  da
  

  <resources>
      <string name="skin_name">Concrete</string>
  </resources>

  in
  

  <resources>
      <string name="skin_name">Concrete Mod</string>
  </resources>

  NB: qui potete inserire anche degli spazi nel nome
  
  
  Spoiler:
  
  
  
• cliccate sulla [X] e salvate il file
  NB2: nella cartella res vedrete anche diverse cartelle nominate Values-en, Values-it ecc ecc, contenenti uno Strings.xml, questo file contiene il nome da visualizzare nella schermata di scelta della skin per le varie lingue di sistema, quindi se andate in values-it e modificate lo strings.xml in esso contenuto, potrete modificare il nome che verra' visualizzato per la lingua italiana ( es: Cemento Mod). Modificatelo come descritto nelle righe precedenti
  
  
  Spoiler:
  

Modificare il nome della cartella in Assets:

• andate in Assets
• vedrete le 2 cartelle Image e Concrete
• tasto destro del mouse su Assets e cliccate su Open in Explorer
• rinominate la cartella Concrete con lo stesso nome che avete inserito sia nel Project Name all'inizio della decompilazione, sia nell'AndroidManifest.xml
• tornate in VTS, premete il tasto destro sul progetto e cliccate Reload Project
• il risultato dovra' essere simile a questo:
  
  Spoiler:
  

Editare le immagini in Assets/SkinName:

• andate in Assets
• cliccate il tasto destro sulla cartella prima rinominata e cliccate Open in Explorer
• navigate fino a /Drawable/Shared/Images
• ora, con un editor di immagini come Photoshop o GIMP editate le immagini come volete, inserendo trasparenze, cambiando colori ecc ecc
• quando avete finito ( e ci vorra' MOOOOLTO tempo) tornate in VTS
  
  Spoiler:
  

Editare le immagini in res/drawable-xhdpi :

• in questa cartella sono custodite delle immagini particolari. Queste immagini vengono infatti definite "ninepatch" e se notate, il nome dell'immagine e' sempre xxx_yyy_zzz.9.png. Immagini particolari in quanto android e' in grado di allungarle e allargarle automaticamente per adattarsi ai diversi formati, riducendo cosi' il numero di immagini da dover modificare ( ma restano comunque moltissime).
• per modificare queste immagini potete utilizzare, come sopra, qualsiasi editor di foto vogliate, avendo pero' cura di lasciare un bordo di almeno 1 pixel intorno all'immagine
• tornate in VTS
• aprite l'immagine che avete modificato facendo doppio click
  
  
  Spoiler:
  
  
  
  
• cliccate Edit 9Patch
• si aprira' una schermata come questa:
  
  
  
  Spoiler:
  
  
  
  Spiegazione:
  

  il bordo di 1pixel lasciato prima ci serve ora per inserire dei pixel neri che avranno diverse funzioni:
  

  • i lati destro e quello in basso servono per indicare dove il sistema potra' inserire contenuti
  • i lati sinistro e in alto servono invece per indicare quale parte dell'immagine potra' essere allungata/stirata dal sistema per adattarsi ai diversi formati.

  
  
  per i lati sinistro e in alto e' importante sottolineare che:
  

  • se avete delle immagini con bordi arrotondati, dovrete lasciare i bordi senza i pixel al bordo e "selezionare" solo la parte centrale fra i bordi.
  • Se utilizzate immagini con una texture, dovrete selezionare tutto il lato esclusi gli eventuali bordi arrotondati, altrimenti la texture verra' stirata
  • Se utilizzate un'immagine monocromatica, potete anche solo inserire un pixel sul bordo, piu' o meno centrato sul lato

  
  per i lati destro e in basso, solitamente si seleziona tutto il lato, bordi inclusi

• quando avete finito cliccate File > save 9-patch e chiudete la finestra

Editare il Colors.xml :

Se volete potete editare anche i colori con i quali verra' visualizzato o evidenziato il testo, oppure i colori di highlight quando premete un tasto.
per farlo andate in res/values e aprite il file colors.xml
qui vedrete diversi valori sottolineati in colori diversi. Ebbene, quel codice sottolineato corrisponde al colore della sottolineatura.
se volete , potete cambiare questi valori e impostare il colore che preferite.
Attenzione a mantenere lo stesso formato #RRGGBB oppure #AARRGGBB ( sul web si trovano diversi tools online per la scelta dei colori che indicano anche il relativo codice #AARRGGBB )

Spoiler:

una volta fatto salvate!

[cesco]

Compilazione e installazione della skin:

una volta editati tutti i file e apportate tutte le modifiche che volete dovete compilare il vostro progetto, per farlo dovrete semplicemente cliccare sul tasto Build All

Spoiler:

una volta compilata la skin avete 2 possibilita':

• o cliccare sul tasto Binary, copiare manualmente il file sul telefono e installarlo manualmente con un file explorer
• oppure, impostare VTS per installarlo direttamente quando voi glielo direte.

Per configurare l'installazione "automatica":

• cliccate con il tasto destro sul progetto, poi su Properties
  
  Spoiler:
  
• scorrete la schermata fino in fondo e selezionate Use Adb Install
  
  Spoiler:
  
• premete ok e la configurazione e' terminata

installazione automatica:

• collegate il telefono al PC
• fate click destro sul progetto e cliccate push to device
• sul display del telefono non vedrete nulla, ma se andrete in impostazioni > personalizza > skin, troverete la vostra skin correttamente installata e pronta all'uso!

[cesco]

Capitolo 2 : Lavorare con gli M10

A HUGE thanks to XDA Member Il Duce for his amazing Guides: [MODS][SENSE 3.0+] The M10 Code Discovery Thread

Questa parte si distacca totalmente dalla modifica delle skin, in quanto, lavorando sui file X10 contenuti negli M10, e' possibile definire la posizione, la scala e l'aspetto degli oggetti sullo schermo. Questo tipo di modifica e' relativamente semplice, sostanzialmente si tratta di lavorare su valori numerici semplici, i quali definiscono la posizione o la scala dell'oggetto sullo schermo.
Per questa parte della guida cominceremo con qualcosa di semplice, ossia la lockscreen, visto che contiene relativamente pochi oggetti e avete parecchio spazio libero per vedere quello che state facendo. Ora procediamo:

• iniziate un nuovo progetto in VTS ( assicuratevi di non crearlo all'interno di una soluzione gia' aperta)
• selezionate M10-Project
• per ora lasciate i campo "project name " e "solution name" vuoti
• selezionate Import e importate l'apk della lockscreen ( Idlescreen_Base.apk , posto in /system/app )
• una volta fatto cliccate Project
• inserite un nome a piacere in Solution Name premete OK e aspettate che finisca di decompilare il tutto

ora, nel Solution Explorer andate in /Assets/Port . Qui vedrete una sfilza di cartelle , ognuna contente un file .X10. Ogni cartella corrisponde ad un Oggetto o "Contenitore" della lockscreen.

una spiegazione veloce sugli X10 piu' importanti:

• lockscreen_buttons : definisce le proprietà dei bottoni che vengono visualizzati quando si riceve una chiamata o si attiva la sveglia ecc ecc
• lockscreen_container : e' il contenitore principale e definisce le proprietà dei contenitori figli ( posizione dell'area delle shortcuts, o dell'area del lock ring ecc ecc )
• lockscreen_ring : definisce le proprietà del lock ring ( posizione, offset, scala ecc ecc )
• lockscreen_ringcontainers : definisce le proprietà delle animazioni della lockscreen
• lockscreen_shortcut : definisce le proprietà dei singoli shortcut ( posizione, testo, scala , ecc ecc )
• lockscreen_time : definisce le proprietà dell'orologio, incluse data e carrier
• tutti gli altri sono i vari widget della lockscreen ( musica, notifiche, sveglia, timers ecc ecc )

Come editare i valori:

angolo in basso a destra: Valore Position 0:0:0 e direzione dei valori positivi
croce al centro: valore Offset, ossia lo spostamento rispetto la posizione impostata, indicati vedete la direzione dei valori negativi/positivi
SC-1/2/3/4 : gli Shortcut e relativo testo

studiatevi bene questa immagine, poichè e' fondamentale ricordare almeno la direzione dello spostamento.

Se date un'occhiata ai valori di offset e position aprendo un X10, vedrete tre valori tipo 0:0:0.

il primo valore indica lo spostamento orizzontale
il secondo valore indica lo spostamento verticale
il terzo valore indica lo spostamento diagonale

• E' consigliabile editare solo i primi 2 valori, ossia orizzontale e verticale, in quanto piu' semplici da comprendere e modificare.
• E' importante capire quanto valgano questi valori: ebbene, ogni punto di spostamento corrisponde ad 1 pixel, quindi se il vostro dispositivo ha risoluzione di 720x1080 pixels, questo sara' mediamente il vostro range d'azione.
• I valori inseribili devono essere numeri interi, quindi 10:-40:0 e' OK, mentre 3.6:12.5:0 produrra' un errore
• Il valore di Offset e' relativo al valore position e viceversa, quindi, se Position e' 0:0:0 e Offset e' 360:0:0, l'elemento sara' spostato a DESTRA di 360 pixels, il risultato sara' il medesimo se imposteremo Position a 360:0:0 e Offset a 0:0:0. Con valori negativi lo spostamento e' a SINISTRA e lo stesso discorso e' valido per lo spostamento verticale.

Anche il valore CenterScale e' importante nel caso in cui vogliate ridimensionare determinati elementi, quali widgets, orologio, data/carrier. In questo caso i valori inseribili possono essere anche numeri con virgola ma SEMPRE POSITIVI, quindi, andranno bene valori come 0.8, 0.362 ma non valori come .4. Inserendo un valore superiore a 1 otterremo un ingrandimento dell'immagine, mentre inserendone uno inferiore otterremo un rimpicciolimento. Per non deformare l'immagine i valori dovranno essere tutti e 3 uguali.

Esempio Pratico:

• innanzitutto effettuate un backup del progetto andando nel menu backups e creandone uno nuovo ( ci servira' se vorremo tornare allo stato iniziale in modo rapido e indolore)
• nel progetto aprite il file lockscreen_time.X10
• Espandete il campo text.lockscreentime_operator e editate l'offset da 0:0:0 a 180:0:0 ( spostiamo il nome dell'operatore telefonico a destra di 180 pixels )
• Espandete il campo text.lockscreentime_time e editate l'offset da 0:0:0 a -180:0:0 ( spostiamo l'ora a sinistra di 180 pixels)
• Espandete il campo text.lockscreentime_ampm e editate l'offset da 0:0:0 a -180:0:0 ( spostiamo di 180 pixels a sinistra l'indicazioen "AM/PM" che sara' quindi vicina all'ora )
• Espandete il campo text.lockscreentime_date ed editate l'offset da 0:0:0 a -100:100:0 ( spostiamo la data di 100 a sinistra e di 100 in basso)
• Salvate il file
• compilatelo con Build All e dopo aver collegato il dispositivo al PC premete "Push All"
• per vedere immediatamente l'effetto, cliccate ADB Shell e digitate

  am force-stop com.htc.idlescreen.shortcut

• premete invio, spegnete e riaccendete lo schermo del dispositivo e voilà! ecco la prima modifica effettuata!

ora, visto che questo e' solo un esempio e ovviamente serve solo per dimostrarvi in modo pratico il funzionamento, in VTS andate su backups, ripristinate il backup fatto all'inizio, clickate Build All, poi Push All, ridate il comando in ADB Shell e sarete tornati alla lockscreen stock.

Un esempio di cio' che è possibile fare:

Spoiler:

Appena possibile aggiungero' ulteriori esempi

[cesco]

bene, la guida per ora e' pronta all'uso!
e gia' che ci sono, questo post me lo tengo di riserva per eventuali aggiunte :P
Divertitevi!

[cesco]

nuova parte sugli M10
( e mi riservo pure questo visto che posto solo io in sto thread LOL )

[Richtc]

nuova parte sugli M10
( e mi riservo pure questo visto che posto solo io in sto thread LOL )

Molto bella e dettagliata la guida degli m10! un thanks solo perchè immagino benissimo quanto ti sei rotto a scrivere tutto

Edit: aggiungi che la modifica alle righe 18 e 20 dell'array.xml è da fare solo per la sense 4+..nella sense 4.1 non serve

[cesco]

Molto bella e dettagliata la guida degli m10! un thanks solo perchè immagino benissimo quanto ti sei rotto a scrivere tutto

ma no, nemmeno tanto :P
i concetti sono semplici in fin dei conti

[cesco]

Un regalino di natale ( per One-X):

Apk modificati:

IdleScreen_base.apk
IdleScreen_Music.apk
IdleScreen_People.apk
IdleScreen_Photo.apk
IdleScreen_Productivity.apk
IdleScreen_Social.apk
IdleScreen_Stock_Yahoo.apk
IdleScreen_Weather.apk
HtcClockWidget.apk

Modifiche Effettuate:

spostato anello di sblocco
spostate le shortcuts
spostati ora e data
rimosso nome operatore
notifiche trasparenti ( chiamate perse, messaggi, musica, sveglie, timer ecc ecc)
modificati i vari temi della lockscreen (produttività, meteo, musica, azioni, FriendStream, contatti)

Screenshots:

Spoiler:

Download:

NB: Copiate manualmente i file in /system/app con un explorer e impostate le autorizzazioni su RW-R-R
ShiftedUP_lockscreen.rar

fatemi sapere se vi piace

[maurides]

ciao Cesco,oggi avevo un po' di tempo e ho provato questo tool la spiegazione e' chiara ma io sono riuscito egualmente a bloccarmi infatti in fondo al processo mi appare questo(MatteMod:decompiling resource files failed)un altra cosa ho messo la spunta a generate code java sbagliato?