Just a Computer Graphics Studio & My Life

[iOS] 使用濾鏡 (Using Filter)

我現在最常用的影像處理App是Instagram,一直想知道它的濾鏡是怎麼做出來,所以先前研究Instagram濾鏡,如今總算讓我有機會自己玩影像處理的程式!才發現原來iOS SDK已經有許多現成的濾鏡可以隨意取用,我就不用再去研究演算法如何如何~

Using Filter2

使用濾鏡前

於是乎,我做了一個App來玩,就像Instagram那樣子~

在此我有13個濾鏡(第一個沒有套用濾鏡),可以看到我們只要建立想使用的濾鏡,並設定所需參數,即可輸出有濾鏡效果的影像!

/**
 Theme: Using Filter
 IDE: Xcode 6
 Language: Objective C
 Date: 103/10/31
 Author: HappyMan
 Blog: https://cg2010studio.wordpress.com/
 */
-(UIImage *)filterWithImage:(UIImage *)image index:(NSInteger)index
{
    // 創建基於 GPU 的 CIContext 對象
    CIContext *context = [CIContext contextWithOptions:nil];
    CIImage *ciSourceImage = [[CIImage alloc] initWithImage:image];
    CIFilter *filter;
    switch (index) {
            case 0:

            break;
        case 1:
            filter = [CIFilter filterWithName:@"CIColorControls"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            [filter setValue:@(1.1) forKey:kCIInputSaturationKey];
            [filter setValue:@(1.1) forKey:kCIInputContrastKey];
            [filter setValue:@(0.0) forKey:kCIInputBrightnessKey];
            break;
        case 2:
            filter = [CIFilter filterWithName:@"CIHueAdjust"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            [filter setValue:@(0.5) forKey:kCIInputAngleKey];
            break;
        case 3:
            filter = [CIFilter filterWithName:@"CIPhotoEffectInstant"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            break;
        case 4:
            filter = [CIFilter filterWithName:@"CIGammaAdjust"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            [filter setValue:@(0.75) forKey:@"inputPower"];
            break;
        case 5:
            filter = [CIFilter filterWithName:@"CILinearToSRGBToneCurve"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            break;
        case 6:
            filter = [CIFilter filterWithName:@"CISRGBToneCurveToLinear"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            break;
        case 7:
            filter = [CIFilter filterWithName:@"CIVibrance"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            [filter setValue:@(2.5) forKey:@"inputAmount"];
            break;
        case 8:
            filter = [CIFilter filterWithName:@"CIPhotoEffectProcess"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            break;
        case 9:
            filter = [CIFilter filterWithName:@"CIPhotoEffectFade"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            break;
        case 10:
            filter = [CIFilter filterWithName:@"CIPhotoEffectTransfer"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            break;
        case 11:
            filter = [CIFilter filterWithName:@"CIPhotoEffectMono"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            break;
        case 12:
            filter = [CIFilter filterWithName:@"CIVignette"];
            [filter setValue:ciSourceImage forKey:kCIInputImageKey];
            [filter setValue:@(1.9) forKey:kCIInputRadiusKey];
            [filter setValue:@(1.4) forKey:kCIInputIntensityKey];
            break;
        default:
            break;
    }

    // 得到過濾後的圖片
    CIImage *outputImage = [filter outputImage];

    // 轉換圖片
    CGImageRef cgImage = [context createCGImage:outputImage fromRect:[outputImage extent]];
    UIImage *newImage = [UIImage imageWithCGImage:cgImage];

    // 釋放 C 對象
    CGImageRelease(cgImage);

    return newImage;
}
Using Filter

使用12號濾鏡後

using filter

使用10號濾鏡後

 

想知道內建有哪些濾鏡嗎?以下程式碼會輸出目前內建的濾鏡名稱:

    NSArray *filters = [CIFilter filterNamesInCategory:kCICategoryBuiltIn];
    NSLog(@"%@", filters);
    [filters count];
    NSLog(@"一共有 %li 種 CIFilter 濾鏡效果", [filters count]);

(
CIAccordionFoldTransition,
CIAdditionCompositing,
CIAffineClamp,
CIAffineTile,
CIAffineTransform,
CIAreaHistogram,
CIAztecCodeGenerator,
CIBarsSwipeTransition,
CIBlendWithAlphaMask,
CIBlendWithMask,
CIBloom,
CIBumpDistortion,
CIBumpDistortionLinear,
CICheckerboardGenerator,
CICircleSplashDistortion,
CICircularScreen,
CICode128BarcodeGenerator,
CIColorBlendMode,
CIColorBurnBlendMode,
CIColorClamp,
CIColorControls,
CIColorCrossPolynomial,
CIColorCube,
CIColorCubeWithColorSpace,
CIColorDodgeBlendMode,
CIColorInvert,
CIColorMap,
CIColorMatrix,
CIColorMonochrome,
CIColorPolynomial,
CIColorPosterize,
CIConstantColorGenerator,
CIConvolution3X3,
CIConvolution5X5,
CIConvolution9Horizontal,
CIConvolution9Vertical,
CICopyMachineTransition,
CICrop,
CIDarkenBlendMode,
CIDifferenceBlendMode,
CIDisintegrateWithMaskTransition,
CIDissolveTransition,
CIDivideBlendMode,
CIDotScreen,
CIEightfoldReflectedTile,
CIExclusionBlendMode,
CIExposureAdjust,
CIFalseColor,
CIFlashTransition,
CIFourfoldReflectedTile,
CIFourfoldRotatedTile,
CIFourfoldTranslatedTile,
CIGammaAdjust,
CIGaussianBlur,
CIGaussianGradient,
CIGlassDistortion,
CIGlideReflectedTile,
CIGloom,
CIHardLightBlendMode,
CIHatchedScreen,
CIHighlightShadowAdjust,
CIHistogramDisplayFilter,
CIHoleDistortion,
CIHueAdjust,
CIHueBlendMode,
CILanczosScaleTransform,
CILightenBlendMode,
CILightTunnel,
CILinearBurnBlendMode,
CILinearDodgeBlendMode,
CILinearGradient,
CILinearToSRGBToneCurve,
CILineScreen,
CILuminosityBlendMode,
CIMaskToAlpha,
CIMaximumComponent,
CIMaximumCompositing,
CIMinimumComponent,
CIMinimumCompositing,
CIModTransition,
CIMultiplyBlendMode,
CIMultiplyCompositing,
CIOverlayBlendMode,
CIPerspectiveCorrection,
CIPhotoEffectChrome,
CIPhotoEffectFade,
CIPhotoEffectInstant,
CIPhotoEffectMono,
CIPhotoEffectNoir,
CIPhotoEffectProcess,
CIPhotoEffectTonal,
CIPhotoEffectTransfer,
CIPinchDistortion,
CIPinLightBlendMode,
CIPixellate,
CIQRCodeGenerator,
CIRadialGradient,
CIRandomGenerator,
CISaturationBlendMode,
CIScreenBlendMode,
CISepiaTone,
CISharpenLuminance,
CISixfoldReflectedTile,
CISixfoldRotatedTile,
CISmoothLinearGradient,
CISoftLightBlendMode,
CISourceAtopCompositing,
CISourceInCompositing,
CISourceOutCompositing,
CISourceOverCompositing,
CISRGBToneCurveToLinear,
CIStarShineGenerator,
CIStraightenFilter,
CIStripesGenerator,
CISubtractBlendMode,
CISwipeTransition,
CITemperatureAndTint,
CIToneCurve,
CITriangleKaleidoscope,
CITwelvefoldReflectedTile,
CITwirlDistortion,
CIUnsharpMask,
CIVibrance,
CIVignette,
CIVignetteEffect,
CIVortexDistortion,
CIWhitePointAdjust
)

一共有 127 種 CIFilter 濾鏡效果

濾鏡的參數有些定義成常數,有些則要使用字串

想知道每個濾鏡如何使用嗎?可以輸出其特性:

NSLog(@"%@", [[CIFilter filterWithName:@"CIHueAdjust"] attributes]);

{
CIAttributeFilterCategories = (
CICategoryColorAdjustment,
CICategoryVideo,
CICategoryStillImage,
CICategoryInterlaced,
CICategoryNonSquarePixels,
CICategoryBuiltIn
);
CIAttributeFilterDisplayName = “Hue Adjust";
CIAttributeFilterName = CIHueAdjust;
inputAngle = {
CIAttributeClass = NSNumber;
CIAttributeDefault = 0;
CIAttributeIdentity = 0;
CIAttributeSliderMax = “3.141592653589793″;
CIAttributeSliderMin = “-3.141592653589793″;
CIAttributeType = CIAttributeTypeAngle;
};
inputImage = {
CIAttributeClass = CIImage;
CIAttributeType = CIAttributeTypeImage;
};
}

CIHueAdjust為例的參數有兩個:inputAngleinputImage

想知道影像套用濾鏡後的效果圖嗎?可以直接參考官方的Core Image Filter

再做一個後台就能變成社群影像分享平台囉~

參考:使用 CIFilter 對影像製作復古效果的褐色調查閱目前在 iOS 上 CIFilter 能使用的濾鏡效果方法使用 CoreImage Framework 實作色相轉換Core Image Filter ReferenceCore Image 介紹: 圖像濾鏡應用

廣告

發表留言

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

您的留言將使用 WordPress.com 帳號。 登出 / 變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 / 變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 / 變更 )

Google+ photo

您的留言將使用 Google+ 帳號。 登出 / 變更 )

連結到 %s

標籤雲

%d 位部落客按了讚: