前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >(译)SDL编程入门(12)色彩调制

(译)SDL编程入门(12)色彩调制

作者头像
arcticfox
发布2020-10-09 15:17:50
5260
发布2020-10-09 15:17:50
举报

色彩调制

颜色调制可以让你改变渲染纹理的颜色。在这里,我们将使用各种颜色来调制一个纹理。

代码语言:javascript
复制
//Texture wrapper class
class LTexture
{
    public:
        //Initializes variables
        LTexture();

        //Deallocates memory
        ~LTexture();

        //Loads image at specified path
        bool loadFromFile( std::string path );

        //Deallocates texture
        void free();

        //Set color modulation
        void setColor( Uint8 red, Uint8 green, Uint8 blue );

        //Renders texture at given point
        void render( int x, int y, SDL_Rect* clip = NULL );

        //Gets image dimensions
        int getWidth();
        int getHeight();

    private:
        //The actual hardware texture
        SDL_Texture* mTexture;

        //Image dimensions
        int mWidth;
        int mHeight;
};

我们要在纹理包装器类中添加一个函数,允许设置纹理调制。它所要做的就是接收一个红、绿、蓝三色组件。

代码语言:javascript
复制
void LTexture::setColor( Uint8 red, Uint8 green, Uint8 blue ){
    //调制纹理
    SDL_SetTextureColorMod( mTexture, red, green, blue );
}

设置纹理调制就像调用SDL_SetTextureColorMod[1]一样简单。你只需传入你想调制的纹理和你想调制的颜色。

现在颜色调制是如何工作的呢?假设你有这样的纹理:

然后你用红色255,绿色128,蓝色255来调制它。你最终会得到这样的结果:

你可能已经注意到 SDL_SetTextureColorMod 接受 Uint8 作为颜色组件的参数。Uint8是一个无符号的8位整数。这意味着它可以从0到255。128大约是0和255之间的一半,所以当你把绿色调制到128时,它会把纹理上任何像素的绿色分量减半。

红色和蓝色的方块不会受到影响,因为它们没有绿色,但绿色的亮度会减半,白色会变成淡淡的洋红色(洋红色是红色255,绿色0,蓝色255)。颜色调制只是在整个纹理中乘以一种颜色的方法。

代码语言:javascript
复制
//Main loop flag
bool quit = false;

//Event handler
SDL_Event e;

//调制成分
Uint8 r = 255;
Uint8 g = 255;
Uint8 b = 255;

这里是主循环之前。在这个演示中,我们将使用按键来调制各个颜色组件。要做到这一点,我们需要跟踪颜色组件的值。

代码语言:javascript
复制
//While application is running
while( !quit )
{
    //Handle events on queue
    while( SDL_PollEvent( &e ) != 0 )
    {
        //User requests quit
        if( e.type == SDL_QUIT )
        {
            quit = true;
        }
        //按键时改变RGB值
        else if( e.type == SDL_KEYDOWN )
        {
            switch( e.key.keysym.sym )
            {
                    //增加红色
                case SDLK_q:
                    r += 32;
                    break;

                    //增加绿色
                case SDLK_w:
                    g += 32;
                    break;

                    //增加蓝色
                case SDLK_e:
                    b += 32;
                    break;

                    //减少红色
                case SDLK_a:
                    r -= 32;
                    break;

                    //减少绿色
                case SDLK_s:
                    g -= 32;
                    break;

                    //减少蓝色
                case SDLK_d:
                    b -= 32;
                    break;
            }
        }
    }
    //Clear screen
    SDL_SetRenderDrawColor( gRenderer, 0xFF, 0xFF, 0xFF, 0xFF );
    SDL_RenderClear( gRenderer );

    //调制和渲染纹理
    gModulatedTexture.setColor( r, g, b );
    gModulatedTexture.render( 0, 0 );

    //Update screen
    SDL_RenderPresent( gRenderer );
}
    

在我们的事件循环中,我们会让q、w和e键增加红、绿、蓝三色的分量,让a、s和d键减少红、绿、蓝三色的分量。它们增加/减少32个分量,所以每按一次键都会有明显的变化。

而最后我们设置的是纹理调制和渲染纹理。

参考资料

[1]

SDL_SetTextureColorMod: http://wiki.libsdl.org/SDL_SetTextureColorMod

[2]

这里: http://www.lazyfoo.net/tutorials/SDL/12_color_modulation/12_color_modulation.zip

[3]

原文链接: http://www.lazyfoo.net/tutorials/SDL/12_color_modulation/index.php

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-10-08,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 编程之路从0到1 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 色彩调制
    • 参考资料
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档