Articoli

Papervision3D - La telecamera di debug

logoPV3D

Potete immaginare che con tutte le impostazioni disponibili è abbastanza facile perdersi nello spazio 3D quando si crea un'applicazione. La telecamera di debug è stata sviluppata per tenere traccia di dove la fotocamera è e quali sono le sue impostazioni mentre si testa l'applicazione.
Ha in se alcuni fondamentali di navigazione incorporati attivabili utilizzando i tasti freccia e interagendo con il mouse e inoltre visualizza alcune statistiche che continuamente ti dicono cosa sta succedendo.

Costruiamo un semplice applicazione che utilizzi questa telecamera. Questa genererà una galassia casuale di piani colorati e aggiungerà una sfera . La sfera avrà una bitmap  raffigurante il pianeta Terra avvolta attorno ad esso.
Ora vediamo come creare tuttto ciò in un paio di minuti ed esaminiamo la galassia con la nostra telecamera di debug.
Prendendo il GuideExampleTemplate dalla Sezione 2 come punto di partenza, per prima cosa facciamole importazioni che non necessitano di spiegazioni ormai:

import·org.papervision3d.cameras.CameraType;
import·org.papervision3d.events.FileLoadEvent;
import·org.papervision3d.materials.BitmapFileMaterial;
import·org.papervision3d.materials.ColorMaterial;
import·org.papervision3d.objects.primitives.Plane;
import·org.papervision3d.objects.primitives.Sphere;

Giusto sotto la definizione di classe abbiamo assegnamo un'istanza della sfera ad una variabile earthSphere.

private var earthSphere:Sphere;

È possibile impostare il tipo fotocamera di debug in modo simile a come si imposta una fotocamera target o una fotocamera libera  passando una stringa nella chiamata super () come mostrato di seguito:

super (stage.stageWidth stage.stageHeight vero, falso CameraType.DEBUG);

Nel nostro metodo init () creiamo il materiale per la sfera aggiungiamo un listener per controllare se il materiale viene caricato e impostiamo la proprietà precisione su true. Questo presuppone che sia presente una cartella risorse nella cartella bin con una bitmap earth.jpg  in essa. si può trovare questo bitmap scaricando il codice:

var material:BitmapFileMaterial = new BitmapFileMaterial("assets/earthmap1k.jpg");
material.addEventListener(FileLoadEvent.LOAD_COMPLETE,loadComplete);
material.precise = true;

Nella Sezione 4 abbiamo visto che non abbiamo bisogno di listener di eventi per applicare il materiale alla sfera. Lo stiamo usando in modo che non si avvii il rendering della scena prima che il materiale sia caricato. Siamo quindi in grado di istanziare la sfera e applicarle il materiale subito.

earthSphere = new Sphere(material,200,24,16);
scene.addChild(earthSphere);

Poi, ancora nel metodo init () creiamo 150 piani e diamo loro un colore una posizione e una rotazione a caso.

for(var i:uint = 0; i < 150; i++)

{
  var plane:Plane = new Plane(new ColorMaterial(Math.random()
  * 0xFFFFFF),50,50,1,1);
  plane.material.doubleSided = true;
  scene.addChild(plane);
  plane.x = Math.random()*20000 - 10000;
  plane.y = Math.random()*1500 - 750;
  plane.z = Math.random()*20000 -10000;
  plane.localRotationY = Math.random() * 180 - 90;
}

Math.random () * 20000-10000 restituirà un numero casuale compreso tra -10.000 e 10.000, fornendo un buon modo per disporre i piani a caso sulla scena nella direzione della x e z, Lo stesso vale per randomizzare la posizione y, ma qui si applica una gamma più corta risultante in una galassia che sembra un po '"piatta".

Ora che abbiamo costruito la nostra galassia, settiamo alcune impostazioni della fotocamera:

camera.z = -2000;
camera.focus = 20;
camera.far = 20000;

Abbiamo aumentato la messa a fuoco al fine di evitare distorsioni prospettiche eccessive quando la terra sarà sul lato della nostra scena. Il particolare il valore di 20 è una questione di gusti e si può cambiare per vedere la differenza che fa con la profondità della vista e la prospettiva distorta. Infine, impostare il piano lontano a 20000. Questo ci permetterà di vedere i nostri oggetti anche quando la fotocamera è abbastanza lontana dalla galassia.

Abbiamo aggiunto un listener di eventi per verificare se il materiale è caricato. Questo è il metodo listener che contiene la chiamata di rendering:

private function loadComplete(e:FileLoadEvent):void
{
  startRendering();
}

Non dimenticare di rimuovere la chiamata startRendering () dal costruttore!

Con l'aggiunta di una rotazione locale alla sfera, faremo raffigurante il pianeta Terra che gira lentamente. aggiungere la seguente riga nel metodo onRenderTick () prima del super.onRenderTick () :

earthSphere.localRotationY += 0.2;

Pubblichiamo il file e si dovrebbe vedere una galassia di piani con la terra al centro.
Notate anche le informazioni che vengono visualizzate nella parte superiore sinistra dello schermo.
Essa mostra i valori della fotocamera per le seguenti proprietà:
• coordinate
• rotazione
• campo visivo
• vicini e lontani

Usa i tasti W, A, S, D o le frecce direzionali per muovere la telecamera. Si noti che si è in grado di manipolare la rotazione della fotocamera sull' asse y e x trascinando il mouse. È possibile utilizzare i tasti Q ed E per ruotare sull'asse z.

Poiché si naviga attraverso la scena e si ruota la telecamera, ogni tanto probabilmente noterete quanto sia facile perdere l'orientamento, specialmente quando non sei un giocatore esperto o sviluppatore di giochi. Sebbene le informazioni che la telecamera di debug dà, essa non fornisce una correzione finale, che può dare una migliore comprensione di ciò che sta accadendo. Ciò rende la fotocamera di debug un utile strumento durante lo sviluppo e il debug dell'applicazione 3D.
Si potrebbe anche fare esercizio per acquisire familiarità con il movimento attraverso lo spazio 3D.
Muoversi per un po' e poi cercare di tornare in qualche luogo vicino alla posizione dove siete partiti (0,0, -2000) nel nostro esempio. Inoltre, provare a ripristinare l'iniziale rotazione, che era 0 per tutti e tre gli assi. Non è molto semplice e potrebbe richiedere del tempo  ma può essere fatto con l'aiuto delle informazioni forniture telecamera di debug.
La visualizzazione delle informazioni non solo mostra le coordinate e la rotazione ma dà anche il campo visivo, insieme con la distanza dalla telecamera al piano vicino e al piano lontano. Abbiamo impostato il piano lontano a 20.000 unità dalla fotocamera. questo ci permette di vedere tutti i piani e la sfera della terra, anche se ci si sposta con la fotocamera abbastanza lontano dalla galassia. Quando si sposta di nuovo la fotocamera a un valore inferiore a z di -20.000, la sfera terrestre scomparirà. Ora è dietro il piano lontano e non viene più eseguito il rendering .
Per esempio, portando il piano lontano a 8000, esso si sposterà il piano molto più vicino alla telecamera.
Ciò si traduce in un tronco meno profondo e ora quando si sposta la telecamera indietro, i piani iniziano a sparire subito.


Filippo Porcari
Author: Filippo PorcariWebsite: http://filippo.porcari.oranjuice.org/Email: Questo indirizzo email è protetto dagli spambots. E' necessario abilitare JavaScript per vederlo.
designer freelance
Sono un graphic designer e mi occupo di pubblicità. Da più di 10 anni dedico le mie energie alla realizzazioni d'immagine aziendale e comunicazione visiva con un'attenzione alle nuove tecnologie del web. Da qualche anno ho scoperto il software open source e mi sono dedicato alla sua introduzione nel mio workflow produttivo ottenendo ottimi risultati.

© copyright 2011

Porcari Filippo studio grafico - p.iva 01985590023

Tutti i diritti riservati.