实现图片的老旧、色彩、旋转效果
（1）使用 StoryBoard 故事版布局界面；
（2）使用 Core Image 框架的 CIFilter 过滤器；分别对应的过滤器名称是：CISepiaTone（棕黑色调）、CIHueAdjust（色彩调整）、CIStraightenFilter（纠正过滤器）；
（3）另外就是使用 UIImagePickerController 来从图片库中选择图片，使用 ALAssetsLibrary 保存过滤器效果处理后的图片到图片库里。
图片处理过程：
1、创建基于 GPU的CIContext 对象实例
2、通过过滤器名称创建 CIFilter 对象实例
3、设置 CIFilter 对象实例参数
4、通过 CIFilter 对象实例的 outputImage 方法产生 CIImager 对象实例
5、通过 CIContext 对象实例的 createCGImage 方法将 CIImager 对象实例转换为 CGImageRef 对象实例
6、通过 UIImage 类的 imageWithCGImage 方法创建 UIImage 对象实例
7、绑定图片视图的图片为过滤器效果处理后的 UIImage 对象实例
8、使用 CGImageRelease 方法释放 CGImageRef 对象实例
关键操作：
效果如下：
iPhone 5s
iPhone 6
iPhone 6 Plus
ViewController.h
#import <UIKit/UIKit.h>
#import <AssetsLibrary/AssetsLibrary.h> @interface ViewController : UIViewController <UIImagePickerControllerDelegate, UINavigationControllerDelegate>
@property (strong, nonatomic) IBOutlet UIImageView *imgVCustom;
@property (strong, nonatomic) IBOutlet UISlider *sldSepiaTone;
@property (strong, nonatomic) IBOutlet UISlider *sldHueAdjust;
@property (strong, nonatomic) IBOutlet UISlider *sldStraightenFilter; @end
ViewController.m
#import "ViewController.h" @interface ViewController ()
@property (strong, nonatomic) CIContext *context;
@property (strong, nonatomic) CIImage *imgSource;
@property (strong, nonatomic) CIFilter *filterSepiaTone;
@property (strong, nonatomic) CIFilter *filterHueAdjust;
@property (strong, nonatomic) CIFilter *filterStraightenFilter;
- (void)layoutUI;
- (void)displayImageWithFilter:(CIFilter *)filter;
@end @implementation ViewController - (void)viewDidLoad {
[super viewDidLoad]; [self layoutUI];
} - (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
} - (void)layoutUI {
//设置是否是连续性的；默认值为YES，表示拉动中也会触发Value Changed事件方法；这里我们设置为NO，在拉动后才触发
_sldSepiaTone.continuous = NO;
_sldHueAdjust.continuous = NO;
_sldStraightenFilter.continuous = NO; //得到图片路径创建CIImage对象实例
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"Big-Buck-Bunny-Clip" ofType:@"png"];
NSURL *fileURL = [NSURL fileURLWithPath:filePath];
_imgSource = [CIImage imageWithContentsOfURL:fileURL]; //创建基于CPU的CIContext对象实例
//_context = [CIContext contextWithOptions: [NSDictionary dictionaryWithObject:[NSNumber numberWithBool:YES] forKey:kCIContextUseSoftwareRenderer]]; //创建基于GPU的CIContext对象实例
_context = [CIContext contextWithOptions: nil]; //创建过滤器
_filterSepiaTone = [CIFilter filterWithName:@"CISepiaTone"]; //棕黑色调
_filterHueAdjust = [CIFilter filterWithName:@"CIHueAdjust"]; //色彩调整
_filterStraightenFilter = [CIFilter filterWithName:@"CIStraightenFilter"]; //纠正过滤器
} - (void)displayImageWithFilter:(CIFilter *)filter {
//得到过滤后的图片
CIImage *imgOutput = [filter outputImage]; //转换图片
CGImageRef imgRef = [_context createCGImage:imgOutput fromRect:[imgOutput extent]];
UIImage *imgNew = [UIImage imageWithCGImage:imgRef]; _imgVCustom.image = imgNew; //释放CGImageRef对象实例
CGImageRelease(imgRef);
} #pragma mark - IBAction
- (IBAction)changeSepiaTone:(id)sender {
_sldHueAdjust.value = 0.0;
_sldStraightenFilter.value = 0.0;
float slideVal = _sldSepiaTone.value; //设置过滤器参数
[_filterSepiaTone setValue:_imgSource forKey:kCIInputImageKey];
[_filterSepiaTone setValue:[NSNumber numberWithFloat:slideVal] forKey:@"inputIntensity"]; [self displayImageWithFilter:_filterSepiaTone];
} - (IBAction)changeHueAdjust:(id)sender {
_sldSepiaTone.value = 0.0;
_sldStraightenFilter.value = 0.0;
float slideVal = _sldHueAdjust.value; //设置过滤器参数
[_filterHueAdjust setValue:_imgSource forKey:kCIInputImageKey];
[_filterHueAdjust setValue:[NSNumber numberWithFloat:slideVal] forKey:@"inputAngle"]; [self displayImageWithFilter:_filterHueAdjust];
} - (IBAction)changeStraightenFilter:(id)sender {
_sldSepiaTone.value = 0.0;
_sldHueAdjust.value = 0.0;
float slideVal = _sldStraightenFilter.value; //设置过滤器参数
[_filterStraightenFilter setValue:_imgSource forKey:kCIInputImageKey];
[_filterStraightenFilter setValue:[NSNumber numberWithFloat:slideVal] forKey:@"inputAngle"]; [self displayImageWithFilter:_filterStraightenFilter];
} - (IBAction)resetImage:(id)sender {
//得到图片路径创建CIImage对象实例
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"Big-Buck-Bunny-Clip" ofType:@"png"];
NSURL *fileURL = [NSURL fileURLWithPath:filePath];
_imgSource = [CIImage imageWithContentsOfURL:fileURL]; //重置滑杆值
_sldSepiaTone.value = 0.0;
_sldHueAdjust.value = 0.0;
_sldStraightenFilter.value = 0.0;
_imgVCustom.image = [UIImage imageWithContentsOfFile:filePath];
} - (IBAction)chooseImage:(id)sender {
UIImagePickerController *imagePickerController = [[UIImagePickerController alloc] init];
imagePickerController.delegate = self;
[self presentViewController:imagePickerController
animated:YES
completion:^{
//code
}];
} - (IBAction)saveImage:(id)sender {
CIFilter *filter;
if (_sldSepiaTone.value != 0.0) {
filter = _filterSepiaTone;
} else if (_sldHueAdjust.value != 0.0) {
filter = _filterHueAdjust;
} else {
filter = _filterStraightenFilter;
} CIImage *imgOutput = [filter outputImage];
CGImageRef imgRefToSave = [_context createCGImage:imgOutput fromRect:[imgOutput extent]]; //需要导入头文件<AssetsLibrary/AssetsLibrary.h>
//保存到图片库中
ALAssetsLibrary *library = [[ALAssetsLibrary alloc] init];
[library writeImageToSavedPhotosAlbum:imgRefToSave
metadata:[imgOutput properties]
completionBlock:^(NSURL *assetURL, NSError *error) {
CGImageRelease(imgRefToSave); UIAlertView *alertV = [[UIAlertView alloc] initWithTitle:@"提示信息"
message:@"保存成功"
delegate:nil
cancelButtonTitle:nil
otherButtonTitles:@"确定", nil];
[alertV show];
}];
} #pragma mark - UIImagePickerControllerDelegate
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info {
[self dismissViewControllerAnimated:YES completion:nil]; UIImage *imgChoice = [info objectForKey:UIImagePickerControllerOriginalImage];
_imgSource = [CIImage imageWithCGImage:imgChoice.CGImage];
_imgVCustom.image = imgChoice;
} - (void)imagePickerControllerDidCancel:(UIImagePickerController *)picker {
[self dismissViewControllerAnimated:YES completion:nil];
} @end
Main.storyboard
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="7702" systemVersion="14D136" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" initialViewController="vXZ-lx-hvc">
<dependencies>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="7701"/>
</dependencies>
<scenes>
<!--View Controller-->
<scene sceneID="ufC-wZ-h7g">
<objects>
<viewController id="vXZ-lx-hvc" customClass="ViewController" sceneMemberID="viewController">
<layoutGuides>
<viewControllerLayoutGuide type="top" id="jyV-Pf-zRb"/>
<viewControllerLayoutGuide type="bottom" id="2fi-mo-0CV"/>
</layoutGuides>
<view key="view" contentMode="scaleToFill" id="kh9-bI-dsS">
<rect key="frame" x="0.0" y="0.0" width="600" height="600"/>
<autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
<subviews>
<imageView userInteractionEnabled="NO" contentMode="scaleToFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="Big-Buck-Bunny-Clip.png" translatesAutoresizingMaskIntoConstraints="NO" id="ReO-qZ-fAW">
<rect key="frame" x="140" y="40" width="320" height="320"/>
<constraints>
<constraint firstAttribute="width" constant="320" id="C2r-Kz-KPF"/>
<constraint firstAttribute="height" constant="320" id="dkB-gF-zbC"/>
</constraints>
</imageView>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="老旧" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="OWZ-rg-m0K">
<rect key="frame" x="160" y="386" width="34" height="21"/>
<fontDescription key="fontDescription" type="system" pointSize="17"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="色彩" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="k3P-wv-puF">
<rect key="frame" x="160" y="432" width="34" height="21"/>
<fontDescription key="fontDescription" type="system" pointSize="17"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="旋转" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="uSa-M2-dak">
<rect key="frame" x="160" y="477" width="34" height="21"/>
<fontDescription key="fontDescription" type="system" pointSize="17"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
<slider opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" minValue="0.0" maxValue="1" translatesAutoresizingMaskIntoConstraints="NO" id="za9-U7-UTZ">
<rect key="frame" x="222" y="382" width="200" height="31"/>
<constraints>
<constraint firstAttribute="width" constant="196" id="5L7-au-P38"/>
<constraint firstAttribute="height" constant="30" id="LTM-RW-tBZ"/>
</constraints>
<connections>
<action selector="changeSepiaTone:" destination="vXZ-lx-hvc" eventType="valueChanged" id="s3f-rF-RWp"/>
</connections>
</slider>
<slider opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" minValue="-3.1400000000000001" maxValue="3.1400000000000001" translatesAutoresizingMaskIntoConstraints="NO" id="D5r-XT-NhQ">
<rect key="frame" x="222" y="428" width="200" height="31"/>
<constraints>
<constraint firstAttribute="width" constant="196" id="E9q-ag-z5a"/>
<constraint firstAttribute="height" constant="30" id="rfR-PP-ZFJ"/>
</constraints>
<connections>
<action selector="changeHueAdjust:" destination="vXZ-lx-hvc" eventType="valueChanged" id="8mV-I5-bQo"/>
</connections>
</slider>
<slider opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" minValue="-3.1400000000000001" maxValue="3.1400000000000001" translatesAutoresizingMaskIntoConstraints="NO" id="SJf-EV-oYp">
<rect key="frame" x="222" y="473" width="200" height="31"/>
<constraints>
<constraint firstAttribute="height" constant="30" id="MDv-9v-eTp"/>
<constraint firstAttribute="width" constant="196" id="QPl-IW-Cr1"/>
</constraints>
<connections>
<action selector="changeStraightenFilter:" destination="vXZ-lx-hvc" eventType="valueChanged" id="SQH-LR-ujT"/>
</connections>
</slider>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="0Te-5X-NMj">
<rect key="frame" x="162" y="522" width="30" height="30"/>
<state key="normal" title="重置">
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="resetImage:" destination="vXZ-lx-hvc" eventType="touchUpInside" id="LA0-CK-Cax"/>
</connections>
</button>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="6cL-cO-scq">
<rect key="frame" x="408" y="522" width="30" height="30"/>
<state key="normal" title="保存">
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="saveImage:" destination="vXZ-lx-hvc" eventType="touchUpInside" id="CeK-jp-JjI"/>
</connections>
</button>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="RJd-TD-yLu">
<rect key="frame" x="285" y="522" width="30" height="30"/>
<state key="normal" title="照片">
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="chooseImage:" destination="vXZ-lx-hvc" eventType="touchUpInside" id="ZaP-zL-bjr"/>
</connections>
</button>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
<constraints>
<constraint firstItem="RJd-TD-yLu" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="111" id="1Xc-pv-nf5"/>
<constraint firstItem="ReO-qZ-fAW" firstAttribute="trailing" secondItem="6cL-cO-scq" secondAttribute="trailing" constant="22" id="2eD-1z-x0R"/>
<constraint firstItem="za9-U7-UTZ" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="84" id="3NB-Bx-Q6O"/>
<constraint firstItem="SJf-EV-oYp" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="84" id="83Z-cU-kxw"/>
<constraint firstItem="RJd-TD-yLu" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="162" id="9gi-rx-JP8"/>
<constraint firstItem="za9-U7-UTZ" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="22" id="Cvd-N5-JI2"/>
<constraint firstItem="RJd-TD-yLu" firstAttribute="centerX" secondItem="ReO-qZ-fAW" secondAttribute="centerX" id="D1Y-sj-sEJ"/>
<constraint firstItem="uSa-M2-dak" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="117" id="E87-nx-szc"/>
<constraint firstItem="ReO-qZ-fAW" firstAttribute="leading" secondItem="D5r-XT-NhQ" secondAttribute="leading" constant="-84" id="X5f-S0-s32"/>
<constraint firstItem="ReO-qZ-fAW" firstAttribute="leading" secondItem="6cL-cO-scq" secondAttribute="leading" constant="-202" id="YDf-6o-ael"/>
<constraint firstItem="k3P-wv-puF" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="72" id="aR4-nO-nDR"/>
<constraint firstItem="SJf-EV-oYp" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="113" id="b4C-YG-pCD"/>
<constraint firstItem="ReO-qZ-fAW" firstAttribute="top" secondItem="jyV-Pf-zRb" secondAttribute="bottom" constant="20" id="bDR-wl-gln"/>
<constraint firstItem="OWZ-rg-m0K" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="20" id="eSk-OG-mwG"/>
<constraint firstItem="6cL-cO-scq" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="162" id="fDO-my-Y2B"/>
<constraint firstItem="0Te-5X-NMj" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="22" id="gnL-Tl-Gct"/>
<constraint firstItem="k3P-wv-puF" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="20" id="iLD-r8-ys0"/>
<constraint firstItem="OWZ-rg-m0K" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="26" id="l0h-GI-Jl5"/>
<constraint firstItem="uSa-M2-dak" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="20" id="loZ-MY-9xZ"/>
<constraint firstItem="D5r-XT-NhQ" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="68" id="ltH-7b-Knn"/>
<constraint firstItem="RJd-TD-yLu" firstAttribute="leading" secondItem="ReO-qZ-fAW" secondAttribute="leading" constant="111" id="nPl-Q1-9VA"/>
<constraint firstItem="0Te-5X-NMj" firstAttribute="top" secondItem="ReO-qZ-fAW" secondAttribute="bottom" constant="162" id="s8u-rt-ZdR"/>
<constraint firstItem="ReO-qZ-fAW" firstAttribute="centerX" secondItem="kh9-bI-dsS" secondAttribute="centerX" id="t69-2F-C2v"/>
</constraints>
<variation key="default">
<mask key="constraints">
<exclude reference="YDf-6o-ael"/>
<exclude reference="1Xc-pv-nf5"/>
<exclude reference="nPl-Q1-9VA"/>
</mask>
</variation>
</view>
<connections>
<outlet property="imgVCustom" destination="ReO-qZ-fAW" id="24S-lL-ecd"/>
<outlet property="sldHueAdjust" destination="D5r-XT-NhQ" id="AcU-Md-asg"/>
<outlet property="sldSepiaTone" destination="za9-U7-UTZ" id="IJb-Zv-KEu"/>
<outlet property="sldStraightenFilter" destination="SJf-EV-oYp" id="fvE-8k-f0f"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="x5A-6p-PRh" sceneMemberID="firstResponder"/>
</objects>
</scene>
</scenes>
<resources>
<image name="Big-Buck-Bunny-Clip.png" width="320" height="230"/>
</resources>
</document>
