文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Android OpenGL开发实践 - 基于OpenGL ES 2.0的Android相机实时图片涂鸦实现思路

这篇文章将给大家讲解如何在Android系统上基于OpenGL ES 2.0来实现相机实时图片涂鸦效果，所涂内容跟随人脸出现、消失、移动、旋转及缩放，在这里，我们假设您： 已经搭建好一个相机框架，能够获得相机的预览图像...基础知识一：OpenGL的坐标系 为方便讲解，以下只讲解二维的情况，在OpenGL使用中，我们主要会涉及到以下三个坐标系： 屏幕坐标系 屏幕坐标系就是我们手机屏幕的坐标系，以像素为单位，左上角是坐标系原点...OpenGL在把点绘到屏幕上之前，点会依次经过顶点着色器和片元着色器的处理。...首先讨论坐标系的转换，引入画布之后，现在相关的坐标系又多了一个画布的坐标系，手指在屏幕上触摸之后，如何让图案最终在触摸的位置画出来呢？...假设画布的实际尺寸设置为600*600，画布中心点坐标是(300,300)，人脸鼻尖坐标是(360,320)先从简单的情况看起，假设画布贴上去之前，没有进行移动、旋转和缩放，那么将是： ?

7.3K130

这交互炸了，Android 仿自如APP裸眼 3D 效果 OpenGL 版

在手机左右上下旋转时，上层和底层的图片呈相反的方向进行移动，中层则不动，在视觉上给人一种 3D 的感觉： 也就是说效果是由以下三张图构成的： image.png image.png image.png...接下来，如何感应手机的旋转状态，并将三层图片进行对应的移动呢？...另一个重要的原因是，GPU 更适合图形、图像的处理，裸眼3D效果中有大量的缩放和位移操作，都可在 java 层通过一个 矩阵 对几何变换进行描述，通过 shader 小程序中交给 GPU 处理 ——因此...首先看一下顶点和片元着色器的 shader 代码，其定义了图像纹理是如何在GPU中处理渲染的： // 顶点着色器代码 // 顶点坐标 attribute vec4 av_Position; // 纹理坐标...但如果将图片直接进行位移操作，将会因为位移后图像的另一侧没有纹理数据，导致渲染结果有黑边现象，为了避免这个问题，我们需要将图像默认从中心点进行放大，保证图像移动的过程中，不会超出自身的边界。

1.5K20
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    OpenGL（五）-- OpenGL中矩阵的变换OpenGL（五）-- OpenGL中矩阵的变换

    可以想象在观察者和物体中间有一个画板，观察者最终看到的图像是在这个画板上的，这个画板的位置就是由投影矩阵来表示的。在这个画板上的图像才是可以用于显示的2d图像。...具体可以想象移动的是物体的每一个点，在旋转之后物体的每一个点都的方向向量都会旋转，之后平移就会按照方向向量来进行移动 先平移不会修改物体额方向向量，所以旋转就会得到不同的效果。...确立透视投影需要的参数： aspect(远/近裁切面的宽高比，它本身也是视口) , near(近裁切面位置) , far(远裁切面位置)，投影角度，视口位置 以上图片都出自：_superhuihui-OpenGL...如果想要了解具体矩阵是如何计算的:3D数学 矩阵知识 矩阵栈 在计算时会发现这种计算会导致物体唯一无法重置，为了解决这种问题OpenGL提出了矩阵栈的概念。栈这个概念应该是很熟悉了吧！...使用矩阵6之后，将最上方矩阵出栈(POP操作) 仿射变换API ? 后序 将开始提出的2个问题做一个简单回答: 物体在3维空间位移，除了物体本身移动，还可以移动观察者。

    2.3K11

    第二章：图形绘制TextureSpriteBatch 类（相当于画笔）为什么要2的N次方？TextureRegion 可用于图片截取。Sprite类清屏

    libGDX使用OpenGL ES ，分为两个版本 OpenGL ES 1.x 和 OpenGL ES 2.0，1.x 的图片大小必须是2的整次数幂，而 2.0 无此要求。...libgdx 早期使用OpenGL ES 1.x , 用高版本libgdx就不用管图片分辨率问题了。...截取512*512 ---- Sprite类 1.定义：持有几何形状，颜色，和纹理信息使用加载绘制2D精灵 2.用途：TextureRegion的加强版，SpriteBatch的加强版，比TextureRegion...多了一些功能：指定位置，颜色，旋转，等…… 3.特点：可以处理Texture，TextureRegion等纹理 方法： 1.大小：sprite.setSize(120,120) 2.旋转中心：sprite.setOrigin...中，是将纹理贴上去，但是如果绘制动画，或者绘制领蛙图形，就会残留上一张的痕迹，所以需要清屏，展示新的图像。

    97920

    【OpenGL ES】 Android OpenGL ES -- 透视投影 和 正交投影

    有了位置 和 朝向, 此时摄像机可以 360 度旋转, 这是我们需要一个 up 方向, 将摄像机固定在一个位置一个方向; 设置摄像机的方法 :  void android.opengl.Matrix.setLookAtM...源码结构详解 源码组成 :  -- MatrixState : 矩阵相关的辅助类; -- OrthogonalProjectionActivity : 显示具体 OpenGL 图像的 Activity;...-- ProjectionGLSurfaceView : 自定义的 GLSurfaceView, 该 View 可以显示 OpenGL 图像内容; -- ShaderUtil : 着色器工具类; --... SixPointedStar : 具体的图形类, 如何生成该图形; 2....drawSelf() { // 制定使用某套shader程序 GLES20.glUseProgram(mProgram); // 初始化变换矩阵, 第二参数是矩阵起始位, 第三参数 旋转的角度

    2.7K30

    OpenGL坐标系及坐标转换

    世界坐标系以屏幕中心为原点(0, 0, 0)，在OpenGL中用来描述场景的坐标。比如使用这个坐标系来描述物体及光源的位置。世界坐标系，是不会被改变的。...局部坐标系：OpenGL还定义了局部坐标系的概念，所谓局部坐标系，也就是坐标系以物体的中心为坐标原点，物体的旋转或平移等操作都是围绕局部坐标系进行的，这 时，当物体模型进行旋转或平移等操作时，局部坐标系也执行相应的旋转或平移操作...2、将三维物体放在场景中的适当位置，它相当于OpenGL中的模型变换（Modeling Transformation），即对模型进行旋转、平移和缩放。...这样，在OpenGL中，以逆时针旋转物体就相当于以顺时针旋转相机。因此，我们必须把视点转换和模型转换结合在一起考虑，而对这两种转换单独进行 考虑是毫无意义的。...eyex,eyey,eyez定义了视点的位置；centerx、centery和centerz变量指定了参考点的位置，该点通常为相机所瞄准的场景中心轴线上的点；upx、upy、upz变量指定了向上向量的方向

    4.3K71

    实验6 OpenGL模型视图变换

    3．实验原理：   首先来简单了解计算机图形学中四个主要变换概念：   (1)视图变换：也称观察变换，指从不同的位置去观察模型；   (2)模型变换：设置模型的位置和方向，通过移动、旋转或缩放变换，...(4)视口变换：将投影变换得到的投影图映射到屏幕的视区上，确定最终图像在屏幕上所占的区域。 上述变换在OpenGL中实际上是通过矩阵乘法来实现。...无论是移动、旋转还是缩放大小，都是通过在当前矩阵的基础上乘以一个新的矩阵来达到目的。OpenGL可以在最底层直接操作变换矩阵。...同时，OpenGL也把这一切变换封装成一系列函数调用来实现不同的变换，以便于使用。   ...下面是这些变换函数使用时需要注意内容：   (1)在OpenGL程序中，视图变换必须出现在模型变换之前，但可以在绘图之前的任何时候执行投影变换和视口变换。

    2.1K30

    OpenGL ES实践教程（六）全景视频获取焦点

    ES实践教程4-Demo04-VR全景视频播放 OpenGL ES实践教程5-Demo05-多重纹理实现图像混合 其他教程请移步OpenGL ES文集。...前言 有开发者在群里问如何实现： 观看VR视频的时候，眼神停在菜单上，稍后会触发事件，比如暂停，重放功能 说说可能的方案： 1、添加外设：采集眼球运动和眨眼操作，并通过无线通讯传给手机； 2、离屏渲染...，需要不断重绘）；最后，glReadPixel是同步操作，对性能有较大的影响； 方案3是较为合理的实现方案，仅需要CPU进行少量的浮点变化运算，不需要外设和离屏渲染； 本文在OpenGL ES实践教程...核心思路 通过计算全景球面上的点经过旋转投影后的位置，来确定当前焦点是否停留在按钮上。...当摄像机旋转的时候，再求出对应的交点即可。 实现2：假设点P是按钮的中心，对点P进行旋转、投影等变换后，求出点P在屏幕上的位置，如果点P在焦点范围内，则认为聚焦； demo采用的是实现2。

    1.5K50

    Android 如何实现气泡选择动画

    此外，本文后面我会解释我为什么选择 Kotlin 语言开发，以及这样做的好处。需要了解 Java 和 Kotlin 更多不同之处可以阅读我之前的文章。 如何创建着色器？...如果项目使用的是 Java，那么最方便的方式是在另一个文件编写你的着色器，然后使用输入流读取。如上述示例代码所示，Kotlin 可以简单地在类中创建着色器。...a_UV 变量有两个用途： 确定当前片段和正方形中心位置的距离。根据这个距离，我可以调整片段的颜色而实现画圆。 正确地将 texture（照片和国家的名字）置于图形的中心位置。...中如何使用 texture 显示图像和文本？...在动画中圆有两种状态 —— 普通和选中。在普通状态下圆的 texture包含文字和颜色，在选中状态下同时包含图像。因此我需要为每个圆创建两个不同的 texture。

    2.7K20

    激光三角测量（sheet of light）halcon示例详解 Reconstruct_Connection_Rod_Calib.hdev 模型三维重建

    模型可以通过鼠标随意移动，就跟我上篇博客 opengl导入3d模型并且显示一样OpenGl读取导入3D模型并且添加鼠标移动旋转显示  2.激光三角测量 激光三角测距法作为低成本的激光雷达设计方案，可获得高精度...激光雷达四大核心组件 激光雷达主要由激光器、接收器、信号处理单元和旋转机构这四大核心组件构成。 激光器：激光器是激光雷达中的激光发射机构。在工作过程中，它会以脉冲的方式点亮。...由图2可知入射光AO与基线AB的夹角为α，AB为激光器中心与CCD中心的距离，BF为透镜的焦距f，D为被测物体距离基线无穷远处时反射光线在光敏单元上成像的极限位置。...DE为光斑在光敏单元上偏离极限位置的位移，记为x。当系统的光路确定后，α、AB与f均为已知参数。由光路图中的几何关系可知△ABO∽△DEB，则有边长关系： ? 则易知 ?...在研究双目深度图估计时，经常会使用D=B×f/d（D：Depth,B:Baseline,f:focal,d:disparity）这个公式，从视差推理出深度，那么这里的d到底怎么理解？

    3.1K10

    附加实验2　OpenGL变换综合练习

    要求绘制小桌各部件时只能使用函数glutSolidCube()和变换函数，不能使用函数glVertex()等直接指定顶点位置； （2）添加键盘按键或右键菜单控制实现小桌效果图在正投影和透视投影模式间的切换...OpenGL还定义了局部坐标系的概念，所谓局部坐标系，也就是坐标系以物体的中心为坐标原点，物体的旋转或平移等操作都是围绕局部坐标系进行的，这时，当物体模型进行旋转或平移等操作时，局部坐标系也执行相应的旋转或平移操作...2、将三维物体放在场景中的适当位置，它相当于OpenGL中的模型变换（Modeling Transformation），即对模型进行旋转、平移和缩放。...这样，在OpenGL中，以逆时针旋转物体就相当于以顺时针旋转相机。因此，我们必须把视点转换和模型转换结合在一起考虑，而对这两种转换单独进行考虑是毫无意义的。...eyex,eyey,eyez定义了视点的位置；centerx、centery和centerz变量指定了参考点的位置，该点通常为相机所瞄准的场景中心轴线上的点；upx、upy、upz变量指定了向上向量的方向

    1.4K30

    iOS开发-OpenGL ES入门教程3

    投影中心，也叫投影参考点，相当于人的视点，投影线相当于人的视线。 ? 平行投影 投影中心和投影平面的距离为无穷大的投影。 正平行投影 投影方向垂直于投影平面时称为正平行投影。...透视投影 投影中心和投影平面的距离是有限的。...透视投影的推导可以看 这里 OpenGL ES的变换 OpenGL ES通过顶点缓存数组和图元绘制指令，形成基本的图元；图元在顶点着色器会进行顶点变换，也就是几何处理阶段的几何变换和投影变换；到了像素处理阶段...，物体不在视锥体内的部分不可见，OpenGL ES是如何判断一个点是否在视锥体内？...要如何交换？ 总结 教程2、3是shader的一个分支，内容相对较难，接下的教程主要以GLKit为主。 附上源码地址 代码里面的util在 这里

    1.9K50

    【Java AWT 图形界面编程】使用鼠标滚轮缩放 Canvas 画布中绘制的背景图像 ( 绘制超大图像 + 鼠标拖动 + 鼠标滚轮缩放 + 以当前鼠标指针位置为缩放中心 示例 )

    ; 使用鼠标滚轮缩放后 , 在 Canvas 中绘制的图片的尺寸肯定是放大或者缩小了 , 尺寸发生了改变 ; 图片缩放时 , 鼠标指针指向一个位置 , 该位置对应着一个当前 Canvas 画布中的 x..., y 坐标 , 同时可以计算出当前位置对应的图片中的 水平方向的比例 和 垂直方向的比例 ; 在缩放后的图片中 , 只要保证鼠标指针指向相同的 x, y 坐标时 , 该位置对应的 水平方向的比例 和..., 并设置图片位置 ; 这样图片缩放时 , 始终可以保证鼠标指向的部位保持位置不变 ; 1、保存当前鼠标指针指向的位置 首先 , 在类中定义如下成员字段 , pointer_x 和 pointer_y...在鼠标滚轮缩放完成后 , 再根据鼠标指针指向的位置和比例 , 结合图片缩放后的尺寸 , 重新计算画布偏移的位置 , 以达到鼠标指向的图片元素位置基本保持不变的目的 ; /** * 计算新的比例...H 标识放置在界面中心 ; 将鼠标指针放在 H 位置 , 缩放 , 发现此时缩放 , 就是以当前鼠标指针为中心进行的缩放 ;

    2.8K10

    OpenGL ES初探：渲染流程及GLKit简介

    OpenGL ES 是OpenGL的简化版本，是以手持和移动设备为目标的高级3D图形图像API，可以直接操作GPU硬件。...1.2.2 着色器业务 着色器本质上是一段程序代码: 在OpenGL/OpenGL ES中，开发者所能直接编程的着色器只有顶点着色器和片元着色器，其它着色器不能由开发者直接编程，因此这里只介绍顶点着色器和片元着色器业务...1、 顶点着色器输入数据是顶点数组提供的每个顶点的数据，主要包括以下业务： 矩阵位置变换，比如旋转、平移和缩放 计算光照公式生成顶点颜色，比如设置点光源或者默认光源 生成/变换纹理坐标 2、片元着色器的输入数据来自光栅化后的顶点着色器输出...裁剪测试：确定一个像素（x, y）是否在矩形区域内，如果不在则被丢弃，不予显示 深度测试：对深度值进行比较，确定显示层级 混合：将新生成的片段颜色和保存在帧缓冲区的位置的颜色组合起来，例如两个view有重叠...GLKit提供的功能： 加载纹理 提供高性能的数学运算 提供常见的着色器 提供视图及视图控制器，即GLKView和GLKViewController GLKit提供的类及接口： GLKView：使用

    1.7K40

    使用计算机视觉实战项目精通 OpenCV：1~5

    从本章中，您还学习了如何执行初始图像处理（以灰色阴影和二值化进行平移），如何在图像中找到闭合的轮廓并使用多边形对其进行近似，如何在图像中找到标记并对其进行解码，如何计算标记在空间中的位置，以及增强现实中...为了使语言更清晰，从现在开始，我们将摄像机称为场景的单一视图，而不是指用于拍摄图像的光学和硬件。 照相机具有在空间中的位置和观察方向。 在两个摄像头之间，有一个平移元素（在空间中移动）和方向的旋转。...所有印版具有相同的背景色，我们可以使用泛洪填充算法来检索旋转的矩形以进行精确裁剪。 修剪车牌的第一步是在最后一个旋转的矩形中心附近获取几粒种子。..., rotmat, input.size(), CV_INTER_CUBIC); 旋转图像后，我们使用getRectSubPix裁剪图像，裁剪并复制以点为中心的给定宽度和高度的图像部分。...在第一步中，我们学习了如何分割图像以寻找可以放置印版的补丁，以及如何使用简单的试探法和支持向量机算法对没有印版的印版进行二分类。

    2.3K10

    iOS 手机运动CoreMotion

    这篇文章本该放到OpenGLES的专题，OpenGL里最复杂最丰富多变的摄像机矩阵会用到欧拉角的概念。...w分量，opengl里常常3维坐标点x、y、z在做到一些计算的时候，需要引进四元数的概念，引用w分量来准确模拟和定位坐标点在屏幕上的位置。...旋转.gif 网上叫法不同，可能给大家的理解也不一样，其实就是机头指向前方，机身旋转。可以理解为飞机机翼与水平面的旋转角。 2.偏航角 Yaw ?...偏航.gif 这个很好理解，就是飞机偏离航线的角度。 3.俯仰角 Pitch ? 俯仰.gif 俯仰角也好理解，机头机尾上下摆动。...理解这3个角度，我们可以去想像手机在空间中的位置，在空间中所处的各个方向角度，再转到手机上可视化的物体、图形，可以计算和知道物体、图形在手机屏幕上所处的位置和自身的形变。

    1.5K30

    SLAM初探（二）

    因此，在图像拼接或者三维重建中，就需要使用外参来求几幅图像之间的相对运动，从而将其注册到同一个坐标系下面来 内参：下面给出了内参矩阵，需要注意的是，真实的镜头还会有径向和切向畸变，而这些畸变是属于相机的内参的...旋转矩阵和平移矩阵共同描述了如何把点从世界坐标系转换到摄像机坐标系 旋转矩阵：描述了世界坐标系的坐标轴相对于摄像机坐标轴的方向 平移矩阵：描述了在摄像机坐标系下，空间原点的位置 标定中的世界坐标系 由于摄像机可安放在环境中的任意位置...在x-y坐标系中，原点定义在摄像机光轴和图像平面的交点处，称为图像的主点(principal point)，该点一般位于图像中心处，但由于摄像机制作的原因，可能会有些偏离，在坐标系下的坐标为(u0,v0...在OpenCV中我们使用张正友相机标定法通过10幅不同角度的棋盘图像来标定相机获得相机内参和畸变系数。...否则的话，将初始化(u0,v0）图像的中心点，使用最小二乘估算出fx，fy。 CV_CALIB_FIX_PRINCIPAL_POINT：在进行优化时会固定光轴点。

    2K50

    FFmpeg + OpenGLES 实现视频解码播放和视频滤镜

    但是，当你想为播放器做一些视频滤镜时，如加水印、旋转缩放等效果，使用 OpenGL ES 实现起来就极为方便。 ?...视频的解码流程 从流程图中可以看出，解码一帧图像后，首先将对图像进行格式转换，转换成 RGBA 格式，使用 OpenGL 或 ANativeWindow 可以直接进行渲染。...当然，使用 OpenGL 进行渲染时，为了提升性能，可以将格式转换放到 GPU 上来做（即 shader 实现 YUV 到 RGB 的转换），也可以使用 OES 纹理直接接收 YUV 图像数据，这里就不进行展开讲了...从之前介绍 EGL 的文章中，我们知道在使用 OpenGL API 之前，必须要先利用 EGL 创建好 OpenGL 的渲染上下文环境。...动态网格滤镜 缩放和旋转 我们在 GLSurfaceView 监听用户的滑动和缩放手势，控制 OpenGLRender 的变换矩阵，从而实现视频图像的旋转和缩放。 ? 视频图像的旋转和缩放

    3K10

    OpenGL ES实践教程（三）镜子效果

    正方体相当于先旋转、再平移(0.0f, 0.0f, -4.0f)，出现在eye在（0，0，0）望向（0，0，-1）的平截体中； 镜子相当于在原坐标，出现在 eye在(0.0, 3.0, 2.0)的位置望向...授人以鱼不如授人以渔，这次不说遇到的问题，来看看如何调试OpenGL ES。 1、连上iPhone，在真机上运行demo；（注意，模拟器无效） 2、点击这里 ?...3、出现OpenGL ES的调试画面 ? 思考：如何使用？ 这里是个人的使用方式，不一定正确，有疑问可以看苹果的教程。...总结 学习OpenGL ES不亚于重新学习一门语言，目前介绍的大都是语法相关，附带简单的空间几何知识。 待得基础扎实，再学习图像相关的算法。...代码地址 在学习图像算法之前，推广下我另外一个文集——算法练习。 绘制镜子用的三角形带 —— OPENGL_三角形带GL_TRIANGLE_STRIP详解

    1.6K40
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券