您的位置:首页 > 移动开发 > IOS开发

iOS 画字,画线,矩形,画图,动画

2016-05-27 11:36 417 查看

绘制文本的代码。

- (void)drawRect:(CGRect)rect {
   UIColor *magentaColor =

    [UIColorcolorWithRed:0.5f
                   green:0.0f
                    blue:0.5f
                   alpha:1.0f];

    /* Set the color in the graphical context */
    [magentaColorset];

    /* Load the font */
   UIFont *helveticaBold = [UIFontfontWithName:@"HelveticaNeue-Bold"size:30.0f];

    /* Our string to be drawn */
   NSString *myString =@"Hellow world";

    /* Draw the string using the font. The color has

     already been set */
    [myStringdrawAtPoint:CGPointMake(25,190)withFont:helveticaBold];
}

绘制一条直线。

- (void)drawRect:(CGRect)rect {

    [selfdrawMyText];

    [selfdrawMyLine];
}
- (void)drawMyText {
   UIColor *magentaColor =

    [UIColorcolorWithRed:0.5f
                   green:0.0f
                    blue:0.5f
                   alpha:1.0f];

    /* Set the color in the graphical context */
    [magentaColorset];

    /* Load the font */
   UIFont *helveticaBold = [UIFontfontWithName:@"HelveticaNeue-Bold"size:30.0f];

    /* Our string to be drawn */
   NSString *myString =@"Hellow world";

    /* Draw the string using the font. The color has

     already been set */
    [myStringdrawAtPoint:CGPointMake(25,190)withFont:helveticaBold];
}
- (void)drawMyLine {

    //draw line

    CGContextRef context    =UIGraphicsGetCurrentContext();//获取画布

    CGContextSetStrokeColorWithColor(context, [UIColorredColor].CGColor);//线条颜色

    CGContextSetShouldAntialias(context,NO);//设置线条平滑,不需要两边像素宽

    CGContextSetLineWidth(context,1.0f);//设置线条宽度

    CGContextMoveToPoint(context,153,6); //线条起始点

    CGContextAddLineToPoint(context,153,145);//线条结束点

    CGContextStrokePath(context);//结束,也就是开始画
}

绘制矩形

首先,获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

画无框矩形

//设置矩形填充颜色:红色  

CGContextSetRGBFillColor(context, 1.0, 0.0, 0.0, 1.0);  

//填充矩形  

CGContextFillRect(context, rect);  

//执行绘画  

CGContextStrokePath(context);  

画有框矩形

//设置矩形填充颜色:红色  

CGContextSetRGBFillColor(context, 1.0, 0.0, 0.0, 1.0);  

//填充矩形  

CGContextFillRect(context, rect);  

//设置画笔颜色:黑色  

CGContextSetRGBStrokeColor(context, 0, 0, 0, 1);  

//设置画笔线条粗细  

CGContextSetLineWidth(context, 1.0);  

//画矩形边框  

CGContextAddRect(context,rect);  

//执行绘画  

CGContextStrokePath(context);  

绘制图片(注意图片可能颠倒)

- (void)drawRect:(CGRect)rect {
    [self drawMyText];
    [self drawMyLine];

    [selfdrawMyImage];
}
- (void)drawMyImage {

    //draw image 

    CGContextRef context    =UIGraphicsGetCurrentContext();//获取画布

   

//CGContextDrawImage(context,CGRectMake(160,0,160,

150), [image1CGImage]);

    //上面这种方式,绘制出来的图片是翻转的,开始不知道。因为测试的图片都比较对称。后发发现是上下颠倒了

    //下面才是正确的方法。

    UIGraphicsPushContext( context );
    [imagedrawInRect:imageRect];

    UIGraphicsPopContext();
}

使用CGContextDrawImage绘制图片上下颠倒的原因:

在iOS的不同framework中使用着不同的坐标系 :

UIKit - y轴向下
Core Graphics(Quartz) - y轴向上
OpenGL ES - y轴向上

   

        UIKit是iPhone SDK的Cocoa Touch层的核心framework,是iPhone应用程序图形界面和事件驱动的基础,它和传统的windows桌面一样,坐标系是y轴向下的; 

        Core Graphics(Quartz)一个基于2D的图形绘制引擎,它的坐标系则是y轴向上的;

        OpenGL ES是iPhone SDK的2D和3D绘制引擎,它使用左手坐标系,它的坐标系也是y轴向上的,如果不考虑z轴,在二维下它的坐标系和Quartz是一样的。

        所以,当通过CGContextDrawImage绘制图片到一个context中时,如果传入的是UIImage的CGImageRef,因为UIKit和CG坐标系y轴相反,所以图片绘制将会上下颠倒。
在initWithFrame里对image1进行初始化,为1.png
- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
       image1 = [UIImageimageNamed:@"1.png"];
    }
    return self;
}

给图片添加动画

上面的图片显示方式直接绘制图片,下面的方式为控件方式绘制。当然,图片控件的话,就不需要我们自己绘制了,iOS的UI库已经帮助我们绘制了。

代码如下:彩色部分需要添加。

#import <QuartzCore/QuartzCore.h>

- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
        image1 = [UIImage imageNamed:@"1.png"];
       image2 = [UIImageimageNamed:@"2.png"];

        [selfannimateImage];
    }
    return self;
}

- (void)annimateImage {
   UIImageView* imageView = [[UIImageViewalloc]initWithImage:image2];
    imageView.frame =CGRectMake(0,0,100,100);
    [selfaddSubview:imageView];

    imageView.userInteractionEnabled =YES;

    UITapGestureRecognizer* singleTap =
    [[UITapGestureRecognizeralloc]initWithTarget:selfaction:@selector(onImageClick)];
    [imageViewaddGestureRecognizer:singleTap];

    //animation

    CABasicAnimation *animation = [CABasicAnimationanimationWithKeyPath:@"transform"];
    animation.delegate =self;

    animation.toValue = [NSValuevalueWithCATransform3D:CATransform3DMakeRotation(M_PI

,0,

0,1.0)];
    animation.duration =1;
    animation.cumulative =YES;
    animation.repeatCount =INT_MAX;
    [imageView.layeraddAnimation:animationforKey:@"animation"];
}
代码已经添加完毕,但是我们不能编译过去,因为我们使用了QuartzCore的头文件,却没有引入它的库。

怎么引入 点击工程:



源代码再此下载:http://download.csdn.net/detail/hherima/5108428
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: