【Android 美颜相机】第三天：初识GPUImageView

GPUImageView

在移动端图片/视频滤镜处理场景中，GPU加速因其高效的并行计算能力，成为替代CPU处理的最优选择。

jp.co.cyberagent.android.gpuimage.GPUImageView（以下简称GPUImageView）是android-gpuimage库的核心可视化控件，基于OpenGL ES 2.0实现GPU加速的图片滤镜渲染，源自iOS端经典的GPUImage框架，旨在为Android开发者提供易用、高性能的滤镜处理能力。

核心定位与优势

GPUImageView是Android平台下专为滤镜渲染设计的自定义ViewGroup（继承自FrameLayout），核心目标是将GPUImage的滤镜能力封装为可直接嵌入布局的控件，解决传统CPU处理滤镜时"卡顿、高功耗、大图片处理慢"的问题。其核心优势如下：

1. 极致的性能表现

基于OpenGL ES 2.0实现全GPU加速，所有滤镜计算均在显卡中完成，相比CPU处理，渲染效率提升数倍，即使是实时相机预览加滤镜，也能保持流畅的帧率。

2. 灵活的渲染载体

支持两种渲染载体配置（通过XML属性gpuimage_surface_type）：

surface_view：传统的GLSurfaceView，渲染效率高，但不支持视图层级叠加、动画等；
texture_view：TextureView，兼容视图层级（可叠加、旋转、透明度调整），适配更多UI场景。

3. 丰富的功能特性

支持多源图片加载：Uri、Bitmap、File三种方式加载待处理图片；
实时相机预览滤镜：可对接相机预览流，实现实时滤镜效果；
灵活的渲染控制：支持"按需渲染（RENDERMODE_WHEN_DIRTY）"和"持续渲染（RENDERMODE_CONTINUOUSLY）"两种模式；
异步图片保存：滤镜处理后的图片保存为异步操作，不阻塞主线程；
可配置的视觉参数：支持缩放类型（CENTER_CROP/CENTER_INSIDE）、图片旋转、背景色调整等；
丰富的滤镜生态：兼容iOS GPUImage2的大部分滤镜，同时支持自定义滤镜扩展。

4. 低版本兼容

最低支持Android 2.2（API 8），仅要求设备支持OpenGL ES 2.0，覆盖绝大多数Android设备。

快速集成GPUImageView

1. Gradle依赖配置

首先在项目的build.gradle中引入依赖（需确保Maven Central仓库已配置）：

groovy 复制代码

repositories {
    mavenCentral()
}

dependencies {
    implementation 'jp.co.cyberagent.android:gpuimage:2.x.x' // 替换为最新版本
}

2. 权限配置（可选）

若涉及图片保存、相机预览，需在AndroidManifest.xml中添加权限：

xml 复制代码

<!-- 存储权限 -->
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<!-- 相机权限 -->
<uses-permission android:name="android.permission.CAMERA" />
<!-- OpenGL ES 2.0声明 -->
<uses-feature android:glEsVersion="0x00020000" android:required="true" />

基础使用

1. XML布局中声明控件

在布局文件中添加GPUImageView，可配置渲染载体、是否显示加载中状态：

xml 复制代码

<jp.co.cyberagent.android.gpuimage.GPUImageView
    android:id="@+id/gpuImageView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:gpuimage_show_loading="false" <!-- 是否显示加载进度条 -->
    app:gpuimage_surface_type="texture_view" /> <!-- 渲染载体：texture_view/surface_view -->

2. 代码中加载图片并设置滤镜

Kotlin实现

kotlin 复制代码

import android.net.Uri
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import jp.co.cyberagent.android.gpuimage.GPUImageView
import jp.co.cyberagent.android.gpuimage.filter.GPUImageSepiaFilter

class MainActivity : AppCompatActivity() {
    private lateinit var gpuImageView: GPUImageView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        
        // 初始化控件
        gpuImageView = findViewById(R.id.gpuImageView)
        
        // 加载图片（Uri示例，也可使用setImage(Bitmap) / setImage(File)）
        val imageUri: Uri = // 你的图片Uri（如相册选择、本地文件）
        // 注意：setImage在主线程加载，大图片建议放在子线程
        gpuImageView.setImage(imageUri)
        
        // 设置滤镜（棕褐色滤镜为例）
        gpuImageView.setFilter(GPUImageSepiaFilter())
        
        // 保存处理后的图片（异步操作）
        gpuImageView.saveToPictures("GPUImage", "filtered_image.jpg") {
            // 保存完成回调（可选）
            runOnUiThread {
                toast("图片保存成功")
            }
        }
    }
}

Java实现

java 复制代码

import android.net.Uri;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import jp.co.cyberagent.android.gpuimage.GPUImageView;
import jp.co.cyberagent.android.gpuimage.filter.GPUImageSepiaFilter;

public class MainActivity extends AppCompatActivity {
    private GPUImageView gpuImageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        gpuImageView = findViewById(R.id.gpuImageView);
        
        Uri imageUri = // 你的图片Uri
        gpuImageView.setImage(imageUri);
        
        // 设置棕褐色滤镜
        gpuImageView.setFilter(new GPUImageSepiaFilter());
        
        // 保存图片
        gpuImageView.saveToPictures("GPUImage", "filtered_image.jpg", null);
    }
}

3. 无预览模式使用

若仅需处理图片并保存，无需界面预览，可简化代码：

kotlin 复制代码

val gpuImage = GPUImage(this)
gpuImage.setFilter(GPUImageSepiaFilter())
gpuImage.setImage(imageUri)
gpuImage.saveToPictures("GPUImage", "filtered_image.jpg", null)

高级用法

1. 相机预览实时滤镜

GPUImageView支持对接相机预览流，实现实时滤镜效果（以Camera1/Camera2为例）：

kotlin 复制代码

// 核心代码片段（完整示例参考库中CameraActivity）
gpuImageView.setRenderMode(GPUImageView.RENDERMODE_CONTINUOUSLY) // 持续渲染
// 相机预览帧回调
cameraLoader.setOnPreviewFrameListener { data, width, height ->
    gpuImageView.updatePreviewFrame(data, width, height) // 传入YUV格式的预览帧
}
// 设置相机旋转角度适配
gpuImageView.setRotation(Rotation.ROTATION_90)

2. 自定义渲染模式

RENDERMODE_WHEN_DIRTY：仅在主动调用requestRender()时渲染（适合静态图片，节省性能）；
RENDERMODE_CONTINUOUSLY：持续渲染（适合相机预览、动态滤镜调整）。

kotlin 复制代码

// 设置为按需渲染
gpuImageView.setRenderMode(GPUImageView.RENDERMODE_WHEN_DIRTY)
// 主动触发渲染
gpuImageView.requestRender()

3. 滤镜参数动态调整

部分滤镜支持参数调整（如亮度、对比度、模糊度），可通过SeekBar等控件实时修改：

kotlin 复制代码

// 以滤镜调整器为例（参考库中FilterAdjuster）
val adjuster = FilterAdjuster(filter)
seekBar.setOnSeekBarChangeListener { _, progress, _ ->
    adjuster.adjust(progress) // 根据进度调整滤镜参数
    gpuImageView.requestRender() // 触发重新渲染
}

支持的滤镜类型

GPUImageView基于GPUImage框架，兼容iOS GPUImage2的大部分滤镜，核心分类如下：

1. 基础调色滤镜

饱和度（Saturation）、对比度（Contrast）、亮度（Brightness）；
色相（Hue）、白平衡（White Balance）、曝光（Exposure）；
伽马校正（Gamma）、色调曲线（Tone Curve）。

2. 风格化滤镜

棕褐色（Sepia）、素描（Sketch）、卡通（Toon）；
高斯模糊（Gaussian Blur）、双边模糊（Bilateral Blur）；
边缘检测（Sobel Edge Detection）、浮雕（Emboss）。

3. 混合模式滤镜

叠加（Overlay）、正片叠底（Multiply）、屏幕（Screen）；
差值（Difference）、颜色混合（Color Blend）、透明度（Opacity）。

4. 变形滤镜

漩涡扭曲（Swirl Distortion）、球面折射（Sphere Refraction）；
缩放模糊（Zoom Blur）、凸起变形（Bulge Distortion）。

注：库中已标注部分未兼容iOS的滤镜（如Unsharp Mask、Canny Edge Detection），可通过自定义Shader补充。

总结

GPUImageView作为android-gpuimage库的核心控件，将复杂的OpenGL ES滤镜渲染逻辑封装为易用的Android控件，既保留了GPU加速的高性能优势，又降低了开发者的使用成本。

无论是静态图片的滤镜处理、相机实时预览美颜，还是短视频的特效渲染，GPUImageView都能满足需求，是Android端实现滤镜功能的优质选择。