2013-11-25 7 views
6

po 'di contesto:Android - Tela OnDraw con camara ingrandita seguenti movimenti dei personaggi

sto creando un gioco per Android che disegna un labirinto su una tela un'immagine di sfondo contro, questo utilizza un blocco quadrato e quindi il labirinto è sempre automtically ingrandito fino a 5 x 5 quadrati, di un labirinto che può essere 20 x 20. Il labirinto viene disegnato semplicemente scorrendo attraverso una serie di cicli for e quindi disegnando le linee nei luoghi pertinenti. Tutto funziona perfettamente, tuttavia ho un problema con il mio onDraw per funzionare senza intoppi. Ciò accade a causa del fatto che ogni volta che invalido devo rieseguire il look for ed eseguire varie istruzioni if ​​per controllare le posizioni (sfortunatamente questo processo non può essere migliorato).

la domanda:

Sto cercando di riscrivere il modo in cui il mio labirinto viene disegnato sulla tela, di seguito sono le 3 caratteristiche principali che ho bisogno di implementare:

1 - Disegnare l'intero labirinto su la tela (questo è abbastanza facile) 2 - Zoom sul labirinto in modo che solo mostra il 5 x 5 3 - Spostare il personaggio (che è sempre al centro dello schermo) e disegnare la prossima seciton del labirinto

Ora come detto sopra disegnando l'intero labirinto è abbastanza facile e renderà il onDraw significativamente più veloce poiché non è necessario eseguire il ciclo for su invaldate, è possibile farlo una volta al primo caricamento del livello.

In termini di punto 2 & 3, il modo in cui vedo questo funzionamento è il carattere da disegnare nel mezzo della tela, quindi una telecamera con vista a volo d'uccello 2d da collegare/collegare al movimento dei personaggi. Questa fotocamera dovrebbe anche essere ingrandita in modo tale da visualizzare solo un 5 x 5 della griglia generale del labirinto. Quindi, mentre il personaggio si muove, la telecamera si muove con il personaggio e visualizza la sezione successiva del labirinto che è già stata disegnata. Ho provato alcune cose e ho fatto qualche ricerca, ma non ho mai lavorato prima con la tela e non ho idea di dove cominciare e se è possibile.

Quindi, per riassumere la parte principale della domanda è se il loro è un modo per collegare una telecamera vista birdseye a un personaggio che viene ingrandito e si sposta con l'immagine del personaggio.

Di seguito è riportato un frammento di come viene disegnato il labirinto, utilizzando 2 set di loop per il controllo su 2 set di array booleani [] [], che memorizzano semplicemente le linee verticale e horixaonl da disegnare.

@Override 
protected void onDraw(Canvas canvas) 
{ 
    canvas.drawRect(0, 0, width, 100, background); 
    RectBackground.set(0,0, FullScreenWidth, FullScreenWidth); 
    canvas.drawBitmap(gameBackground, null, RectBackground, null); 

    for(int i = 0; i < 5; i++) 
    { 
     for(int j = 0; j < 5; j++) 
     { 
      float x = j * totalCellWidth; 
      float y = i * totalCellHeight; 

      indexY = i + currentY; 
      indexX = j + currentX; 

      // Draw Verticle line (y axis) 
      if (indexY < vLength && indexX < vLines[indexY].length && vLines[indexY][indexX]) 
      { 
       RectOuterBackground.set((int)x + (int)cellWidth, (int)y, (int)x + (int)cellWidth + 15, (int)y + (int)cellHeight + 15); 
       canvas.drawBitmap(walls, null, RectOuterBackground, null); 
      } 
      // Draws Horizontal lines (x axis) 
      if (indexY < hLength && indexX < hLines[indexY].length && hLines[indexY][indexX]) 
      { 
       RectOuterBackground.set((int)x, (int)y + (int)cellHeight,(int)x + (int)cellWidth + 15,(int)y + (int)cellHeight + 15); 
       canvas.drawBitmap(walls, null, RectOuterBackground, null); 
      } 
     } 
    } 
} 

risposta

1

per rendere il disegno più veloce, è possibile fare doppio tamponare la tela disegnando direttamente in una bitmap e lampeggiante la bitmap nella tela come questo. È molto veloce

private void init() 
{ 
     //variables below are class-wide variables 
     b = Bitmap.createBitmap(cwidth, cheight, Bitmap.Config.ARGB_8888); 
     bitmapPaint = new Paint(Paint.ANTI_ALIAS_FLAG); 
     bitmapPaint.setStyle(Paint.Style.STROKE); 

     bitmapPaint.setStrokeWidth(3); 
     myPaint.setColor(0xff000000); 
     myCanvas = new Canvas(b); 
} 

protected void onDraw(Canvas c) 
{ 
    super.onDraw(c); 
    c.drawBitmap(b, 0, 0, myPaint); 

    for(int i = 0; i < number lines; i++) 
    { 
     //draw here using myPath 
    } 

    if(b != null) 
     c.drawBitmap(b, 0, 0, myPaint); 

    myCanvas.drawPath(myPath, bitmapPaint); 

} 

Quindi, per "spostarsi" suggerirei di utilizzare una casella di ritaglio. Ciò significa che una scala 1: 1, l'immagine è più grande della finestra visualizzata sullo schermo. In realtà quello che sta succedendo quando qualcuno "si muove" è che la bitmap viene spostata sotto la casella di ritaglio.

Si potrebbe utilizzare BitmapRegionDecoder e visualizzare solo la regione il personaggio è in (questo potrebbe essere slowish) oppure utilizzando

public void drawBitmap (Bitmap bitmap, Rect src, RectF dst, Paint paint) 

Il parametro src qui permette di specificare una piccola regione della bitmap da visualizzare. È effettivamente una scatola di colture.

+0

devo anche aggiungere che il metodo OnDraw è tristemente incompleta. Se hai bisogno di vedere tutto funzionante, posso mandarti del codice. Ho scritto un'app che fa qualcosa di simile a quello che stai facendo con il labirinto. Disegna linee di quaderno e acquisisce la scrittura a mano da uno stilo. – mttdbrd

+0

Domani darò un'occhiata a questo, potresti mandarmi una e-mail con il tuo codice completo in modo da poter vedere una versione funzionante. Grazie. –

+0

Non ho idea di come inviare email alle persone tramite SO. Come si fa a farlo? – mttdbrd

1

Per zoom in e out è necessario moltiplicare le coordinate da un numero (fattore di zoom)

int x1 = (int)x + (int)cellWidth; 
int y1 = (int)y; 
int x2 = (int)x + (int)cellWidth + 15; 
int y2 = (int)y + (int)cellHeight + 15; 

RectOuterBackground.set(x1*zoom, y1*zoom, x2*zoom, y2*zoom); 

nota che lo zoom deve essere un numero in virgola mobile, usando lo zoom = 2 che rende tutto due volte più grande.

se si vuole mettere la fotocamera sulla parte superiore della cella (XC, YC) è necessario fare questo:

RectOuterBackground.set((x1-xc)*zoom, (y1-yc)*zoom, (x2-xc)*zoom, (y2-yc)*zoom); 

Prova prima disegnare l'intero labirinto, e presto a capire come solo disegnare il bit del labirinto che è soltanto all'interno dello schermo

Spero che questo aiuta e fatemi sapere se avete domande :)

+0

Questa sera ti darò un'occhiata su questo stadio e ti farò sapere come andrò avanti. –

+0

C'è qualche possibilità che tu possa fornirmi uno snippet più completo del tuo codice, poiché non sono sicuro al 100% come implementarlo. E.g sono int non intesi per avere; alla fine. Finora ho disegnato il mio labirinto completo 10 x 10, ora ho bisogno di implementare lo zoom con la fotocamera in modo che si muova senza intoppi (mostrando gradualmente le prossime sezioni del labirinto). Grazie –

+0

Puoi inviarmi quello che hai finora? Implementerò questo bit per te – aguaviva

Problemi correlati