你的位置:首页 > 操作系统

[操作系统](7/18)重学Standford_iOS7开发_视图、绘制、手势识别_课程笔记


第七课:

  1、View

    一般来说,视图是一个构造块,代表屏幕上一块矩形区域,定义了一个坐标空间,并在其中绘制及添加触控事件等。

    ①视图的层级关系

      一个视图只能有一个父视图,可以有多个子视图

 1 - (void)addSubview:(UIView *)aView; // 父视图添加子视图 2 - (void)removeFromSuperview; // 子视图从父视图移除自己 

    ②UIWindow

      UIView的顶级视图:一般情况下,iOS应用程序中只有一个UIWindow,指当前显示的屏幕内容。

    ③UIView的初始化

      a.从storyboard中初始化:awakeFromNib

      b.代码初始化:alloc initWithFrame:

- (void)setup { ... }- (void)awakeFromNib { [self setup]; }- (id)initWithFrame:(CGRect)aRect{  self = [super initWithFrame:aRect];  [self setup];  return self;}

     ④与视图相关的类

      a.CGFloat

      b.CGPoint:(CGFloat)x,(CGFloat)y

      c.CGSize:(CGFloat)width,(CGFloat)height

      d.CGRect:(CGPoint)origin,(CGSize)size

    ⑤坐标系统

      a.像素与点的概念:每个View都有一个只读属性contentScaleFactor,用以标识一个点包含多少像素

      b.坐标系统属性:(CGRect)bounds,(CGPoint)center,(CGRect)frame

        

        对于View B:  bounds = ((0,0),(200,250)) 

                frame = ((140,65),(320,320)) 

                center = (300,225) 

        此处理解视图可以在父视图中旋转的概念。

    ⑥视图的创建

      storyboard:drag

      code:alloc initWithFrame (直接使用init默认初始化为frame = CGRectZero)

1 CGRect labelRect = CGRectMake(20, 20, 50, 30);2 UILabel *label = [[UILabel alloc] initWithFrame:labelRect]; 3 label.text = @”Hello!”;4 [self.view addSubview:label];

     ⑦自定义视图

      通过实现- (void)drawRect:(CGRect)aRect; 方法绘制内容,aRect指需要优化绘制的区域,与视图最终性能有关(此处不作要求)

      注意:drawRect:方法不能主动调用,若需要重绘,可以调用- (void)setNeedsDisplay;或者- (void)setNeedsDisplayInRect:(CGRect)aRect;,系统会在合适的时间调用drawRect:

      a.drawRect的实现过程

        使用CoreGraphics: *获取绘制内容的上下文

                  *创建绘制路径(UIBezierPath)

                  *设置绘制属性(color,font,textures,lineWidth,linecaps)

                  *描边(strok),填充(fill)等

      b.UIBezierPath的使用

        UIBezierPath封装好了上下文内容(上下文:指绘制的位置,内容等信息)

        UIKit调用DrawRect之前会处理好上下文内容,需要获取当前上下文内容时使用:CGContextRef context = UIGraphicsGetCurrentContext(); 

UIBezierPath *path = [[UIBezierPath alloc] init];//创建//绘制路径[path moveToPoint:CGPointMake(75, 10)];[path addLineToPoint:CGPointMake(160, 150)];[path addLineToPoint:CGPointMake(10, 150]);//闭合路径[path closePath];//设置描边和填充[[UIColor greenColor] setFill];[[UIColor redColor] setStroke];//描边和填充[path fill]; [path stroke];

//其他用法 path.lineWidth = 2.0;//设置绘制路径宽度UIBezierPath *roundedRect = [UIBezierPath bezierPathWithRoundedRect:(CGRect)bounds cornerRadius:(CGFloat)radius];//绘制圆角矩形//绘制椭圆UIBezierPath *oval = [UIBezierPath bezierPathWithOvalInRect:(CGRect)bounds];//剪裁视图[roundedRect addClip];//剪裁后的视图只能在其路径区域内绘制,超出部分不会绘制

      c.透明度相关

        *UIColor:属性alpha(0.0-1.0)

        *UIView:(BOOL)opaque(不透明),alpha(0.0-1.0),hidden(隐藏视图)

        区别请看:http://blog.csdn.net/martin_liang/article/details/40739845

      d.子视图与父视图转换时上下文内容变化的问题

        压入(push),取出(pop)状态

- (void)drawGreenCircle:(CGContextRef)ctxt{  CGContextSaveGState(ctxt);//保存当前上下文  [[UIColor greenColor] setFill];  // draw my circle  CGContextRestoreGState(ctxt);//恢复保存的上下文}- (void)drawRect:(CGRect)aRect{  CGContextRef context = UIGraphicsGetCurrentContext();  [[UIColor redColor] setFill];  // do some stuff  [self drawGreenCircle:context];  // do more stuff and expect fill color to be red}

      e.绘制文本

        使用NSAttributeString

NSAttributedString *text = ...;//创建绘制内容CGSize textSize = [text size];//获取文本尺寸大小[text drawAtPoint:(CGPoint)p];//将文本绘制到指定位置(左上角),或者使用drawInRect也可以

      f.绘制图片

UIImage *image = [UIImage imageNamed:@“foo.jpg”];//UIImage *image = [[UIImage alloc] initWithContentsOfFile:(NSString *)fullPath];//UIImage *image = [[UIImage alloc] initWithData:(NSData *)imageData];//使用上下文绘制UIGraphicsBeginImageContext(CGSize);// draw with CGContext functionsUIImage *myImage = UIGraphicsGetImageFromCurrentContext();UIGraphicsEndImageContext();//标准绘制[image drawAtPoint:(CGPoint)p];//[image drawInRect:(CGRect)r];//[image drawAsPatternInRect:(CGRect)patRect;

      g.bounds变化时视图的重绘

        UIView属性:@property (nonatomic) UIViewContentMode contentMode; 

//位置重绘UIViewContentMode{Left,Right,Top,Right,BottomLeft,BottomRight,TopLeft,TopRight}//缩放重绘UIViewContentModeScale{ToFill,AspectFill,AspectFit} // bit stretching/shrinking //bounds变化时调用drawRect重绘UIViewContentModeRedraw // it is quite often that this is what you want

  2、手势识别

    步骤:a.创建手势识别器,添加到视图

       b.实现手势触发时的调用方法

    ①UIGestureRecognizer

      抽象超类,所有具体手势类的父类

    ②添加手势控制

- (void)setPannableView:(UIView *)pannableView // maybe this is a setter in a Controller{     _pannableView = pannableView;     UIPanGestureRecognizer *pangr =       [[UIPanGestureRecognizer alloc] initWithTarget:pannableView action:@selector(pan:)];//target也可是视图控制器,pan为触发时的调用方法,由target类实现     [pannableView addGestureRecognizer:pangr];//讲手势添加到视图}

    ③pan手势的例子

- (CGPoint)translationInView:(UIView *)aView;//触摸移动的距离- (CGPoint)velocityInView:(UIView *)aView;//移动速度- (void)setTranslation:(CGPoint)translation inView:(UIView *)aView;

    ④抽象超类提供的state属性

//UIGestureRecognizerStateBegin 连续手势开始//UIGestureRecognizerStateChanged 移动//UIGestureRecognizerStateEnded//UIGestureRecognizerStateCancelled//UIGestureRecognizerStateFailed//UIGestureRecognizerStateRecognized   识别到手势//使用举例- (void)pan:(UIPanGestureRecognizer *)recognizer{  if ((recognizer.state == UIGestureRecognizerStateChanged) ||    (recognizer.state == UIGestureRecognizerStateEnded))   {    CGPoint translation = [recognizer translationInView:self];    // move something in myself (I’m a UIView) by translation.x and translation.y    // for example, if I were a graph and my origin was set by an @property called       origin self.origin = CGPointMake(self.origin.x+translation.x,   self.origin.y+translation.y);     [recognizer setTranslation:CGPointZero inView:self];//恢复手势移动距离,为下次手势识别调用初始化  }}

    ⑤其他手势属性

//UIPinchGestureRecognizer 捏合手势@property CGFloat scale; // 缩放比例@property (readonly) CGFloat velocity; //速度(readonly)UIRotationGestureRecognizer 旋转手势@property CGFloat rotation; // 旋转弧度@property (readonly) CGFloat velocity; //速度(readonly)UISwipeGestureRecognizer 滑动手势@property UISwipeGestureRecognizerDirection direction; //方向(4)@property NSUInteger numberOfTouchesRequired; // 触控数量UITapGestureRecognizer 点击手势@property NSUInteger numberOfTapsRequired; // 点击次数@property NSUInteger numberOfTouchesRequired; //触控数量

  3、其他

    #pragma mark - example

    编译器标记,对方法进行分组,结果如下

  5、demo

    SuperCard:https://github.com/NSLogMeng/Stanford_iOS7_Study/commit/1505f50229e875776c323fcd08d4b80e04cfcff0

 

 

课程视频地址:网易公开课:http://open.163.com/movie/2014/1/2/A/M9H7S9F1H_M9H80ED2A.html

       或者iTunes U搜索standford课程