Qt 3D教程（三）实现对模型材质參数的控制
蒋彩阳原创文章，首发地址：http://blog.csdn.net/gamesdev/article/details/47131841。欢迎同行前来探讨。
上一篇教程介绍的是显示一个三维模型的基本步骤，接下来我们须要实现的是加入材质，而且希望我们通过button来控制材质的參数。
这种效果看起来非常像一个3D模型材质编辑器的样子。
那我们来尝试一下吧。
首先我们对Settings这个类进行改动，给它增添一些属性，比方说环境光、漫反射、镜面反射以及反射系数。
通过Q_PROPERTY宏以及一系列的setter和getter函数，我们就能够做到这一点。
class Settings: public QObject
{
Q_OBJECT
Q_PROPERTY( bool showModel READ showModel WRITE setShowModel NOTIFY showModelChanged )
Q_PROPERTY( QColor ambient READ ambient WRITE setAmbient NOTIFY ambientChanged )
Q_PROPERTY( QColor diffuse READ diffuse WRITE setDiffuse NOTIFY diffuseChanged )
Q_PROPERTY( QColor specular READ specular WRITE setSpecular NOTIFY specularChanged )
Q_PROPERTY( float shininess READ shininess WRITE setShininess NOTIFY shininessChanged )
public:
explicit Settings( QObject* parent = Q_NULLPTR ); bool showModel( void ) { return m_showModel; }
void setShowModel( bool showModel ); QColor ambient( void ) { return m_ambient; }
void setAmbient( const QColor& ambient ); QColor diffuse( void ) { return m_diffuse; }
void setDiffuse( const QColor& diffuse ); QColor specular( void ) { return m_specular; }
void setSpecular( const QColor& specular ); float shininess( void ) { return m_shininess; }
void setShininess( float shininess );
signals:
void showModelChanged( void );
void ambientChanged( void );
void diffuseChanged( void );
void specularChanged( void );
void shininessChanged( void );
protected:
bool m_showModel;
QColor m_ambient, m_diffuse, m_specular;
float m_shininess;
};
以下是Settings一些函数的实现：
Settings::Settings( QObject* parent ): QObject( parent )
{
m_showModel = true;
m_ambient = QColor( 153, 51, 26 );
m_diffuse = QColor( 51, 153, 26 );
m_specular = QColor( 153, 230, 26 );
m_shininess = 0.6;
} void Settings::setShowModel( bool showModel )
{
if ( m_showModel == showModel ) return;
m_showModel = showModel;
emit showModelChanged( );
} void Settings::setAmbient( const QColor& ambient )
{
if ( m_ambient == ambient ) return;
m_ambient = ambient;
emit ambientChanged( );
} void Settings::setDiffuse( const QColor& diffuse )
{
if ( m_diffuse == diffuse ) return;
m_diffuse = diffuse;
emit diffuseChanged( );
} void Settings::setSpecular( const QColor& specular )
{
if ( m_specular == specular ) return;
m_specular = specular;
emit specularChanged( );
} void Settings::setShininess( float shininess )
{
if ( m_shininess == shininess ) return;
m_shininess = shininess;
emit shininessChanged( );
}
随后我们声明槽函数，点击环境光、漫反射和镜面反射的时候。它都会设置button的背景色，然后设置m_settings的相关成员。
void MainWindow::decorateButton( QPushButton* button, const QColor& color )
{
QString styleSheetTemplate( "background: rgb( %1, %2, %3 )" );
QString styleSheet = styleSheetTemplate.
arg( color.red( ) ).arg( color.green( ) ).
arg( color.blue( ) );
button->setStyleSheet( styleSheet );
} void MainWindow::on_ambientButton_clicked()
{
QPushButton* button = qobject_cast<QPushButton*>( sender( ) );
QColor color, prevColor;
prevColor = m_settings.ambient( );
color = QColorDialog::getColor( prevColor, this, "请选择一个颜色" );
decorateButton( button, color );
m_settings.setAmbient( color );
} void MainWindow::on_diffuseButton_clicked()
{
QPushButton* button = qobject_cast<QPushButton*>( sender( ) );
QColor color, prevColor;
prevColor = m_settings.diffuse( );
color = QColorDialog::getColor( prevColor, this, "请选择一个颜色" );
decorateButton( button, color );
m_settings.setDiffuse( color );
} void MainWindow::on_specularButton_clicked()
{
QPushButton* button = qobject_cast<QPushButton*>( sender( ) );
QColor color, prevColor;
prevColor = m_settings.specular( );
color = QColorDialog::getColor( prevColor, this, "请选择一个颜色" );
decorateButton( button, color );
m_settings.setSpecular( color );
} void MainWindow::on_shininessEdit_returnPressed( void )
{
m_settings.setShininess( ui->shininessEdit->text( ).toFloat( ) );
}
最后我们在QML中加入PhongMaterial这个类，这个类在C++中是Qt3D::Render::QPhongMaterial，它提供了基于Phong光照模型的这种材质，提供了一种很真实的显示效果。我们使用_settings这个上下文属性将上述的材质属性绑定到PhongMaterial中。加入了PhongMaterial的QML代码例如以下：
import Qt3D 2.0
import Qt3D.Renderer 2.0 Entity
{
id: root Camera
{
id: camera
position: Qt.vector3d( 0.0, 20.0, 100.0 )
projectionType: CameraLens.PerspectiveProjection
fieldOfView: 45
aspectRatio: 16.0 / 9.0
nearPlane : 0.1
farPlane : 1000.0
upVector: Qt.vector3d( 0.0, 1.0, 0.0 )
viewCenter: Qt.vector3d( 0.0, 20.0, 0.0 )
} components: FrameGraph
{
ForwardRenderer
{
clearColor: Qt.rgba( 0.2, 0, 0, 1 )
camera: camera
}
} Entity
{
Mesh
{
id: chestMesh
source: "qrc:/assets/Chest.obj"
enabled: _settings.showModel
} // 新加入的内容
PhongMaterial
{
id: phongMaterial
ambient: _settings.ambient
diffuse: _settings.diffuse
specular: _settings.specular
shininess: _settings.shininess
} components: [ chestMesh, phongMaterial ]
} Configuration
{
controlledCamera: camera
}
}
程序执行截图例如以下：
本次教程的代码均在我的github中，感兴趣的同行们能够通过git clone或者是直接下载我的git项目来获取到本套教程的全部源码。