关于双视图，叠加控制

2014.08.06博文今天讲了三个APP,一个是UIView、一个是slider、还有一个CustomCell今天的内容是挺多的，除了上课以外，有一个意外收获～以后写代码的时候不能耗太久了，这是经验之谈！有几个步骤：下载代码->将代码输入至XCode->设置断点->然后根据断点来看。看代码一般是先看整体框架，再来分析结构与各个细节。1.。今天的东西突出一个相对位置，例如：今天学的CustomcellAPP，先创建一个UIView出来，然后在这个UIView上面继续创建一个或者多个UIView覆盖在第一个UIView上面。并且通过改变第一个UIView的形状来控制覆盖在其上面的UIView的变化。这东西还是挺神奇第一步：ViewController里面创建一个UIView，myUIView *myview = [[myUIView alloc] initWithFrame:CGRectMake(1, 50, 290, 200)]; //创建一个视图view，并设置好视图所占用的framemyview.backgroundColor = [UIColor greenColor]; //设置此视图view的背景颜色，不然的话，能找到么？亲。。[self.view addSubview:myview]; //将视图显示在viewController上面，这样就能看到了，之前创建的view是不能被看见的，只有调用显示方法以后才能被看到。 为什么两个页面能够放在一起，而且联系紧密呢。看下去。创建另外新的类，这个类是UIView类型的，类名是myUIView。恰好，在viewController里面用的就是这个myUIView类名创建的那个视图view。所以几个放在一个视图里面的view的属于相同的类。 UIView *view1 = [[UIView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(frame)/4, CGRectGetHeight(frame)/4)]; view1.backgroundColor = [UIColor redColor]; [self addSubview:view1];         UIView *view2 = [[UIView alloc] initWithFrame:CGRectMake(CGRectGetWidth(frame) - CGRectGetWidth(frame)/4, 0, CGRectGetWidth(frame)/4, CGRectGetHeight(frame)/4)]; view2.backgroundColor = [UIColor redColor]; [self addSubview:view2];         UIView *view3 = [[UIView alloc] initWithFrame:CGRectMake( 0 , CGRectGetHeight(frame) - CGRectGetHeight(frame)/4, CGRectGetWidth(frame)/4, CGRectGetHeight(frame)/4)]; view3.backgroundColor = [UIColor redColor]; [self addSubview:view3];         UIView *view4 = [[UIView alloc] initWithFrame:CGRectMake(CGRectGetWidth(frame) -  CGRectGetWidth(frame)/4, CGRectGetHeight(frame) - CGRectGetHeight(frame)/4, CGRectGetWidth(frame)/4, CGRectGetHeight(frame)/4)]; view4.backgroundColor = [UIColor redColor]; [self addSubview:view4];这样使得后面的4个view显示在前面的视图view上面，然后通过对后面4个视图view的frame的编写，与前一个视图view连接起来，通过控制前一个视图view的大小来控制后面的view。2.。今天学习的slider滑动条也用到了上面的知识。同样的道理，要用代码编一个滑动条，用到了同样用到了之前的知识。步骤相当，先在viewController里面用新类名创建一个对象：MySilder *slider = [[MySilder alloc]initWithFrame:CGRectMake(10, 100, 300, 20)];slider.minValue = 100;slider.maxValue = 200;[self.view addSubview:slider];- (instancetype)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {        _minValue = 0;        _maxValue = 1;        // 设置滑动条的最大值和最小值分别是0和1.        self.backgroundColor = [UIColor magentaColor];        //设置本视图的背景颜色        UIView *_tView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 0, frame.size.height)];        //创建一个视图view，并将其放在viewController视图控制里面的底层view上面，其中CGRectMake(0, 0, 0, frame.size.height)是_tView视图和slider视图的相对位置。这个务必清楚。        _tView.backgroundColor = [UIColor blueColor];        //将视图_tView设置一个背景颜色，与视图slider的背景颜色不同，这样在才能做到颜色分明的滑动条的效果。        [self addSubview:_tView];        //讲_tView显示在slider上面                _jView = [[UIView alloc]initWithFrame:CGRectMake(0, -25, 20, 20)];        _jView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"jt.png"]];        [self addSubview:_jView];        //上面几行代码的意思是要创建一个新的view，设置上一张背景图片，然后作为滑动条的标签。        UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(didTap:)];        [self addGestureRecognizer:tap];    //点击手势,其作用是通过点击视图“slider”面积上，从而达到将视图_tView拉到该位置的作用。这个手势非常好，一般的音乐播放器和视频播放器都可以用到        UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(didPan:)];        [self addGestureRecognizer:pan];    //拖动手势，可以点击到图标将图标拉到响应的位置。    }    return self;}- (void)didTap:(UITapGestureRecognizer *)recognizer{    //获取拖动手势当前的位置    CGPoint location = [recognizer locationInView:self];    NSLog(@"tap location: %@", NSStringFromCGPoint(location));     self.value = [self valueForPosition:location];}- (void)didPan:(UIPanGestureRecognizer *)recognizer{    //获取拖动手势当前的位置的位移    CGPoint location = [recognizer locationInView:self];    NSLog(@"location: %@", NSStringFromCGPoint(location));     self.value = [self valueForPosition:location];        //获取拖动手势的相对位移    CGPoint point = [recognizer translationInView:self];    NSLog(@"%@", NSStringFromCGPoint(point));    self.value = [self valueForPosition:point];}- (float)valueForPosition:(CGPoint)point{    return point.x * (_maxValue - _minValue) / self.frame.size.width + _minValue;}上述几行代码中：“ CGPoint location ”与“ CGPoint location ”表示的是拖动手势的相对位移，即你点击以后拖动到这个位置的位移。 拖动手势的当前位置，即你点击在哪里，就显示你点击的位置。其中这两个手势里面的代码需要再看看，里面的格式是固定的，下一次写的话，应该代码没多大变化。- (void)setValue:(float)value{    if (value <= _minValue) {        _value = _minValue;    }    else if (value >= _maxValue) {        _value = _maxValue;    }    else {        _value = value;    }    [self setNeedsLayout];}//这是set方法。这个的判断作用是为了让滑动条能够在范围内滑动，如果有超过，或者少于的情况，那么就将其取在最大值或者最小值上。- (void)layoutSubviews{    [super layoutSubviews];        //_min --value-- _max    //(value - _min)/(_max - _min)    _tView.frame = CGRectMake(0, 0, (_value - _minValue)/(_maxValue - _minValue) * self.frame.size.width, self.frame.size.height);}//“ layoutSubviews ”是很重要的，在以后的应用里非常广泛，只要有框架frame的细微的改变，那么就必须用到 “ 布局 ”即“ -(void)layoutSubviews “。里面的格式非常简单：_tView.frame = CGRectMake(0, 0, (_value - _minValue)/(_maxValue - _minValue) * self.frame.size.width, self.frame.size.height);只有一个视图_tView的frame产生相应的变化，其x,y,width,height根据“self.frame.size.width”和“self.frame.size.height”的变化。引号里面的宽和高是第一个视图slider的总宽和总长。