12

のスクリーンショットに画像効果を適用して、ガラスで iOS 7 スタイルのガラス効果を使用しようとしていMKMapViewます。Apple が提供するこの UIImage カテゴリは、私がベースラインとして使用しているものです。このメソッドは、ソース イメージの彩度を下げ、ティント カラーを適用し、入力値を使用して大幅にぼかします。

[image applyBlurWithRadius:10.0
                 tintColor:[UIColor colorWithRed:229/255.0f green:246/255.0f blue:255/255.0f alpha:0.33] 
     saturationDeltaFactor:0.66
                 maskImage:nil];

これにより、探している効果が得られますが、iPhone 4 でレンダリングするには時間がかかりすぎ.3ます。.5

ここに画像の説明を入力

私の予備的な試みは約5〜10倍高速だったので、エクセレントを使用したいと思いますGPUImageが、うまくいかないようです。

GPUImagePicture *stillImageSource = [[GPUImagePicture alloc] initWithImage:image];

GPUImageSaturationFilter *saturationFilter = [[GPUImageSaturationFilter alloc] init];
saturationFilter.saturation = 0.33; // 1.0 - 0.66;
[stillImageSource addTarget:saturationFilter];

GPUImageMonochromeFilter *monochromeFilter = [[GPUImageMonochromeFilter alloc] init];
[monochromeFilter setColor:(GPUVector4){229/255.0f, 246/255.0f, 1.0f, 0.33f}];
[monochromeFilter setIntensity:0.2];
[saturationFilter addTarget:monochromeFilter];

GPUImageFastBlurFilter *blurFilter = [[GPUImageFastBlurFilter alloc] init];
blurFilter.blurSize = 2;
blurFilter.blurPasses = 3;
[monochromeFilter addTarget:blurFilter];

[saturationFilter prepareForImageCapture];
[monochromeFilter prepareForImageCapture];

[stillImageSource processImage];
image = [blurFilter imageFromCurrentlyProcessedOutput];

これにより、近いが完全ではない画像が生成されます

ここに画像の説明を入力

ぼかしが足りないようですが、blurSize上を上げてみると万華鏡のように格子状になります。2 番目の画像を拡大すると、グリッドが実際に表示されます。私が模倣しようとしている色合いは、Apple のサンプルが行っていると思われるオーバーレイやブレンドではなく、画像を洗い流すだけのようです。

@BradLarson が別の SO questionで行ったコメントに従って、フィルターをセットアップしようとしました。この効果を再現するために間違ったGPUImageフィルターを使用していますか、それともフィルターの設定が間違っているだけですか?

4

1 に答える 1

32

わかりました、私はここで少しの間何かに取り組んでいましたが、ついにそれが機能するようになりました。GPUImage のぼかしフィルターに多くの変更をフレームワークに取り入れた結果、Apple がコントロール センター ビューなどに使用するぼかし効果の合理的なレプリカが得られたと思います。

以前は、フレームワークに含まれていたぼかしは、事前に計算された単一の半径を使用していました。その強度に影響を与える唯一の方法は、入力画像からピクセルをサンプリングする間隔を微調整することでした。ピクセルあたりのサンプル数が限られているため、サンプリングされたピクセル間の間隔の倍数を 1.5 より大きく変更すると、ピクセルがスキップされるため、深刻なブロッキング アーティファクトが発生し始めました。

私が作成した新しいガウス ブラーの実装は、事前に計算されたガウス ウェイトのパフォーマンス上の利点と、ガウス ブラーに任意の半径 (シグマ) を使用する機能を組み合わせたものです。これは、さまざまな半径に必要なシェーダーをオンザフライで生成することによって行われます。また、ハードウェア補間を使用してサンプル ポイントごとに一度に 2 つのテクセルを読み取ることにより、特定のぼかし半径に必要なテクスチャ サンプルの数を減らします。

新しい GPUImageiOSBlurFilter は、この調整された任意半径のガウスぼかしフィルターと、Apple がぼかした後に色に対して実行する調整を複製するように見える色補正フィルターを組み合わせたものです。以下の比較を回答hereに追加しましたが、左側のコントロール センター ビューからの Apple の組み込みのぼかしと、右側の新しい GPUImage ぼかしフィルターを示しています。

アップルのボケ GPUImage のぼかし

パフォーマンスを改善する方法として (Apple のぼかしは 48 のシグマで発生するように見えますが、これはピクセルごとにかなり大きな領域をサンプリングする必要があります)、ガウスぼかしの前に 4 倍のダウンサンプリングを使用し、その後で 4 倍のアップサンプリングを使用します。これにより、ぼかしが必要なピクセル数が 16 分の 1 に減少し、ぼかしシグマも 48 から 12 に減少します。iPhone 4S は、このフィルターを使用して約 30 ミリ秒で画面全体をぼかすことができます。

ぼかしを正しくすることは1つのことです。Apple は、ビューの背後にある画像コンテンツを取得するための高速な方法をまだ提供していないため、急速に変化するコンテンツのボトルネックになる可能性が最も高いです。

于 2013-10-19T22:29:57.737 に答える