（Cocos2d-x）スプライトをぼかすことができるアクションはありますか？

Question

私は背景としてスプライトを追加します。 これでスプライトが徐々にぼやけることがあります。

私は仕事をするためにTexture2Dを変更するかもしれませんが、Texture2Dは変更できないようです。

どうすればよいですか？

Answer 1

あなたは3つのオプションがあります。

1））Photoshopで背景をぼかした写真（迅速かつ簡単に、余分な大きさにし、

2）（そのシンプルでぼかしていないシェーダを使用するには、重い操作です）、

3）バックグラウンドで背景を再描画して、新しいテクスチャにします。 はここでテクスチャに描画する方法を私のポストです：

http://discuss.cocos2d-x.org/t/is-it-possible-to-erase-some-pixels-from-a-sprite/34460/5?u=piotrros

は、ここでこのことを知って別のものに一つの画像（データ配列）をぼかす私のプロジェクトからの機能です：ちょうど覚え

void Sample::blur(unsigned char* inputData, unsigned char* outputData, float r) { 
    int R2 = pow(r + 2, 2); 
    for(int i = 0; i < canvasHeight; i++){ 
     for(int j = 0; j < canvasWidth; j++) { 
      int val1 = 0; 
      int val2 = 0; 
      int val3 = 0; 
      int val4 = 0; 

      int index2 = (j + (canvasHeight - i - 1) * canvasWidth) * 4; 

      for(int iy = i - r; iy < i + r + 1; iy++){ 
       for(int ix = j - r; ix < j + r + 1; ix++) { 

        int x = CLAMP(ix, 0, canvasWidth - 1); 
        int y = CLAMP(iy, 0, canvasHeight - 1); 

        int index = (x + (canvasHeight - y - 1) * canvasWidth) * 4; 

        val1 += inputData[index]; 
        val2 += inputData[index + 1]; 
        val3 += inputData[index + 2]; 
        val4 += inputData[index + 3]; 
       } 
      } 

      outputData[index2] = val1/R2; 
      outputData[index2 + 1] = val2/R2; 
      outputData[index2 + 2] = val3/R2; 
      outputData[index2 + 3] = val4/R2; 
     } 
    } 
} 

そのぼかしは重くて長い操作です。大きな画像があるとしばらく時間がかかることがあります。

Answer 2

シェーダを使用できます。あなたはこのように、ココステストプロジェクトから、単純なぼかしシェーダを得ることができます。

#ifdef GL_ES 
precision mediump float; 
#endif 

varying vec4 v_fragmentColor; 
varying vec2 v_texCoord; 

uniform vec2 resolution; 
uniform float blurRadius; 
uniform float sampleNum; 

vec4 blur(vec2); 

void main(void) 
{ 
vec4 col = blur(v_texCoord); //* v_fragmentColor.rgb; 
gl_FragColor = vec4(col) * v_fragmentColor; 
} 

vec4 blur(vec2 p) 
{ 
    if (blurRadius > 0.0 && sampleNum > 1.0) 
    { 
     vec4 col = vec4(0); 
     vec2 unit = 1.0/resolution.xy; 

     float r = blurRadius; 
     float sampleStep = r/sampleNum; 

     float count = 0.0; 

     for(float x = -r; x < r; x += sampleStep) 
     { 
      for(float y = -r; y < r; y += sampleStep) 
      { 
       float weight = (r - abs(x)) * (r - abs(y)); 
       col += texture2D(CC_Texture0, p + vec2(x * unit.x, y * unit.y)) * weight; 
       count += weight; 
      } 
     } 

     return col/count; 
    } 

    return texture2D(CC_Texture0, p); 
} 

あなたのスプライトにカスタムシェーダを追加する方法がわからない場合は - ここでの例です！

class MySpriteBlur : public Sprite { 
public: 
    ~MySpriteBlur(); 
    bool initWithTexture(Texture2D* texture, const Rect& rect); 
    void initGLProgram(); 
    static MySpriteBlur *create(const char *pszFileName); 
    void setBlurRadius(float radius); 
    void setBlurSampleNum(float num); 
protected: 
    float _blurRadius; 
    float _blurSampleNum; 
}; 

をし、それを実装します： あなたはSpriteクラスを拡張するのに役立ちます

MySpriteBlur::~MySpriteBlur() { 
} 
MySpriteBlur* MySpriteBlur::create(const char *pszFileName) { 
    MySpriteBlur* pRet = new (std::nothrow) MySpriteBlur(); 
    if (pRet && pRet->initWithFile(pszFileName)) { 
     pRet->autorelease(); 
    } else { 
     CC_SAFE_DELETE(pRet); 
    } 
    return pRet; 
} 
bool MySpriteBlur::initWithTexture(Texture2D* texture, const Rect& rect) { 
    _blurRadius = 0; 
    if (Sprite::initWithTexture(texture, rect)) { 
#if CC_ENABLE_CACHE_TEXTURE_DATA 
     auto listener = EventListenerCustom::create(EVENT_RENDERER_RECREATED, [this](EventCustom* event) { 
      initGLProgram(); 
     }); 
     _eventDispatcher->addEventListenerWithSceneGraphPriority(listener, this); 
#endif 
     initGLProgram(); 
     return true; 
    } 
    return false; 
} 
void MySpriteBlur::initGLProgram() { 
    std::string fragSource = FileUtils::getInstance()->getStringFromFile(
     FileUtils::getInstance()->fullPathForFilename("shaders/example_blur.fsh")); 
    auto program = GLProgram::createWithByteArrays(ccPositionTextureColor_noMVP_vert, fragSource.data()); 
    auto glProgramState = GLProgramState::getOrCreateWithGLProgram(program); 
    setGLProgramState(glProgramState); 
    auto size = getTexture()->getContentSizeInPixels(); 
    getGLProgramState()->setUniformVec2("resolution", size); 
    getGLProgramState()->setUniformFloat("blurRadius", _blurRadius); 
    getGLProgramState()->setUniformFloat("sampleNum", 7.0f); 
} 
void MySpriteBlur::setBlurRadius(float radius) { 
    _blurRadius = radius; 
    getGLProgramState()->setUniformFloat("blurRadius", _blurRadius); 
} 
void MySpriteBlur::setBlurSampleNum(float num) { 
    _blurSampleNum = num; 
    getGLProgramState()->setUniformFloat("sampleNum", _blurSampleNum); 
} 

希望を！