doc/tutorials/ios/image_manipulation/image_manipulation.markdown

   1 OpenCV iOS - Image Processing {#tutorial_image_manipulation}
   2 =============================
   3
   4 Goal
   5 ----
   6
   7 In this tutorial we will learn how to do basic image processing using OpenCV in iOS.
   8
   9 Introduction
  10 ------------
  11
  12 In *OpenCV* all the image processing operations are usually carried out on the *Mat* structure. In
  13 iOS however, to render an image on screen it have to be an instance of the *UIImage* class. To
  14 convert an *OpenCV Mat* to an *UIImage* we use the *Core Graphics* framework available in iOS. Below
  15 is the code needed to covert back and forth between Mat's and UIImage's.
  16 @code{.m}
  17 - (cv::Mat)cvMatFromUIImage:(UIImage *)image
  18 {
  19   CGColorSpaceRef colorSpace = CGImageGetColorSpace(image.CGImage);
  20   CGFloat cols = image.size.width;
  21   CGFloat rows = image.size.height;
  22
  23   cv::Mat cvMat(rows, cols, CV_8UC4); // 8 bits per component, 4 channels (color channels + alpha)
  24
  25   CGContextRef contextRef = CGBitmapContextCreate(cvMat.data,                 // Pointer to  data
  26                                                  cols,                       // Width of bitmap
  27                                                  rows,                       // Height of bitmap
  28                                                  8,                          // Bits per component
  29                                                  cvMat.step[0],              // Bytes per row
  30                                                  colorSpace,                 // Colorspace
  31                                                  kCGImageAlphaNoneSkipLast |
  32                                                  kCGBitmapByteOrderDefault); // Bitmap info flags
  33
  34   CGContextDrawImage(contextRef, CGRectMake(0, 0, cols, rows), image.CGImage);
  35   CGContextRelease(contextRef);
  36
  37   return cvMat;
  38 }
  39 @endcode
  40 @code{.m}
  41 - (cv::Mat)cvMatGrayFromUIImage:(UIImage *)image
  42 {
  43   CGColorSpaceRef colorSpace = CGImageGetColorSpace(image.CGImage);
  44   CGFloat cols = image.size.width;
  45   CGFloat rows = image.size.height;
  46
  47   cv::Mat cvMat(rows, cols, CV_8UC1); // 8 bits per component, 1 channels
  48
  49   CGContextRef contextRef = CGBitmapContextCreate(cvMat.data,                 // Pointer to data
  50                                                  cols,                       // Width of bitmap
  51                                                  rows,                       // Height of bitmap
  52                                                  8,                          // Bits per component
  53                                                  cvMat.step[0],              // Bytes per row
  54                                                  colorSpace,                 // Colorspace
  55                                                  kCGImageAlphaNoneSkipLast |
  56                                                  kCGBitmapByteOrderDefault); // Bitmap info flags
  57
  58   CGContextDrawImage(contextRef, CGRectMake(0, 0, cols, rows), image.CGImage);
  59   CGContextRelease(contextRef);
  60
  61   return cvMat;
  62  }
  63 @endcode
  64 After the processing we need to convert it back to UIImage. The code below can handle both
  65 gray-scale and color image conversions (determined by the number of channels in the *if* statement).
  66 @code{.m}
  67 cv::Mat greyMat;
  68 cv::cvtColor(inputMat, greyMat, COLOR_BGR2GRAY);
  69 @endcode
  70 After the processing we need to convert it back to UIImage.
  71 @code{.m}
  72 -(UIImage *)UIImageFromCVMat:(cv::Mat)cvMat
  73 {
  74   NSData *data = [NSData dataWithBytes:cvMat.data length:cvMat.elemSize()*cvMat.total()];
  75   CGColorSpaceRef colorSpace;
  76
  77   if (cvMat.elemSize() == 1) {
  78       colorSpace = CGColorSpaceCreateDeviceGray();
  79   } else {
  80       colorSpace = CGColorSpaceCreateDeviceRGB();
  81   }
  82
  83   CGDataProviderRef provider = CGDataProviderCreateWithCFData((__bridge CFDataRef)data);
  84
  85   // Creating CGImage from cv::Mat
  86   CGImageRef imageRef = CGImageCreate(cvMat.cols,                                 //width
  87                                      cvMat.rows,                                 //height
  88                                      8,                                          //bits per component
  89                                      8 * cvMat.elemSize(),                       //bits per pixel
  90                                      cvMat.step[0],                            //bytesPerRow
  91                                      colorSpace,                                 //colorspace
  92                                      kCGImageAlphaNone|kCGBitmapByteOrderDefault,// bitmap info
  93                                      provider,                                   //CGDataProviderRef
  94                                      NULL,                                       //decode
  95                                      false,                                      //should interpolate
  96                                      kCGRenderingIntentDefault                   //intent
  97                                      );
  98
  99
 100   // Getting UIImage from CGImage
 101   UIImage *finalImage = [UIImage imageWithCGImage:imageRef];
 102   CGImageRelease(imageRef);
 103   CGDataProviderRelease(provider);
 104   CGColorSpaceRelease(colorSpace);
 105
 106   return finalImage;
 107  }
 108 @endcode
 109
 110 Output
 111 --------
 112
 113 ![](images/output.jpg)
 114
 115 Check out an instance of running code with more Image Effects on
 116 [YouTube](http://www.youtube.com/watch?v=Ko3K_xdhJ1I) .
 117
 118 @youtube{Ko3K_xdhJ1I}