Autore Topic: Immagine interattiva  (Letto 660 volte)

Offline Melanogaster

  • Utente normale
  • ***
  • Post: 260
  • Respect: +11
    • Mostra profilo
  • Dispositivo Android:
    SII
  • Sistema operativo:
    Kubuntu
Immagine interattiva
« il: 18 Febbraio 2012, 23:29:25 CET »
0
Ciao a tutti,
spero di capitare nell'area giusta :)

Vorrei realizzare un'immagine interattiva per l'utente (partendo da un'immagine png), ovvero che, a seconda di dove l'utente punta, inneschi un evento particolare.
Una sorta di sitemap che si faceva un tempo con l'HTML...pensavo infatti di suddividere l'immagine in tante porzioni quadrate, e far partire l'evento o no a seconda della porzione cliccata. Ma mi sembra una soluzione troppo "old style".

Avete qualche suggerimento?
Grazie in anticipo.

Offline al_chiappone

  • Nuovo arrivato
  • *
  • Post: 23
  • Respect: +2
    • Mostra profilo
  • Dispositivo Android:
    Samsung GT-S5570
  • Play Store ID:
    Stefano Benamati
  • Sistema operativo:
    Ubuntu
Re:Immagine interattiva
« Risposta #1 il: 19 Febbraio 2012, 00:27:46 CET »
+2
Se hai la possibilità di editare l'immagine ci sarebbe un metodo semplice, elegante e che ti permette anche di creare mappe di qualsiasi forma.

Basta solo che sacrifichi uno o due dei bit meno significativi di ogni pixel e codifichi l'azione da compiere in questi bit, poi quando l'utente tocca il display leggi il pixel in corrispondenza del punto toccato, estrai i bit meno significativi, ricavi il valore codificato e con un semplice switch scegli l'azione da compiere.

Mi spiego meglio, supponiamo che hai meno di 7 aree da definire, questo significa che ti bastano appena 3 bit per identificare tutte le aree (2^3 = 8).

1) prendi la tua immagine e azzera in ogni pixel il bit meno significativo di R, G, B
2) stabilisci la codifica, ovvero a quale numero corrisponde ogni area
3) edita l'immagine in modo che ogni pixel appartenente all'area prescelta abbia nel bit meno significativo di R, G, B la codifica binaria del numero associato all'area. Per esempio, se l'area ha associato il numero 5 il valore del pixel sarà:

R = xxxxxxx1
G = xxxxxxx0
B = xxxxxxx1

dove xxxxxxx è il valore originale del pixel e 101 è la codifica binaria di 5 che nel nostro esempio è il codice associato alla nostra area.

Modificare il bit meno significativo di ogni pixel non comporta una differenza percettibile nell'immagine.

4) Quando l'utente tocca lo schermo prendi le coordinate, estrai il pixel, metti insieme i 3 bit meno significativi e trasformali in un numero, poi usa questo numero in uno switch per selezionare l'azione appropriata.

Con questa tecnica puoi creare aree di qualsiasi forma e dimensione. Se ti servono più di 8 aree basta che sacrifichi più bit del pixel.

Offline Melanogaster

  • Utente normale
  • ***
  • Post: 260
  • Respect: +11
    • Mostra profilo
  • Dispositivo Android:
    SII
  • Sistema operativo:
    Kubuntu
Re:Immagine interattiva
« Risposta #2 il: 22 Febbraio 2012, 14:13:32 CET »
0
Innanzitutto grazie per la tua dettagliatissima risposta.
Potrebbe essere un inizio...
Seguendo la tua logica, dimmi se ho capito bene, dovrei cercare su internet le seguenti informazioni:
- come ottenere x,y in cui si clicca in un immagine
- ottenere il colore in RGB da tale coordinata

Spero di trovare abbastanza informazioni online, magari con un po' di codice gia' pronto...non sarebbe male :)

Offline al_chiappone

  • Nuovo arrivato
  • *
  • Post: 23
  • Respect: +2
    • Mostra profilo
  • Dispositivo Android:
    Samsung GT-S5570
  • Play Store ID:
    Stefano Benamati
  • Sistema operativo:
    Ubuntu
Re:Immagine interattiva
« Risposta #3 il: 22 Febbraio 2012, 17:49:30 CET »
0
Esatto, hai capito bene...

La cosa più importante è riuscire ad editare un'immagine in modo che i bit meno significativi abbiano il valore che ti servono; se l'immagine la generi tu dovrebbe essere facile con Gimp o Photoshop.