四面体に色を設定して回転しながら描画

XNA で四面体の頂点に色を設定して回転しながら描画します。

前田稔(Maeda Minoru)の超初心者のプログラム入門

プログラムの説明

  1. 四個の Triangle(三角形)を組み合わせて、四面体を作成します。
    vertex(頂点座標の定義)には三次元座標だけで無く、色や法線ベクトルやテクスチャ座標を含めることが出来ます。
    今回は四面体の各頂点に異なる色を設定して回転しながら描画してみましょう。
  2. Game1.cs を編集して、次の領域を宣言して下さい。
    worldMatrix はワールド座標を設定する領域で、今回はX軸を中心に回転しながら描画します。
    modelRotation はモデルの回転係数を格納する領域です。
    他の領域の説明は「ポイントプリミティブの描画」を参照して下さい。
        GraphicsDeviceManager   graphics;
        VertexDeclaration       vertexDeclaration;  // 頂点データ定義
        VertexBuffer            vertexBuffer;       // 頂点バッファ
        BasicEffect             basicEffect;        // 基本エフェクト
        Matrix                  worldMatrix;        // ワールド座標
        Matrix                  viewMatrix;         // ビュー座標
        Matrix                  projectionMatrix;   // プロジェクション
        float                   modelRotation= 0.0f;// 回転係数
        
  3. 四面体を描画するための準備処理(初期化)を LoadContent() に集約してみました。
    vertexDeclaration には、頂点に色を設定するので VertexPositionColor を指定します。
    エフェクトを作成して VertexColorEnabled を true に設定して下さい。
    viewMatrix(カメラ座標) と projectionMatrix(描画環境)を設定します。
    worldMatrix は自動的に回転するために Draw() メソッドで計算しています。
    vertices[6] を生成して頂点座標と色を格納します。
    四面体は四個の三角形で構成されますが、TriangleStrip を使うので頂点の個数は6個になります。
    vertices[] の定義が終わると、頂点バッファを作成して頂点データをバッファに書き込みます。
        protected override void LoadContent()
        {
            // 頂点定義データを作成
            vertexDeclaration = new VertexDeclaration(
                GraphicsDevice, VertexPositionColor.VertexElements);
            // エフェクトを作成
            basicEffect = new BasicEffect(GraphicsDevice, null);
            // エフェクトで頂点カラーを有効にする
            basicEffect.VertexColorEnabled = true;
    
            viewMatrix = Matrix.CreateLookAt(
                new Vector3(0, 0, 4), Vector3.Zero, Vector3.Up);
            projectionMatrix = Matrix.CreatePerspectiveFieldOfView(
                MathHelper.ToRadians(45),  // 45 度 
                (float)graphics.GraphicsDevice.Viewport.Width /
                (float)graphics.GraphicsDevice.Viewport.Height,
                1.0f, 100.0f);
    
            // 頂点データを作成する
            VertexPositionColor[] vertices = new VertexPositionColor[6];
            vertices[0] = new VertexPositionColor(new Vector3(-1.0f, -0.577f, 0.577f), Color.Blue);
            vertices[1] = new VertexPositionColor(new Vector3(1.0f, -0.577f, 0.577f), Color.Red);
            vertices[2] = new VertexPositionColor(new Vector3(0.0f, 1.15f, 0.0f), Color.White);
            vertices[3] = new VertexPositionColor(new Vector3(0.0f, -0.577f, -1.15f), Color.Green);
            vertices[4] = new VertexPositionColor(new Vector3(-1.0f, -0.577f, 0.577f), Color.Blue);
            vertices[5] = new VertexPositionColor(new Vector3(1.0f, -0.577f, 0.577f), Color.Red);
    
            // 頂点バッファ作成
            vertexBuffer = new VertexBuffer(GraphicsDevice,
                VertexPositionColor.SizeInBytes * 6, BufferUsage.None);
            // 頂点データを頂点バッファに書き込む
            vertexBuffer.SetData(vertices);
        }
        
  4. Update() メソッドで、modelRotation に回転係数を設定します。
    回転速度は MathHelper.ToRadians(0.05f) で調整して下さい。
        protected override void Update(GameTime gameTime)
        {
            // Xbox 360 および Windows でゲームの終了を許可します。 
            if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed ||
                Keyboard.GetState().IsKeyDown(Keys.Escape)) this.Exit();
    
            // TODO: ここに更新処理を記述してください
            // Timer で回転係数を設定
            modelRotation += (float)gameTime.ElapsedGameTime.TotalMilliseconds * MathHelper.ToRadians(0.05f);
    
            base.Update( gameTime );    // GameComponent を更新する
        }
        
  5. Draw() メソッドで四面体を回転しながら描画します。
    GraphicsDevice.VertexDeclaration に頂点データの形式を設定します。
    GraphicsDevice.Vertices[0].SetSource() で vertexBuffer を設定します。
    Matrix.CreateRotationX() でX軸を基点にして回転しながら描画します。
    GraphicsDevice.DrawPrimitives() で TriangleStrip で四面体(四個の三角形で構成)を描画します。
        protected override void Draw(GameTime gameTime)
        {
            // 画面を指定した色でクリアします
            GraphicsDevice.Clear(Color.CornflowerBlue);
    
            // 描画する頂点データの定義を設定
            GraphicsDevice.VertexDeclaration = vertexDeclaration;
    
            // 頂点バッファをセットします
            GraphicsDevice.Vertices[0].SetSource( vertexBuffer, 0,
                VertexPositionColor.SizeInBytes );
    
            // エフェクトの使用を開始します
            basicEffect.Begin();
            worldMatrix = Matrix.CreateRotationX(modelRotation);
            basicEffect.World = worldMatrix;
            basicEffect.View = viewMatrix;
            basicEffect.Projection = projectionMatrix; 
    
            // パスの数だけ繰り替えし描画
            foreach (EffectPass pass in basicEffect.CurrentTechnique.Passes)
            {
                // パスの開始
                pass.Begin();
    
                // ポリゴン描画する
                GraphicsDevice.DrawPrimitives(PrimitiveType.TriangleStrip, 0, 4);
    
                // パスの終了
                pass.End();
            }
    
            // エフェクトの使用を終了する
            basicEffect.End();
    
            // 登録された DrawableGameComponent を描画する
            base.Draw(gameTime);
        }
        

【演習】

  1. Y軸を基点にして回転しながら描画して下さい。
  2. 四面体の頂点の色を変えて描画して下さい。
  3. 四面体の各面に色を設定して描画して下さい。

前田稔(Maeda Minoru)の超初心者のプログラム入門

超初心者のプログラム入門(XNA(C#) game program)