如何在iPhone視圖中創建模糊文本？

Question

我正在用各種文本和圖像元素建立一個視圖。

我想在視圖中顯示一些文本，並在其後面顯示文本的模糊副本，但不僅僅是文本陰影。

如何將高斯模糊文本應用於UIImage或圖層？

Answer 1

在桌面上，毫無疑問，你會使用CoreImage來做到這一點。

雖然在手機上，我不認爲有一種方法可以使用CoreGraphics來做到這一點。如果它是絕對重要的，OpenGLES可能會提供幫助。

但是，我會建議重新考慮你的界面。我會認爲模糊的文字會讓人分心。

編輯：mledford在評論中指出，你可以使用CoreAnimation。我不知道手機上的CA是否包含桌面上的模糊半徑，但您可以嘗試。

Answer 2

iPhone操作系統不提供任何我知道的核心圖像過濾器 - 否則，是的，過濾CALayer將是正確的方式來做到這一點。如果NSBitmapImageRep可用，您可以通過向其中繪製文本，縮小圖像（縮減採樣），然後再次放大圖像（上採樣）來做原始模糊處理 - 不幸的是，它似乎也丟失了。我已經看到Flash中完成的模糊文本，它（最後我檢查過）沒有像素級別的過濾;你可以嘗試尋找一個教程，看看你可以適應Cocoa Touch。

Answer 3

如果您使用alpha圖層，您將獲得性能提升。如果可能的話，考慮採用不同的方法（甚至可以預先合成文本並將其平鋪爲圖形而不是多層）。

試試看，並使用儀器檢查性能，看看它是否可以接受。如果你在滾動視圖中進行滾動，你的滾動將會停止lot。

Answer 4

看看蘋果的GLImageProcessing iPhone示例。除此之外，它的確有些模糊。

相關的代碼包括：

static void blur(V2fT2f *quad, float t) // t = 1 
{ 
    GLint tex; 
    V2fT2f tmpquad[4]; 
    float offw = t/Input.wide; 
    float offh = t/Input.high; 
    int i; 

    glGetIntegerv(GL_TEXTURE_BINDING_2D, &tex); 

    // Three pass small blur, using rotated pattern to sample 17 texels: 
    // 
    // .\/.. 
    // ./\\/ 
    // \/X/\ rotated samples filter across texel corners 
    // /\\/. 
    // ../\. 

    // Pass one: center nearest sample 
    glVertexPointer (2, GL_FLOAT, sizeof(V2fT2f), &quad[0].x); 
    glTexCoordPointer(2, GL_FLOAT, sizeof(V2fT2f), &quad[0].s); 
    glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE); 
    glColor4f(1.0/5, 1.0/5, 1.0/5, 1.0); 
    validateTexEnv(); 
    glDrawArrays(GL_TRIANGLE_STRIP, 0, 4); 

    // Pass two: accumulate two rotated linear samples 
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR); 
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR); 
    glEnable(GL_BLEND); 
    glBlendFunc(GL_SRC_ALPHA, GL_ONE); 
    for (i = 0; i < 4; i++) 
    { 
     tmpquad[i].x = quad[i].s + 1.5 * offw; 
     tmpquad[i].y = quad[i].t + 0.5 * offh; 
     tmpquad[i].s = quad[i].s - 1.5 * offw; 
     tmpquad[i].t = quad[i].t - 0.5 * offh; 
    } 
    glTexCoordPointer(2, GL_FLOAT, sizeof(V2fT2f), &tmpquad[0].x); 
    glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE); 
    glActiveTexture(GL_TEXTURE1); 
    glEnable(GL_TEXTURE_2D); 
    glClientActiveTexture(GL_TEXTURE1); 
    glTexCoordPointer(2, GL_FLOAT, sizeof(V2fT2f), &tmpquad[0].s); 
    glEnableClientState(GL_TEXTURE_COORD_ARRAY); 
    glBindTexture(GL_TEXTURE_2D, tex); 
    glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_COMBINE); 
    glTexEnvi(GL_TEXTURE_ENV, GL_COMBINE_RGB,  GL_INTERPOLATE); 
    glTexEnvi(GL_TEXTURE_ENV, GL_SRC0_RGB,   GL_TEXTURE); 
    glTexEnvi(GL_TEXTURE_ENV, GL_SRC1_RGB,   GL_PREVIOUS); 
    glTexEnvi(GL_TEXTURE_ENV, GL_SRC2_RGB,   GL_PRIMARY_COLOR); 
    glTexEnvi(GL_TEXTURE_ENV, GL_OPERAND2_RGB,  GL_SRC_COLOR); 
    glTexEnvi(GL_TEXTURE_ENV, GL_COMBINE_ALPHA, GL_REPLACE); 
    glTexEnvi(GL_TEXTURE_ENV, GL_SRC0_ALPHA,  GL_PRIMARY_COLOR); 

    glColor4f(0.5, 0.5, 0.5, 2.0/5); 
    validateTexEnv(); 
    glDrawArrays(GL_TRIANGLE_STRIP, 0, 4); 

    // Pass three: accumulate two rotated linear samples 
    for (i = 0; i < 4; i++) 
    { 
     tmpquad[i].x = quad[i].s - 0.5 * offw; 
     tmpquad[i].y = quad[i].t + 1.5 * offh; 
     tmpquad[i].s = quad[i].s + 0.5 * offw; 
     tmpquad[i].t = quad[i].t - 1.5 * offh; 
    } 
    glDrawArrays(GL_TRIANGLE_STRIP, 0, 4); 

    // Restore state 
    glDisableClientState(GL_TEXTURE_COORD_ARRAY); 
    glClientActiveTexture(GL_TEXTURE0); 
    glBindTexture(GL_TEXTURE_2D, Half.texID); 
    glDisable(GL_TEXTURE_2D); 
    glTexEnvi(GL_TEXTURE_ENV, GL_OPERAND2_RGB,  GL_SRC_ALPHA); 
    glActiveTexture(GL_TEXTURE0); 
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); 
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); 
    glDisable(GL_BLEND); 
}