绘制图形-移动,旋转,阴影,渐变

// Only override drawRect: if you perform custom drawing.

// An empty implementation adversely affects performance during animation.

- (void)drawRect:(CGRect)rect {

UIBezierPath *path = [UIBezierPath
bezierPath];

//绘图的起点坐标

[path moveToPoint:CGPointMake(50,
50)];

//依次连接各个坐标

[path addLineToPoint:CGPointMake(50,
100)];

[path addLineToPoint:CGPointMake(100,
100)];

[path addLineToPoint:CGPointMake(100,
50)];

//闭合

[path
closePath];

//上下文

CGContextRef context =
UIGraphicsGetCurrentContext();

//保存上下文状态

CGContextSaveGState(context);

//绘制图形轮廓

[path
stroke];

//移动原点,使各个坐标依次移动

CGContextTranslateCTM(context,
50,
50);

//设置颜色

UIColor *fillColor = [UIColor
greenColor];

//填充颜色

[fillColor
setFill];

//填充

[path
fill];

//再次移动原点坐标

CGContextTranslateCTM(context,
50,
50);

//图形旋转

CGContextRotateCTM(context,
3.14/4);

fillColor = [UIColor
orangeColor];

[path
fill];

//[path stroke];

//恢复上下文状态,

CGContextRestoreGState(context);

CGContextSaveGState(context);

CGContextTranslateCTM(context,
50,
200);

//图形阴影

CGContextSetShadow(context,
CGSizeMake(10,
10),
7);

fillColor = [UIColor
grayColor];

[fillColor
setFill];

[path
fill];

CGContextRestoreGState(context);//恢复上下文状态

CGContextSaveGState(context);//保存上下文状态

CGContextTranslateCTM(context,
50,
300);

//定义渐变

CGGradientRef myGradient;

//声明色彩空间

CGColorSpaceRef colorSpace =
CGColorSpaceCreateDeviceRGB();

CGFloat components[8] = {1.0,
0.0,
0.0, 1.0,

0.0,
0.0, 1.0,
1.0

};

CGFloat locations[2] = {0.2,
0.8};

int num =
2;

myGradient =
CGGradientCreateWithColorComponents(colorSpace, components, locations, num);

[path
addClip];

CGContextDrawLinearGradient(context, myGradient,
CGPointMake(0,
0),
CGPointMake(100,
0),
0);

CGColorSpaceRelease(colorSpace);

CGGradientRelease(myGradient);

CGContextRestoreGState(context);

}

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-09 15:39:06

绘制图形-移动,旋转,阴影,渐变的相关文章

HTML5使用Canvas来绘制图形

一.Canvas标签: 1.HTML5<canvas>元素用于图形的绘制,通过脚本(通常是javascript)来完成. 2.<canvas>标签只是图形容器,必须使用脚本来绘制图形. 3.可以通过多种方法通过Canvas绘制路径.盒.圆.字符以及添加图像. 二.Canvas绘制图形 1.绘制矩形 2.绘制圆形 3.moveTo和lineTo 4.使用bezierCurveTo绘制贝塞尔曲线 5.绘制线性渐变 6.绘制径向渐变 7.绘制变形图形 8.绘制图形合成gloablComp

微信小程序开发—(八)canvas绘制图形

一.小知识 (1).API接口 (2).context 对象的方法列表 二.步骤 wxml中: <canvas canvas-id="myCanvas" class="myCanvas" ></canvas> 在js文件onLoad: function() {}的方法中开始编写代码 1.创建一个 Canvas 绘图上下文 CanvasContext const ctx = wx.createCanvasContext('myCanvas')

canvas 绘制图形

什么是canvas? <canvas> 元素用于图形的绘制,通过脚本 (通常是JavaScript)来完成. <canvas> 标签只是图形容器,您必须使用脚本来绘制图形. 方法属性 颜色.样式和阴影 属性 描述 fillStyle 设置或返回用于填充绘画的颜色.渐变或模式. strokeStyle 设置或返回用于笔触的颜色.渐变或模式. shadowColor 设置或返回用于阴影的颜色. shadowBlur 设置或返回用于阴影的模糊级别. shadowOffsetX 设置或返回

Android中android.graphics下面的绘制图形类Canvas,Paint,Bitmap,Drawable

1.概念区别: 很多网友刚刚开始学习Android平台,对于Drawable.Bitmap.Canvas和Paint它们之间的概念不是很清楚, 其实它们除了Drawable外早在Sun的J2ME中就已经出现了,但是在Android平台中,Bitmap.Canvas相关的都有所变化. 首先让我们理解下Android平台中的显示类是View,但是还提供了底层图形类android.graphics,今天所说的这些均为graphics底层图形接口. Bitmap - 称作位图,一般位图的文件格式后缀为b

【UWP通用应用开发】编辑文本、绘制图形、3D透视效果及绘制时钟实战

编辑文本及键盘输入 相信大家都会使用TextBox,但如果要让文本在TextBox中换行该怎么做呢?将TextWrapping属性设置为Wrap,将AcceptsReturn属性设置为True就好咯. PasswordBox很明显就是一个密码框了,和其他的控件相比其有2个特殊之处,一个是其可以用MaxLength来控制最大的长度,一个是用PasswordChanged来捕捉密码的改名.显然比如QQ密码的MaxLength就是16位了,而PasswordChanged可以用来监测比如用户设置的密码

HTML5—canvas绘制图形(1)

1.canvas基础知识 canvas元素是HTML5中新增的一个重要的元素,专门用来绘制图形,不过canvas本身不具备画图的能力,在页面中放置了canvas元素,就相当于在页面中放置了一块矩形的“画布”,我们可以利用js脚本在“画布”上绘制图形. 1.1canvas元素 在利用canvas绘制图形之前,我们首先需要在页面中放置一个canvas元素,如下代码: <canvas id="mycanvas" width="400" height="40

Android学习绘制图形

Android的绘图继承于View组件,重写onDraw(Canvas canvas) 方法时涉及一个绘图API: Canvas 代表了依附于指定View的画布,并且提供了很多绘制方法. Canvas提供的方法还涉及一个API: Paint ,Paint代表了Canvas上的画笔,主要用于设置绘制风格,画笔颜色,粗细,填充风格等. Path代表任意多条直线连接而成的任意图形,当Canvas根据Path绘制图形时,它可以绘制出任意形状的图形. ? 1 2 3 4 5 6 7 8 9 10 11 1

Quartz 各种绘制图形用法---实现画图片、写文字、画线、椭圆、矩形、棱形等

// Only override drawRect: if you perform custom drawing.// An empty implementation adversely affects performance during animation.- (void)drawRect:(CGRect)rect{    CGContextRef context = UIGraphicsGetCurrentContext();         /*NO.1画一条线     CGContex

使用canvas来绘制图形

一个简单例子 一开始,让我们来看个简单的例子,我们绘制了两个有趣的长方形,其中的一个有着alpha透明度. 我们将在接下来的例子里深入探索一下这是如何工作的. <html> <head> <script type="application/javascript"> function draw() { var canvas = document.getElementById("canvas"); if (canvas.getCont