绘制扇形, 可以使用三角形才拼接而成, 如果要使扇形足够圆滑那么需要使用的三角形角度足够小, 可以使用 1 度画一个三角形, 连起来就是一个扇形了 代码比较简单 /** * 绘制扇形 * * @param x * 扇形x坐标 * @param y * 扇形y坐标 * @param radius * 半径 * @para ..

libgdx - 绘制扇形和圆角矩形

本贴最后更新于 959 天前,其中的信息可能已经时移世异

绘制扇形, 可以使用三角形才拼接而成, 如果要使扇形足够圆滑那么需要使用的三角形角度足够小, 可以使用 1 度画一个三角形, 连起来就是一个扇形了
代码比较简单

/**
	 * 绘制扇形
	 * 
	 * @param x
	 *            扇形x坐标
	 * @param y
	 *            扇形y坐标
	 * @param radius
	 *            半径
	 * @param startAngle
	 *            初始角度
	 * @param interval
	 *            扇形角度
	 */
	public void renderSector(float x, float y, float radius, float startAngle,
			float interval) {
		int num = (int) interval;
		float[][] points = new float[num][2];
		for (int i = 0; i < num; i++) {
			points[i][0] = x + radius * MathUtils.cosDeg(startAngle + i);
			points[i][1] = y + radius * MathUtils.sinDeg(startAngle + i);
		}

		rend.setColor(Color.YELLOW);
		Gdx.gl.glEnable(GL20.GL_BLEND);
		Gdx.gl.glBlendFunc(GL20.GL_SRC_ALPHA, GL20.GL_ONE_MINUS_SRC_ALPHA);
		rend.begin(ShapeType.Filled);
		for (int i = 0; i < num - 1; i++) {
			rend.triangle(x, y, points[i][0], points[i][1], points[i + 1][0],
					points[i + 1][1]);
		}
		rend.end();

	}

其中 x + radius * MathUtils.cosDeg(startAngle + i) 这个就是为了确定扇形每一度上的和 x 坐标
如下图所示
33307bc289564fd8af13c399562bca30-shanxing.png

MathUtils.cosDeg(A)= x/z A 为图上的 A 角度 x 为该角度的 x 坐标 z 为扇形半径
那么 radius * MathUtils.cosDeg(A) = x 轴坐标
那么可以根据扇形画法来画出圆角矩形
如下图所示
9029f040e1164625a7f563f93ff0963b-yuanjiao.png

可以将圆角矩形分为 4 条线和 4 个扇形, 那么根据以上扇形画法, 圆角矩形代码如下:

/**
	 * 绘制圆角矩形
	 * @param x  x坐标
	 * @param y  y坐标
	 * @param width  矩形宽度
	 * @param height 矩形高度
	 * @param radius 圆角半径
	 * @param color  矩形颜色
	 */
	public void DrawCircleRect(float x, float y, float width, float height,
			float radius, Color color) {
		rend.setColor(color);
		rend.begin(ShapeType.Line);

		rend.line(x + radius, y, x + width - radius, y); // 下方线
		rend.line(x + radius, y + height, x + width - radius, y + height);// 上方线
		rend.line(x, y + radius, x, y + height - radius); // 左方线
		rend.line(x + width, y + radius, x + width, y + height - radius); // 右方线

		// 左上角
		float x0 = x + radius;
		float y0 = y + height - radius;
		int num = 30; // 画30个点组成扇形
		float perDegree = 90f / num;
		for (int i = 0; i < num; i++) {
			float one = 90 + i * perDegree;
			float two = 90 + (i + 1) * perDegree;
			Vector2 v1 = new Vector2(x0 + radius * MathUtils.cosDeg(one), y0
					+ radius * MathUtils.sinDeg(one));
			Vector2 v2 = new Vector2(x0 + radius * MathUtils.cosDeg(two), y0
					+ radius * MathUtils.sinDeg(two));
			rend.line(v1, v2);
		}

		// 右上角
		x0 = x + width - radius;
		y0 = y + height - radius;
		for (int i = 0; i < num; i++) {
			float one = i * perDegree;
			float two = (i + 1) * perDegree;
			Vector2 v1 = new Vector2(x0 + radius * MathUtils.cosDeg(one), y0
					+ radius * MathUtils.sinDeg(one));
			Vector2 v2 = new Vector2(x0 + radius * MathUtils.cosDeg(two), y0
					+ radius * MathUtils.sinDeg(two));
			rend.line(v1, v2);
		}

		// 左上角
		x0 = x + radius;
		y0 = y + radius;
		for (int i = 0; i < num; i++) {
			float one = 180 + i * perDegree;
			float two = 180 + (i + 1) * perDegree;
			Vector2 v1 = new Vector2(x0 + radius * MathUtils.cosDeg(one), y0
					+ radius * MathUtils.sinDeg(one));
			Vector2 v2 = new Vector2(x0 + radius * MathUtils.cosDeg(two), y0
					+ radius * MathUtils.sinDeg(two));
			rend.line(v1, v2);
		}
		// 右上角
		x0 = x + width - radius;
		y0 = y + radius;
		for (int i = 0; i < num; i++) {
			float one = 270 + i * perDegree;
			float two = 270 + (i + 1) * perDegree;
			Vector2 v1 = new Vector2(x0 + radius * MathUtils.cosDeg(one), y0
					+ radius * MathUtils.sinDeg(one));
			Vector2 v2 = new Vector2(x0 + radius * MathUtils.cosDeg(two), y0
					+ radius * MathUtils.sinDeg(two));
			rend.line(v1, v2);
		}
		rend.end();
	}



手机游戏源码素材网:http://www.codegather.com

  • B3log

    B3log 是一个开源组织,名字来源于“Bulletin Board Blog”缩写,目标是将独立博客与论坛结合,形成一种新的网络社区体验,详细请看 B3log 构思。目前 B3log 已经开源了多款产品:PipeSoloSymWide 等。

    1561 引用 • 3495 回帖 • 554 关注
  • libgdx
    7 引用 • 3 回帖
  • radius
    1 引用
回帖
请输入回帖内容...