2010-04-26 12 views

risposta

11

This è il collegamento più semplice che ho trovato su questo argomento.

+0

Modifica alla risposta accettata, poiché questo collegamento fornisce migliori informazioni sulle caratteristiche di bordo stropicciato e contrappeso. – Roddy

7

Basta dare un'occhiata a un'immagine 9 patch in un visualizzatore di immagini. È semplicemente un bordo di 1px con pixel neri che fiancheggiano le aree estensibili e trasparente che segna le parti statiche.

Se si esegue lo zoom in questa immagine si può vedere che segna il bordo nero l'area estensibile:

example http://web6.twitpic.com/img/91916457-a53b6866db73378bda07c039151c69aa.4bd6119a-full.png

+0

Speravo in una specifica documentata, ma credo sia abbastanza buono! – Roddy

+0

Non penso ci sia più bisogno di documentazione, dato che è solo un normale png con un bordo di 1 pixel. – stealthcopter

+0

Non sono completamente chiaro su come viene interpretato il bordo di 1 pixel, in particolare con selezioni di pixel non contigue, e la differenza tra margini superiore e inferiore. – Roddy

6

Suggerisco caldamente di non implementare il sistema 9patch su altre piattaforme, per diversi motivi.

Ho utilizzato gli strumenti di sviluppo di Android per un anno e ho fatto ampio uso di file 9patch.

Sono un incubo. PNG non è un formato dati, è un formato immagine. Mescolare i due nel file .9.png è un problema.

I file a 9 patch sono una cattiva idea perché combinano formati di immagini e dati in un unico file che non è né completamente gestibile da un progettista né da uno sviluppatore.

Nove file di patch: rimpiangerete il vostro coinvolgimento ad un certo punto durante la fase di manutenzione, supporto e aggiornamenti.

Forse se in qualche data futura il supporto per i file 9patch viene aggiunto a un numero di strumenti di qualità (ad esempio, PS CS4 non comprende i file 9patch come formato specifico, né rispetta le regole dei nove formati di patch validi .)

Gli strumenti esistenti per nove file di patch sono terribili - essenzialmente inutilizzabili secondo la maggior parte dei progettisti che ho assunto.

+0

+1 per una visione forte - Sono d'accordo che gli strumenti non sono grandi. Tuttavia, dato che ho bisogno della funzionalità 9-patch di immagini 'espandibili', quale alternativa ho? Reinventare la ruota potrebbe essere anche più stupido. – Roddy

+1

Penso che il concetto di 9 patch sia un esempio di una grande idea implementata nel modo peggiore possibile. Un altro approccio sarebbe quello di avere un file PNG (standard di settore) e un formato XML che includesse 4 dimensioni. Estendi X, Estendi Y, Pad X e Pad Y. Quindi, utilizza un parser personalizzato (XML anziché PNG) e quindi manipola il PNG per estenderlo. In questo modo, il tuo PNG è ancora riutilizzabile per altre cose (e funziona in Photoshop) e il tuo mercato di layout è in XML dove i programmatori possono usarlo facilmente. –

+2

Sono totalmente in disaccordo con Cory qui. Ho usato PNG a 9 patch in Photoshop per 10 mesi e funzionano come un fascino. infatti, la mia interfaccia utente sembra nitida con questa tecnica, è grandiosa! –

1

Browser moderni supportano CSS sfondi basati 9-path: http://www.css3.info/preview/border-image/

+0

nice link, il testo introduttivo motiva i 9 parametri; quindi la patch 9 è una definizione esplicita delle 9 aree di interesse per posizionare la bitmap nelle coordinate della tela? – Vass

0

ho messo un po 'per capire che l'estensione del file 9 cerotto deve essere xxxx.9 e non xxx.9.png

+0

in questo caso ignora completamente i 9 dati della patch – MrJre

1

Ho trovato questo collegamento molto utile: link to blog post. Usa alcuni esempi per i diversi bordi definiti quando viene creata una patch. Mostra come vengono utilizzate le informazioni extra nel ridimensionamento delle dimensioni delle immagini (x, y).

C'è persino un bel commento di un Richard L. alla fine che dice come è possibile aggiungere regioni da proteggere dal ridimensionamento dell'immagine includendo interruzioni nei bordi; per esempio. non ridimensionare le sezioni nell'immagine.