圆角矩形shader
在游戏中,有时需要对一张矩形图片进行切割,绘制成圆角矩形。
circelrect.vert
attribute vec4 a_position;
attribute vec4 a_normal;
attribute vec4 a_color;
attribute vec2 a_texCoord0; uniform mat4 u_projTrans; varying vec4 v_color;
varying vec2 v_texCoords; void main() {
v_color = vec4(, , , );
v_texCoords = a_texCoord0;
gl_Position = u_projTrans * a_position;
}
circlerect.frag
#ifdef GL_ES
precision mediump float;
#endif varying vec2 v_texCoords;
uniform sampler2D u_texture; varying vec4 v_color; uniform float r; bool isOut(float x, float y, float cx, float cy, float r){
bool flag1 = (cx<0.5f && x<cx) || (cx>0.5f && x>cx);
bool flag2 = (cy<0.5f && y<cy) || (cy>0.5f && y>cy);
float dis = (x-cx)*(x-cx) + (y-cy)*(y-cy);
if(flag1 && flag2 && dis>r*r){
return true;
}
return false;
} void main() {
vec4 texColor = texture2D(u_texture, v_texCoords); float x = v_texCoords.x;
float y = v_texCoords.y; float rate = 1f; if(isOut(x, y, r, r, r)) rate = 0f;
if(isOut(x, y, r, -r, r)) rate = 0f;
if(isOut(x, y, -r, r, r)) rate = 0f;
if(isOut(x, y, -r, -r, r)) rate = 0f; gl_FragColor = vec4(texColor.rgb, rate*texColor.a);
}
gdx程序
package com.fxb.gdx.example; import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.InputAdapter;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.glutils.ShaderProgram; public class Test014_MaskShader extends ApplicationAdapter{ SpriteBatch batch;
Texture texture;
ShaderProgram shader; int[][] maskss;
int[] masks; public void create() {
super.create();
batch = new SpriteBatch();
texture = new Texture(Gdx.files.internal("data/pic.jpg")); // shader = new ShaderProgram( Gdx.files.internal("shader/mask.vert").readString(),
// Gdx.files.internal("shader/mask.frag").readString() ); shader = new ShaderProgram( Gdx.files.internal("shader/circlerect.vert").readString(),
Gdx.files.internal("shader/circlerect.frag").readString() ); batch.setShader(shader); maskss = new int[10][10];
for(int i=0; i<maskss.length; ++i){
for(int j=0; j<maskss[i].length; ++j){
maskss[i][j] = 0;
}
} maskss[1][2] = 1;
maskss[5][6] = 1; masks = new int[100];
setMask(1, 2);
setMask(5, 6); // shader.setUniformf("maskX", 0.2f);
// shader.setUniformf("maskY", 0.3f); Gdx.input.setInputProcessor(adapter);
} private void setMask(int xIndex, int yIndex){
maskss[xIndex][yIndex] = 1; masks[yIndex*10+xIndex] = 1;
} // float maskX = 0.3f, maskY = 0.4f;
// float[] maskXs = {0.3f, 0.9f};
// float[] maskYs = {0.4f, 0.9f}; float[] maskXs = new float[10];
float[] maskYs = new float[10]; float r = 0.05f;
float step = 0.01f;
float rate = 1f;
public void render() {
super.render();
// Gdx.gl.glClearColor(0.3f, 0.3f, 0.3f, 1f);
Gdx.gl.glClearColor(0f, 0f, 0f, 1f);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT); // uniform float maskX;
// uniform float maskY; batch.setShader(shader);
batch.begin();
// shader.setUniformf("maskX", maskX);
// shader.setUniformf("maskY", maskY); // shader.setUniform1fv("maskXs", maskXs, 0, 10);
// shader.setUniform1fv("maskYs", maskYs, 0, 10); shader.setUniformf("r", r);
batch.draw(texture, 100, 100);
batch.end(); r += step*rate;
if(r >=0.45f){
rate = -1f;
}
else if(r <= 0f){
rate = 1f;
}
} public void dispose() {
super.dispose(); // uniform float[] maskXs;
// uniform float[] maskYs;
//
// void main() {
// vec4 texColor = texture2D(u_texture, v_texCoords);
//
// float x = v_texCoords.x;
// float y = 1f - v_texCoords.y;
//
// float rate = 1f;
// for(GLint i=0; i<2; ++i){
// float maskX = maskXs[i];
// float maskY = maskYs[i];
// if(x>maskX-0.02f && x<maskX+0.02f && y>maskY-0.02f && y<maskY+0.02f){
// rate = 0f;
// }
// }
//
//
// gl_FragColor = vec4(texColor.rgb, texColor.a*rate);
// } } private InputAdapter adapter = new InputAdapter(){ public int changeY(int screenY){
return 480-screenY;
} public boolean touchDown(int screenX, int screenY, int pointer,int button) {
screenY = changeY(screenY); float curX = screenX-100, curY = screenY-100;
if(curX>0 && curX<texture.getWidth() && curY>0 && curY<texture.getHeight()){
// maskX = curX/texture.getWidth();
// maskY = curY/texture.getHeight(); // maskXs[0] = maskXs[1];
// maskYs[0] = maskYs[1]; for(int i=0; i<maskXs.length-1; ++i){
maskXs[i] = maskXs[i+1];
maskYs[i] = maskYs[i+1];
} maskXs[maskXs.length-1] = curX/texture.getWidth();
maskYs[maskYs.length-1] = curY/texture.getHeight(); } return super.touchDown(screenX, screenY, pointer, button);
} public boolean touchUp(int screenX, int screenY, int pointer, int button) {
return super.touchUp(screenX, screenY, pointer, button);
} public boolean touchDragged(int screenX, int screenY, int pointer) {
return super.touchDragged(screenX, screenY, pointer);
} };
}
运行结果:

圆角矩形shader的更多相关文章
- 解读Unity中的CG编写Shader系列四(unity中的圆角矩形shader)
转自 http://www.itnose.net/detail/6097625.html 上篇文章中我们掌握了表面剔除和剪裁模式 这篇文章将利用这些知识实现一个简单的,但是又很常用的例子:把一张图片做 ...
- 解读Unity中的CG编写Shader系列4——unity中的圆角矩形shader
上篇文章中我们掌握了表面剔除和剪裁模式 这篇文章将利用这些知识实现一个简单的,可是又非经常常使用的样例:把一张图片做成圆角矩形 例3:圆角矩形Shader 好吧我承认在做这个样例的时候走了不少弯路,因 ...
- [转]解读Unity中的CG编写Shader系列4——unity中的圆角矩形shader
上篇文章中我们掌握了表面剔除和剪裁模式这篇文章将利用这些知识实现一个简单的,但是又很常用的例子:把一张图片做成圆角矩形 例3:圆角矩形Shader好吧我承认在做这个例子的时候走了不少弯路,由于本人对矩 ...
- unity 切圆角矩形 --shader编程
先上个效果图 制作思路 如上图我们要渲染的就是上图带颜色的部分 步骤: 先获取黄色和蓝绿部分 例如以下图 算法 |U|<(0.5-r)或|V|<(0.5-r) 注意的是模型贴图最大值是1. ...
- [BOT] 一种android中实现“圆角矩形”的方法
内容简介 文章介绍ImageView(方法也可以应用到其它View)圆角矩形(包括圆形)的一种实现方式,四个角可以分别指定为圆角.思路是利用"Xfermode + Path"来进行 ...
- Android利用canvas画各种图形(点、直线、弧、圆、椭圆、文字、矩形、多边形、曲线、圆角矩形) .
1.首先说一下canvas类: Class Overview The Canvas class holds the "draw" calls. To draw something, ...
- SimpleRoundedImage-不使用mask实现圆角矩形图片
1.一张图片是如何显示在屏幕上的 一张图片渲染到unity界面中的大致流程. 2.我们要做什么 我们要做的就是在CPU中将图片的矩形顶点数据修改成圆角矩形的顶点信息,之后Unity会将修改后的顶点数据 ...
- 用贝赛尔曲线把图片, 按钮, label 绘成圆 或圆角矩形
//创建圆形遮罩,把用户头像变成圆形 /* *CGPointMake(35, 35) 是绘图的中心点, 如果想把控件居中绘圆, 一般用控件的中心点, radius 是圆半径 startAn ...
- RoundedImageView,实现圆形、圆角矩形的注意事项
RoundedImageView是gitHub上面的一个开源组件(https://github.com/vinc3m1/RoundedImageView),实现一些圆形或者圆角矩形是很方便的, < ...
随机推荐
- Android Studio 无法预览xml布局视图:failed to load AppCompat ActionBar with unkNown error
问题如下: 解决方法: 找到res-->values-->styles.xml 文件 可以看到主题Them设置如下: 修改为: 界面预览可以正常显示
- git 入门教程之基本概念
基本概念 了解工作区,暂存区和版本库的区别和联系有助于我们更好理解 git 的工作流程,了解命令的操作意图. git 和其他版本控制系统如 svn 的不同之处就是有暂存区的概念. 基本概念 工作区 | ...
- A Java Runtime Environment (JRE) or Java Development Kit (JDK) must be available in order to run Eclipse. No Java virtual machine was found after searching the following locations: /usr/local/eclipse/
linux系统下jdk是已经安装好的情况之下软件出现 A Java Runtime Environment (JRE) or Java Development Kit (JDK) must be av ...
- eclipse maven web
在eclipse中用maven创建web项目. 环境配置 C:\Users\xxx>java -versionjava version "1.8.0_121"Java(TM) ...
- C#方法重载(overload)方法重写(override)隐藏(new)
一.重载:同一个作用域内发生(比如一个类里面),定义一系列同名方法,但是方法的参数列表不同.这样才能通过传递不同的参数来决定到底调用哪一个. 值得注意的是,方法重载只有通过参数不同来判断调用哪个方法, ...
- OpenSSL 正确安装
经过几天的各种尝试,总算正常安装了openssl,中途差点各种放弃,最后总算装好了. 环境:Win10 , 为了装OpenSSL 而安装了vs2010,没有验证必须要装的 安装步骤: .从openss ...
- Android Studio无线连调式android手机
两种方法: 一.打开命令行或者Terminal窗口, 运行 adb connect 192.168.10.163:5555 来通过wifi连接手机调试 IP地址查看手机wifi的ip 要求手机和 ...
- SqlServer误删数据恢复
误删数据,操作步骤: 第一步: 找到误删的数据库之前备份文件. 第二步: 1,修改数据库备份模式为:大容量日志 2,修改访问限制为:SINGLE_USER(单用户模式) 第三步: 执行sql一条一条执 ...
- C语言 用π/4=1-1/3+1/5-1/7+... 求π的近似值
//凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ #include<stdio.h> #include<math.h> void m ...
- Mysql 索引 事物
索引 针对庞大数据 加速查询 缺点 占用空间 分类: 普通索引: 通过 index 创建 唯一索引: 就是 unique key 主键索引: 就是 primary key 联合索引(多列)" ...