• 13-UIKit(tableviewcell贴图、手势GestureRecognizer、transform变形)


    目录:

    一、tableviewcell贴图

    二、手势GestureRecognizer

    5.1 Tap(按一下)

    5.2 Swipe(轻扫一下)

    5.3 pinch(捏/扩)

    5.4 longPress(长按)

    5.5 Pan(拖动)

    5.6 Rotation(旋转)

    6 transform变形

    回到顶部

    一、tableviewcell贴图

    1.tableviewcell贴图

    在storyboard中设置:

    tableview的separator(分隔符)为none,既然要贴图默认分隔符就不要用了

    tableviewcell的background为Clear Color,默认是白色,去掉才能看到效果

    在代码中:

    设置cell贴图backgroundView

    也可以设置cell选中贴图selectedBackgroundView

     1     cell.textLabel.text = @"hello world";
     2 
     3     UIImage *image = [UIImage imageNamed:@"list.png"];
     4 
     5     UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
     6 
     7     cell.backgroundView = imageView;
     8 
     9     cell.backgroundColor = [UIColor clearColor];
    10 
    11     // cell.textLabel.backgroundColor = [UIColor clearColor];
    12 
    13     UIImage *selectedImage = [UIImage imageNamed:@"listSelected.png"];
    14 
    15     UIImageView *selectedImageView = [[UIImageView alloc] initWithImage:selectedImage];
    16 
    17     cell.selectedBackgroundView = selectedImageView;// 选中贴图

    2 颜色美化

    2.1 tintColor

    当一个控件没有设置自己的颜色时,会使用父视图的tintColor

    批量设置界面中的颜色:

    将一个VC中view的tintColor设置成指定颜色,导致view下所有的子视图的tintColor变成此颜色,除非某个子视图的tintColor被单独设置过。

    UIWindow如果在AppDelegate设置了window的tintColor,那么整个应用的tintColor都会被设置,除非某个子视图的tintColor被单独设置过。

    self.window.tintColor = [UIColor redColor];

    2.2 UIAppearance

    可以针对某一种类型的控件设置颜色,以及贴图,UIView类(子类)的对象都有一个属性:appearance,这个属性是一个特殊对象,对这个对象进行美化和设置机会影响到这一类视图的样子

    // 设置所有的button
    
        [[UIButton appearance] setTintColor:[UIColor blackColor]];
    
        [[UIButton appearance] setBackgroundImage:[UIImage imageNamed:@"delete_btn"] forState:UIControlStateNormal];

    回到顶部

    二、手势GestureRecognizer

    1 基本概念

    视图对照用户操作的一种判断,对用户触控屏幕的行为的一种包装

    2 分类

    一次性手势

    Tap                  touch一下屏幕

    Swipe              轻扫一下屏幕

    连续性手势

    LongPress     长按

    Pinch               捏,扩

    Pan                   拖动

    rotation          旋转

    3 使用手势

    1> 用在视图上,视图识别用户的手势,识别成功后会触发事件

    2> 如何将手势加到视图上

               创建手势对象

               调用视图对象的addGestureRecognizer方法

    4 手势的类型

    每一个手势都有自己的类,这些具体的手势类继承自UIGestureRecognizer,具体的手势类命名方式如:UIXxxxGestureRecognizer

    每一个具体的手势对象都有特定的属性,用来描述手势具体的参数

    回到顶部

    5 具体的手势对象

    5.1 Tap手势(UITapGestureRecognizer)touch一下屏幕

    用法:

    1> 创建手势对象

    2> 修改手势相关属性

    3> 加入到指定的view中

    Tap手势特定的属性有:

    .numberOfTapsRequired          连续按几下触发事件

    .numberOfTouchesRequired    最少多少个触点(手指头)触发

    locationInView 获取点击位置

     1 - (void)viewDidLoad
     2 
     3 {
     4 
     5     [super viewDidLoad];
     6 
     7     // 1创建手势
     8 
     9     UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tap:)];
    10 
    11     // 2设置属性
    12 
    13     tap.numberOfTapsRequired = 1; // 连续按几下触发事件
    14 
    15     tap.numberOfTouchesRequired = 1; // 最少多少个触点(手指头)触发
    16 
    17     // 3添加到视图
    18 
    19     [self.view addGestureRecognizer:tap];
    20 
    21 }
    22 
    23  
    24 
    25 -(void)tap:(UITapGestureRecognizer *)sender{
    26 
    27     CGPoint point = [sender locationInView:self.view];
    28 
    29     NSLog(@"%f,%f",point.x,point.y);
    30 
    31 }

    回到顶部

    5.2 Swipe手势(UISwipeGestureRecognizer)轻扫一下屏幕

    .numberOfTouchesRequired最少多少个触点(手指头)触发

    .direction  扫的方向,不能左右上下都有,可以设置左右或上下,或设置一个方向

     1 - (void)viewDidLoad
     2 
     3 {
     4 
     5     [super viewDidLoad];
     6 
     7                // Do any additional setup after loading the view, typically from a nib.
     8 
     9     UISwipeGestureRecognizer *swipe = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(tap)];
    10 
    11     swipe.numberOfTouchesRequired = 1;
    12 
    13     //swipe.direction = UISwipeGestureRecognizerDirectionRight | UISwipeGestureRecognizerDirectionLeft;// 方向
    14 
    15     swipe.direction = UISwipeGestureRecognizerDirectionDown | UISwipeGestureRecognizerDirectionUp;// 方向
    16 
    17     [self.view addGestureRecognizer:swipe];
    18 
    19 }

    回到顶部

    5.3 pinch手势(UIPinchGestureRecognizer)捏,扩

    scale:              缩放比例,初始值为1

    velocity:     速度,只读

    这两个属性一般不需要设置,而是用于读取

    是持续性手势,最大的特点就是在手势执行期间会连续调用方法

     1 - (void)viewDidLoad
     2 
     3 {
     4 
     5     [super viewDidLoad];
     6 
     7     UIPinchGestureRecognizer *pinch = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(pinch:)];
     8 
     9     [self.view addGestureRecognizer:pinch];
    10 
    11 }
    12 
    13  
    14 
    15 -(void)pinch:(UIPinchGestureRecognizer *)sender{
    16 
    17     NSLog(@"%lf,%lf",sender.scale,sender.velocity);// scale 缩放比例 velocity 速度
    18 
    19     if (sender.scale < 1.0 && sender.velocity < -5.0) {
    20 
    21         self.textField.hidden = YES;
    22 
    23     }
    24 
    25     if (sender.scale > 1.0 && sender.velocity > 15.0) {
    26 
    27         self.textField.hidden = NO;
    28 
    29     }
    30 
    31 }

    回到顶部

    5.4 longPress(UILongPressGestureRecognizer)长按

    . minimumPressDuration 至少按下多少秒算长按,默认0.5

     1 - (void)viewDidLoad
     2 
     3 {
     4 
     5     [super viewDidLoad];
     6 
     7     UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longPress:)];
     8 
     9     longPress.minimumPressDuration = 0.5; // 按下多少秒算长按,默认0.5
    10 
    11     [self.view addGestureRecognizer:longPress];
    12 
    13 }

    回到顶部

    5.5 Pan拖动

    locationInView:UIView 来获取手势目前的位置在指定视图中的坐标,视图不同,坐标不同

    经常用pan手势来移动指定的视图,移动时,所修改的是需要移动的视图的center属性

     1 - (void)viewDidLoad
     2 
     3 {
     4 
     5     [super viewDidLoad];
     6 
     7     UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];
     8 
     9    
    10 
    11     [self.view addGestureRecognizer:pan];
    12 
    13 }
    14 
    15 -(void)pan:(UIPanGestureRecognizer *)sender{
    16 
    17     CGPoint current = [sender locationInView:self.view];// 相对self.view托
    18 
    19     CGPoint point = [sender locationInView:self.subView];// 相对self.subView托
    20 
    21     NSLog(@"view(%f,%f)",current.x,current.y);
    22 
    23     NSLog(@"subView(%f,%f)",point.x,point.y);
    24 
    25     // center表示中心点处在父视图的哪个位置
    26 
    27     self.playerView.center = current;
    28 
    29     CGPoint velocity = [sender velocityInView:self.view]; // 一秒走多少个像素
    30 
    31     NSLog(@"velocity:%f,%f",velocity.x,velocity.y);
    32 
    33 }

    回到顶部

    5.6 Rotation(旋转)

    .rotation  旋转的弧度(PI)

    .velocity  旋转的速度,每秒多少弧度

     1 - (void)viewDidLoad
     2 
     3 {
     4 
     5     [super viewDidLoad];
     6     UIRotationGestureRecognizer *rotation = [[UIRotationGestureRecognizer alloc] initWithTarget:self action:@selector(rotation:)];
     7 
     8     [self.view addGestureRecognizer:rotation];
     9 
    10 }
    11 
    12 -(void)rotation:(UIRotationGestureRecognizer *)sender{
    13 
    14     // rotation  旋转的弧度(PI)  velocity  旋转的速度,每秒多少弧度
    15     NSLog(@"%f,%f",sender.rotation,sender.velocity);
    16 
    17     // 拿出来
    18     CGAffineTransform imageTransform = self.imageView.transform;
    19 
    20     // 改一改 旋转
    21     imageTransform = CGAffineTransformRotate(imageTransform, sender.rotation);
    22 
    23     // 放进去
    24     self.imageView.transform = imageTransform;
    25 
    26     sender.rotation = 0;
    27 
    28     // self.imageView.transform = CGAffineTransformMakeRotation(sender.rotation);// 第二次旋转从0开始
    29 
    30 }

    回到顶部

    6 transform变形

    6.1 概念:对一个view中transform属性的改变,改变此属性会导致发生变形,旋转、缩放、位移

    6.2 本质:一个view的transform属性描述的其实是此view在父视图中的变化,这个属性内部是由一个3行3列的矩阵组成。

    6.3 能改变的是:视图的 旋转角度、缩放比例、位移。

    6.4 如何使用:UIView.transform

    注意:在修改transform属性时,需要将autolayout关掉(imageView的第一个检查器),否则自动布局可能会影响变形

    修改transform属性:

    CGAffineTransformRotate(transform,rotation)在transform的基础上叠加一个rotation的旋转

    CGAffineTransformScale()叠加一个scale的缩放

    CGAffineTransformTranslation()叠加一个位移

    拿出来,改一改,放进去。

    创建transform的方法:

    CGAffineTransformMakeRotation

    CGAffineTransformMakeScale

    CGAffineTransformMakeTranslation

     

    每次改变scale后,需要将scale恢复成初始值1.0

    pinch.scale = 1.0

    每次translation后,需要将只恢复成初始值:[pan setTranslation:CGPointZero inView:self.view];

    获取用户拖动的位置

    [pan translationView:xx];

    手势的状态:

    开始状态

    改变状态

    结束状态

    7 练习:图片查看器

    1)使用代码向view中增加一个UIImageView对象,UIImageView的大小和图片本身的大小要一致

    2)使用center属性将UIImageView移动到屏幕的中心

    3)使用transform将UIImageView缩放到屏幕刚刚能显示下所有的内容,要求不损失宽高比,

    4)对UIImageView增加rotation手势识别,支持旋转,

    5)增加pinch手势,支持缩放

    6)增加pan手势,支持位移动

    7)增加tap手势,双击后恢复原装(第三步)

    8 多手势同时触发

    默认情况下,一个视图中如果有多个手势,同一时刻只能触发一个,如果希望手势可以同时触发,那么手势对象就需要一个委托对象回答问题:两个手势对象是否可以一起触发

    1> 让当前controller遵守协议UIGestureRecognizerDelegate协议

    2> 实现方法

    - (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer

    3> 将当前对象设置为各手势对象的委托

     

    作业:

    做一个视图类MXMessage,这个类的一个对象其实是一个聊天气泡,

    MXMessageView:

          -message:NSString

          -formMe:BOOL

    private:

          -messageLabel:UILabel

          -messagePopImageView:UIImageView

    显示:

    if(self.fromMe){

    蓝色泡泡右上角,文字颜色是白色,大小根据字符串计算

    }else{

          灰色的泡泡,文字原色是深灰色,大小根据字符串计算

    }

     注意:

    storyboard

    一定是被storyboard创建

    self.storyboard intina...创建VC

    prepareSegue跳转前调用

     

  • 相关阅读:
    leetcode
    vue初尝试--组件
    vue初尝试--项目结构
    vue初尝试--新建项目
    SQL取xml中节点值
    UI设计
    Asp.NET中Gridview CSS---Office2003风格
    Jquery+JSON+WebService使用总结
    ASP.NET 如何固定表格表头(fixed header)
    项目总结
  • 原文地址:https://www.cnblogs.com/yangmx/p/3526226.html
Copyright © 2020-2023  润新知