iOS-Bildfilter hinzufügen und detaillierte Einführung in die dynamische Rendering von Bildern mit openGLES und Beispielen

iOS, um ein Bild mit einem Filter hinzuzufügen und das Bild dynamisch mit openGLES zu rendern

Es gibt zwei Arten, ein Bild mit einem Filter hinzuzufügen: CoreImage / openGLES

　Erklärung, wie CoreImage verwendet wird, um ein Bild mit einem Filter hinzuzufügen, hauptsächlich folgende Schritte:

#1.Importieren Sie das ursprüngliche Bild im CIImage-Format

#2.Erstellen Sie den CIFilter-Filter

#3.Rendern Sie das Bild im CIFilter mit CIContext

#4.Exportieren Sie das renderierte Bild

Referenzcode:

//Importieren Sie CIImage
  CIImage *ciImage = [[CIImage alloc] initWithImage:[UIImage imageNamed:@"hua"]];
  //Erstellen Sie den Filter-Filter
  CIFilter *filter = [CIFilter filterWithName:@"CIPixellate"];
  [filter setValue:ciImage forKey:kCIInputImageKey];
  [filter setDefaults];
  CIImage *outImage = [filter valueForKey:kCIOutputImageKey];
  //Rendern Sie das Bild im Filter mit CIContext
  CIContext *context = [CIContext contextWithOptions:nil];
  CGImageRef cgImage = [context createCGImage:outImage
                    fromRect:[outImage extent]];
  //Exportieren Sie das Bild
  UIImage *showImage = [UIImage imageWithCGImage:cgImage];
  CGImageRelease(cgImage);
  UIImageView *imageView = [[UIImageView alloc] initWithImage:showImage];
  imageView.center    = self.view.center;
  [self.view addSubview:imageView];

Wenn mehrere Filter festgelegt werden sollen, müssen außer einem neu erstellten CIFilter auch kCIInputAngleKey extra festgelegt werden. Der Code ist wie folgt:

//Importieren Sie CIImage
  CIImage *ciImage = [[CIImage alloc] initWithImage:[UIImage imageNamed:@"hua.jpeg"]];
  //Erstellen Sie den Filter-Filter
  CIFilter *filter = [CIFilter filterWithName:@"CIPixellate"];
  [filter setValue:ciImage forKey:kCIInputImageKey];
  [filter setDefaults];
  CIImage *outImage = [filter valueForKey:kCIOutputImageKey];
  CIFilter *filterTwo = [CIFilter filterWithName:@"CIHueAdjust"];
  [filterTwo setValue:outImage forKey:kCIInputImageKey];
  [filterTwo setDefaults];
  [filterTwo setValue:@(1.0f) forKey:kCIInputAngleKey]; //Wenn diese Zeile nicht hinzugefügt wird, wird der neue Filter nicht funktionieren.
  CIImage *outputImage = [filterTwo valueForKey:kCIOutputImageKey];
  //Rendern Sie das Bild im Filter mit CIContext
  CIContext *context = [CIContext contextWithOptions:nil]; 
  CGImageRef cgImage = [context createCGImage:outputImage
                    fromRect:[outputImage extent]];
  //Exportieren Sie das Bild
  UIImage *showImage = [UIImage imageWithCGImage:cgImage];
  CGImageRelease(cgImage);
  UIImageView *imageView = [[UIImageView alloc] initWithImage:showImage];
  imageView.center    = self.view.center;
  [self.view addSubview:imageView];

Lassen Sie uns sehen, wie man Bilder mit openGLES filtert und rendernt

Die Schritte zur Verwendung von openGlES sind im Allgemeinen wie folgt:

#1.Importieren Sie das Bild, das gerendert werden soll

#2.Erhalten Sie den Kontext der OpenGLES-Rendering

#3.Erstellen Sie den Renderbuffer von GLKView

#4.Erstellen Sie den Kontext von CoreImage

#5.Führen Sie die entsprechenden Einstellungen von CoreImage durch

#6.Beginnen Sie mit dem Rendern und Anzeigen des Bildes

Beispielcode wie folgt:

//Importieren Sie das Bild, das gerendert werden soll
  UIImage *showImage = [UIImage imageNamed:@"hua.jpeg"];
  CGRect rect    = CGRectMake(0, 0, showImage.size.width, showImage.size.height);
  //Erhalten Sie den Kontext der OpenGLES-Rendering
  EAGLContext *eagContext = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES2;
  //Erstellen Sie den Renderbuffer
  GLKView *glkView = [[GLKView alloc] initWithFrame:rect
                       context:eagContext];
  [glkView bindDrawable];
  [self.view addSubview:glkView];
  //Erstellen Sie den Kontext von CoreImage
  CIContext *ciContext = [CIContext contextWithEAGLContext:eagContext]}
                           options:@{kCIContextWorkingColorSpace: [NSNull null]}];
  //CoreImage相关设置
  CIImage *ciImage = [[CIImage alloc] initWithImage:showImage];
  CIFilter *filter = [CIFilter filterWithName:@"CISepiaTone"];
  [filter setValue:ciImage forKey:kCIInputImageKey];
  [filter setValue:@(0) forKey:kCIInputIntensityKey];
  //开始渲染
  [ciContext drawImage:[filter valueForKey:kCIOutputImageKey]
         inRect:CGRectMake(0, 0, glkView.drawableWidth, glkView.drawableHeight)
        fromRect:[ciImage extent]];
  [glkView display];

如果要动态渲染，可以通过UISilder动态调整一下代码的vaule值

[filter setValue:vaule forKey:kCIInputIntensityKey];

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！