用OpenSceneGraph实现的NeHe OpenGL教程 - 第十七课

• 简介

本节课需要实现的内容是使用纹理贴图来模拟文字效果。使用这种技术显示文字的好处在于程序的效果在任何机器上都是相同的。而我们前面讨论的显示文字的方法都是依赖于当前系统中所包含的字体，所以前面讨论的技术在不同的机器上有可能会有不同的显示效果。

使用纹理贴图来显示文字的原理很简单，实际上这些文字是一个一个的四边形，只是为它们贴上了文字的纹理。

• 实现

首先我们实现场景中的墙面的效果，按照NeHe教程上的方式创建四边形并给它们贴上纹理，代码如下：

在代码中用AnimationPathCallback的方式实现旋转

osg::Group*   createWalls()
{
        osg::Geometry *wallGeometry = new osg::Geometry;
        wallGeometry->setVertexArray(vertexArray);
        wallGeometry->setTexCoordArray(0, textureArray);
        wallGeometry->addPrimitiveSet(new osg::DrawArrays(osg::PrimitiveSet::QUADS, 0, 4));
        osg::Texture2D *textureWall = new osg::Texture2D;
        textureWall->setImage(0, osgDB::readImageFile("Data/Bumps.bmp"));
        wallGeometry->getOrCreateStateSet()->setTextureAttributeAndModes(0, textureWall);
        wallGeometry->getOrCreateStateSet()->setMode(GL_LIGHTING, osg::StateAttribute::OFF);
        wallGeode->addDrawable(wallGeometry);
        
        return wallGroup;
}

接下来我们需要创建一个个小的带文字的四边形，按照NeHe教程中的实现方式，我们将一整张字符表的图片切割成一个一个的字母贴在四边形上，先定义所有的几何体

osg::Geometry *texts[256];

然后进行贴纹理的操作，该操作的核心是计算纹理坐标，使得到的纹理正好是一个字符的大小

void createTextGeometries()
{
        float cx, cy;
        for (int i=0; i<256; i++)
        {
                cx=float(i%16)/16.0f;
                cy=float(i/16)/16.0f;
                osg::Vec2Array *vertexArray = new osg::Vec2Array;
                vertexArray->push_back(osg::Vec2(0, 0));
                vertexArray->push_back(osg::Vec2(16, 0));
                vertexArray->push_back(osg::Vec2(16, 16));
                vertexArray->push_back(osg::Vec2(0, 16));
                osg::Vec2Array *textureArray = new osg::Vec2Array;
                textureArray->push_back(osg::Vec2(cx,1-cy-0.0625f));
                textureArray->push_back(osg::Vec2(cx+0.0625f,1-cy-0.0625f));
                textureArray->push_back(osg::Vec2(cx+0.0625f,1-cy));
                textureArray->push_back(osg::Vec2(cx,1-cy));
 }      
}

最后我们需要根据我们输入的字符(如NeHe)，从上面几何体中挑选正确的geometry，即正好挑到贴有"N" "e" "H" "e"纹理的几何体，组合成我们需要的Group节点

    for (unsigned i = 0; i < str.size(); ++i)
        {
                //得到字符所对应的Geometry
                // [如"NeHe"字符串我们就分别要得到贴有NeHe字母纹理的Geometry,一共4个]
                int index = str.at(i); 
                index = index - 32 + 128 * characterSet;
                osg::Geode *charGeode = new osg::Geode;
                osg::Geometry *geometry = texts[index];
                geometry->setUpdateCallback(cu);
                geometry->setUseDisplayList(false);
                charGeode->addDrawable(geometry);
                //这个MatrixTransform是用来拉开字符间距的，防止它们叠在一起
                osg::MatrixTransform *charOffsetMT = new osg::MatrixTransform;
                charOffsetMT->setMatrix(osg::Matrix::translate(13 * i, 0, 0));
                charOffsetMT->addChild(charGeode);
                posMT->addChild(charOffsetMT);
        }

在本课中可以看到字体的绘制是在另一个投影坐标系统下进行绘制的。在osg中使用 HUD ( head-up display )相机来实现这样的效果，HUD还可以实现场景信息显示、鹰眼等功能。创建一个HUD相机在osg中十分的简单，关键步骤如下:

    //创建一个相机节点
        osg::Camera* camera = new osg::Camera;
        //设置相机的投影坐标系
        camera->setProjectionMatrix(osg::Matrix::ortho2D(0,640,0,480));
        //将坐标框架设置为绝对的(也就是不受父节点MatrixTransform节点的影响)
        camera->setReferenceFrame(osg::Transform::ABSOLUTE_RF);
        camera->setViewMatrix(osg::Matrix::identity());
        camera->setClearMask(GL_DEPTH_BUFFER_BIT);
        //让相机在其他场景渲染完成之后再渲染
        camera->setRenderOrder(osg::Camera::POST_RENDER);
        camera->setAllowEventFocus(false);

之后将需要的子场景加入到相机节点中即可(相机节点继承于Group节点)

为了实现场景中文字运动的效果，我们使用了和前面课程一样的UpdateCallback的方式，代码为了方便中将它们作为单独的类来处理，读者可以整理成一个类

class PosNeHeUpdateCallback : public osg::NodeCallback
{
public:
        virtual void operator()(osg::Node* node, osg::NodeVisitor* nv)
        {
                if (dynamic_cast<osg::MatrixTransform*>(node))
                {
                        osg::MatrixTransform *transMT = dynamic_cast<osg::MatrixTransform*>(node);
                        transMT->setMatrix(osg::Matrix::translate(osg::Vec3(((280+250*cos(cnt1))),(235+200*sin(cnt2)), 0.0f)));

                        cnt1+=0.01f;                                                    
                        cnt2+=0.0081f;
                }
                traverse(node, nv);
        }
}; 

完成这几部分之后，最后把相机节点(显示文字的部分)和显示墙面的部分加到场景中

        root->addChild(createWalls());
        root->addChild(createHUD());

编译运行程序：

附：本课源码(源码中可能存在错误和不足之处，仅供参考)

#include "../osgNeHe.h"

#include <QtCore/QTimer>
#include <QtGui/QApplication>
#include <QtGui/QVBoxLayout>

#include <osgViewer/Viewer>
#include <osgDB/ReadFile>
#include <osgQt/GraphicsWindowQt>

#include <osg/MatrixTransform>
#include <osg/Texture2D>
#include <osg/AnimationPath>
#include <osg/BlendFunc>


//所有文字几何体
osg::Geometry *texts[256];
GLfloat cnt1, cnt2;

class ViewerWidget : public QWidget, public osgViewer::Viewer
{
public:
	ViewerWidget(osg::Node *scene = NULL)
	{
		QWidget* renderWidget = getRenderWidget( createGraphicsWindow(0,0,100,100), scene);

		QVBoxLayout* layout = new QVBoxLayout;
		layout->addWidget(renderWidget);
		layout->setContentsMargins(0, 0, 0, 1);
		setLayout( layout );

		connect( &_timer, SIGNAL(timeout()), this, SLOT(update()) );
		_timer.start( 10 );
	}

	QWidget* getRenderWidget( osgQt::GraphicsWindowQt* gw, osg::Node* scene )
	{
		osg::Camera* camera = this->getCamera();
		camera->setGraphicsContext( gw );

		const osg::GraphicsContext::Traits* traits = gw->getTraits();

		camera->setClearColor( osg::Vec4(0.0, 0.0, 0.0, 1.0) );
		camera->setViewport( new osg::Viewport(0, 0, traits->width, traits->height) );
		camera->setProjectionMatrixAsPerspective(45.0f, static_cast<double>(traits->width)/static_cast<double>(traits->height), 0.1f, 100.0f );
		camera->setViewMatrixAsLookAt(osg::Vec3d(0, 0, 1), osg::Vec3d(0, 0, 0), osg::Vec3d(0, 1, 0));

		this->setSceneData( scene );

		return gw->getGLWidget();
	}

	osgQt::GraphicsWindowQt* createGraphicsWindow( int x, int y, int w, int h, const std::string& name="", bool windowDecoration=false )
	{
		osg::DisplaySettings* ds = osg::DisplaySettings::instance().get();
		osg::ref_ptr<osg::GraphicsContext::Traits> traits = new osg::GraphicsContext::Traits;
		traits->windowName = name;
		traits->windowDecoration = windowDecoration;
		traits->x = x;
		traits->y = y;
		traits->width = w;
		traits->height = h;
		traits->doubleBuffer = true;
		traits->alpha = ds->getMinimumNumAlphaBits();
		traits->stencil = ds->getMinimumNumStencilBits();
		traits->sampleBuffers = ds->getMultiSamples();
		traits->samples = ds->getNumMultiSamples();

		return new osgQt::GraphicsWindowQt(traits.get());
	}

	virtual void paintEvent( QPaintEvent* event )
	{ 
		frame(); 
	}

protected:

	QTimer _timer;
};

//
//TODO:此处最好用通用的方式处理

class PosNeHeUpdateCallback : public osg::NodeCallback
{
public:
	virtual void operator()(osg::Node* node, osg::NodeVisitor* nv)
	{
		if (dynamic_cast<osg::MatrixTransform*>(node))
		{
			osg::MatrixTransform *transMT = dynamic_cast<osg::MatrixTransform*>(node);
			transMT->setMatrix(osg::Matrix::translate(osg::Vec3(((280+250*cos(cnt1))),(235+200*sin(cnt2)), 0.0f)));

			cnt1+=0.01f;							
			cnt2+=0.0081f;
		}
		traverse(node, nv);
	}
}; 

class PosOpenGLUpdateCallback : public osg::NodeCallback
{
public:
	virtual void operator()(osg::Node* node, osg::NodeVisitor* nv)
	{
		if (dynamic_cast<osg::MatrixTransform*>(node))
		{
			osg::MatrixTransform *transMT = dynamic_cast<osg::MatrixTransform*>(node);
			transMT->setMatrix(osg::Matrix::translate(osg::Vec3(((280+230*cos(cnt2))),(235+200*sin(cnt1)), 0.0f)));
		}
		traverse(node, nv);
	}
}; 


class PosGiuseppe1UpdateCallback : public osg::NodeCallback
{
public:
	virtual void operator()(osg::Node* node, osg::NodeVisitor* nv)
	{
		if (dynamic_cast<osg::MatrixTransform*>(node))
		{
			osg::MatrixTransform *transMT = dynamic_cast<osg::MatrixTransform*>(node);
			transMT->setMatrix(osg::Matrix::translate(osg::Vec3(int(240+200*cos((cnt2+cnt1)/5)), 2, 0)));
		}
		traverse(node, nv);
	}
}; 

class PosGiuseppe2UpdateCallback : public osg::NodeCallback
{
public:
	virtual void operator()(osg::Node* node, osg::NodeVisitor* nv)
	{
		if (dynamic_cast<osg::MatrixTransform*>(node))
		{
			osg::MatrixTransform *transMT = dynamic_cast<osg::MatrixTransform*>(node);
			transMT->setMatrix(osg::Matrix::translate(osg::Vec3(int(242+200*cos((cnt2+cnt1)/5)), 2, 0.0f)));

		}
		traverse(node, nv);
	}
}; 

class ColorNeHeCallback : public osg::Drawable::UpdateCallback
{
public:
	virtual void update(osg::NodeVisitor* nv, osg::Drawable* drawable)
	{
		osg::Geometry *geometry = dynamic_cast<osg::Geometry*>(drawable);
		geometry->setColorBinding(osg::Geometry::BIND_OVERALL);
		if (!geometry)
		{
			return;
		}
		osg::Vec4Array *colorArray = dynamic_cast<osg::Vec4Array*>(geometry->getColorArray());
		if (colorArray)
		{
			colorArray->clear();
			colorArray->push_back(osg::Vec4(1.0f*float(cos(cnt1)),1.0f*float(sin(cnt2)),1.0f-0.5f*float(cos(cnt1+cnt2)), 1.0));
			colorArray->dirty();
		}
	}
};

class ColorOpenGLCallback : public osg::Drawable::UpdateCallback
{
public:
	virtual void update(osg::NodeVisitor* nv, osg::Drawable* drawable)
	{
		osg::Geometry *geometry = dynamic_cast<osg::Geometry*>(drawable);
		if (!geometry)
		{
			return;
		}
		osg::Vec4Array *colorArray = dynamic_cast<osg::Vec4Array*>(geometry->getColorArray());
		if (colorArray)
		{
			colorArray->clear();
			colorArray->push_back(osg::Vec4(1.0f*float(sin(cnt2)),1.0f-0.5f*float(cos(cnt1+cnt2)),1.0f*float(cos(cnt1)), 1.0f));
			colorArray->setBinding(osg::Array::BIND_OVERALL);
			colorArray->dirty();
		}
	}
};

class ColorGiuseppe1Callback : public osg::Drawable::UpdateCallback
{
public:
	virtual void update(osg::NodeVisitor* nv, osg::Drawable* drawable)
	{
		osg::Geometry *geometry = dynamic_cast<osg::Geometry*>(drawable);
		if (!geometry)
		{
			return;
		}
		osg::Vec4Array *colorArray = dynamic_cast<osg::Vec4Array*>(geometry->getColorArray());
		if (colorArray)
		{
			colorArray->clear();
			colorArray->push_back(osg::Vec4(0.0f,0.0f,1.0f, 1.0f));
			colorArray->setBinding(osg::Array::BIND_OVERALL);
			colorArray->dirty();
		}
	}
};

class ColorGiuseppe2Callback : public osg::Drawable::UpdateCallback
{
public:
	virtual void update(osg::NodeVisitor* nv, osg::Drawable* drawable)
	{
		osg::Geometry *geometry = dynamic_cast<osg::Geometry*>(drawable);
		if (!geometry)
		{
			return;
		}
		osg::Vec4Array *colorArray = dynamic_cast<osg::Vec4Array*>(geometry->getColorArray());
		if (colorArray)
		{
			colorArray->clear();
			colorArray->push_back(osg::Vec4(1.0f,1.0f,1.0f, 1.0f));
			colorArray->setBinding(osg::Array::BIND_OVERALL);
			colorArray->dirty();
		}
	}
};



//
// 创建墙体
osg::Group*   createWalls()
{
	osg::Group *wallGroup = new osg::Group;
	
	//墙体Geode
	osg::Geode *wallGeode = new osg::Geode;
	osg::Vec2Array *vertexArray = new osg::Vec2Array;
	vertexArray->push_back(osg::Vec2(-1.0, 1.0));
	vertexArray->push_back(osg::Vec2(1.0, 1.0));
	vertexArray->push_back(osg::Vec2(1.0, -1.0));
	vertexArray->push_back(osg::Vec2(-1.0, -1.0));
	osg::Vec2Array *textureArray = new osg::Vec2Array;
	textureArray->push_back(osg::Vec2(0.0, 0.0));
	textureArray->push_back(osg::Vec2(1.0, 0.0));
	textureArray->push_back(osg::Vec2(1.0, 1.0));
	textureArray->push_back(osg::Vec2(0.0, 1.0));

	osg::Geometry *wallGeometry = new osg::Geometry;
	wallGeometry->setVertexArray(vertexArray);
	wallGeometry->setTexCoordArray(0, textureArray);
	wallGeometry->addPrimitiveSet(new osg::DrawArrays(osg::PrimitiveSet::QUADS, 0, 4));
	osg::Texture2D *textureWall = new osg::Texture2D;
	textureWall->setImage(0, osgDB::readImageFile("Data/Bumps.bmp"));
	wallGeometry->getOrCreateStateSet()->setTextureAttributeAndModes(0, textureWall);
	wallGeometry->getOrCreateStateSet()->setMode(GL_LIGHTING, osg::StateAttribute::OFF);
	wallGeode->addDrawable(wallGeometry);
	
	//使用AnimationPathCallback实现旋转
	osg::MatrixTransform *zoomInMT = new osg::MatrixTransform;
	zoomInMT->setMatrix(osg::Matrix::translate(0.0, 0.0, -5.0));
	osg::MatrixTransform *rot1MT = new osg::MatrixTransform;
	rot1MT->setMatrix(osg::Matrix::rotate(osg::DegreesToRadians(45.0), osg::Z_AXIS));
	osg::MatrixTransform *animateMT = new osg::MatrixTransform;
	animateMT->setUpdateCallback(new osg::AnimationPathCallback(osg::Vec3(0.0, 0.0, 0.0), osg::Vec3(1, 1, 0), 0.5));
	animateMT->addChild(wallGeode);
	rot1MT->addChild(animateMT);
	zoomInMT->addChild(rot1MT);
	wallGroup->addChild(zoomInMT);
	osg::MatrixTransform *rot2MT = new osg::MatrixTransform;
	rot2MT->setMatrix(osg::Matrix::rotate(osg::DegreesToRadians(90.0), osg::Vec3(1.0, 1.0, 0.0)));
	rot2MT->addChild(wallGeode);
	animateMT->addChild(rot2MT);	

	return wallGroup;
}

//
//创建文字Geometry
void createTextGeometries()
{
	float cx, cy;
	for (int i=0; i<256; i++)
	{
		cx=float(i%16)/16.0f;
		cy=float(i/16)/16.0f;

		texts[i] = new osg::Geometry;
		osg::Vec2Array *vertexArray = new osg::Vec2Array;
		vertexArray->push_back(osg::Vec2(0, 0));
		vertexArray->push_back(osg::Vec2(16, 0));
		vertexArray->push_back(osg::Vec2(16, 16));
		vertexArray->push_back(osg::Vec2(0, 16));
		osg::Vec2Array *textureArray = new osg::Vec2Array;
		textureArray->push_back(osg::Vec2(cx,1-cy-0.0625f));
		textureArray->push_back(osg::Vec2(cx+0.0625f,1-cy-0.0625f));
		textureArray->push_back(osg::Vec2(cx+0.0625f,1-cy));
		textureArray->push_back(osg::Vec2(cx,1-cy));
		osg::Vec4Array *colorArray = new osg::Vec4Array;
		colorArray->push_back(osg::Vec4(1.0, 1.0, 1.0, 1.0));
		texts[i]->setVertexArray(vertexArray);
		texts[i]->setTexCoordArray(0, textureArray);
		texts[i]->setColorArray(colorArray, osg::Array::BIND_OVERALL);
		texts[i]->addPrimitiveSet(new osg::DrawArrays(osg::PrimitiveSet::QUADS, 0, 4));
		osg::Texture2D *textTex = new osg::Texture2D;
		textTex->setImage(0, osgDB::readImageFile("Data/Font.bmp"));
		texts[i]->getOrCreateStateSet()->setTextureAttributeAndModes(0, textTex);
		texts[i]->getOrCreateStateSet()->setMode(GL_LIGHTING, osg::StateAttribute::OFF);
		//开启混合去除纹理图片的黑色背景
		osg::BlendFunc *blendFunc = new osg::BlendFunc(GL_SRC_ALPHA, GL_ONE, 0.5, 0.5);
		texts[i]->getOrCreateStateSet()->setAttributeAndModes(blendFunc,osg::StateAttribute::ON);
	}	
}

osg::Group* getTextGroup(int characterSet, const std::string& str, 
						 osg::NodeCallback *pu = 0, osg::Drawable::UpdateCallback *cu = 0)
{
	if (characterSet > 1)
	{
		characterSet = 1;
	}

	osg::Group *textGroup = new osg::Group;
	osg::MatrixTransform *posMT = new osg::MatrixTransform;
	posMT->setUpdateCallback(pu);
	for (unsigned i = 0; i < str.size(); ++i)
	{
		//得到字符所对应的Geometry
		// [如"NeHe"字符串我们就分别要得到贴有NeHe字母纹理的Geometry,一共4个]
		int index = str.at(i); 
		index = index - 32 + 128 * characterSet;
		osg::Geode *charGeode = new osg::Geode;
		osg::Geometry *geometry = texts[index];
		geometry->setUpdateCallback(cu);
		geometry->setUseDisplayList(false);
		charGeode->addDrawable(geometry);
		//这个MatrixTransform是用来拉开字符间距的，防止它们叠在一起
		osg::MatrixTransform *charOffsetMT = new osg::MatrixTransform;
		charOffsetMT->setMatrix(osg::Matrix::translate(13 * i, 0, 0));
		charOffsetMT->addChild(charGeode);
		posMT->addChild(charOffsetMT);
	}
	textGroup->addChild(posMT);

	return textGroup;
}


//
//创建HUD相机

osg::Camera* createHUD()
{
	//创建一个相机节点
	osg::Camera* camera = new osg::Camera;
	//设置相机的投影坐标系
	camera->setProjectionMatrix(osg::Matrix::ortho2D(0,640,0,480));
	//将坐标框架设置为绝对的(也就是不受父节点MatrixTransform节点的影响)
	camera->setReferenceFrame(osg::Transform::ABSOLUTE_RF);
	camera->setViewMatrix(osg::Matrix::identity());
	camera->setClearMask(GL_DEPTH_BUFFER_BIT);
	//让相机在其他场景渲染完成之后再渲染
	camera->setRenderOrder(osg::Camera::POST_RENDER);
	camera->setAllowEventFocus(false);

	osg::Group *neheGroup = new osg::Group;
	neheGroup = getTextGroup(0, "NeHe", new PosNeHeUpdateCallback, new ColorNeHeCallback);

	osg::Group *openglGroup = new osg::Group;
	openglGroup = getTextGroup(1, "OpenGL", new PosOpenGLUpdateCallback, new ColorOpenGLCallback);
	
	osg::Group *giuseppeGroup1 = new osg::Group;
	giuseppeGroup1 = getTextGroup(0, "Giuseppe D'Agata", new PosGiuseppe1UpdateCallback, new ColorGiuseppe1Callback);

	osg::Group *giuseppeGroup2 = new osg::Group;
	giuseppeGroup2 = getTextGroup(0, "Giuseppe D'Agata", new PosGiuseppe2UpdateCallback, new ColorGiuseppe2Callback);


	camera->addChild(neheGroup);
	camera->addChild(openglGroup);
	camera->addChild(giuseppeGroup1);
	camera->addChild(giuseppeGroup2);

	return camera;
}

osg::Node*	buildScene()
{
	createTextGeometries();
	osg::Group *root = new osg::Group;
	root->addChild(createWalls());
	root->addChild(createHUD());
	return root;
}

int main( int argc, char** argv )
{
	QApplication app(argc, argv);
	ViewerWidget* viewWidget = new ViewerWidget(buildScene());
	viewWidget->setGeometry( 100, 100, 640, 480 );
	viewWidget->show();
	return app.exec();
}