IOS开发学习笔记018- 一般控件的使用

1、移动

2、动画

3、缩放

3、旋转

4、简化代码

5、总结

UIButton 的两种状态

normal

highlighted 

 1、移动

OC语法规定：不允许直接修改某个对象中结构体属性的成员。

    // 获取image控件的frame
    CGRect rect =  self.btnImage.frame;
    //self.btnImage.frame.origin.y = 20; // 不能直接修改
    // 更改Y的值，减小，如果减小到5则一直位5
    rect.origin.y -= 5;
    if( 5 >= rect.origin.y)
    {
        rect.origin.y  = 5;
    }
    // 重新赋值
    self.btnImage.frame = rect;

2、动画

这样看起来按钮移动的比较生硬，所以这里给他的移动添加上动画。用到UIView的动画属性

 // 0、动画 （头部-开始动画）
    [UIView beginAnimations:nil context:nil];
    // 1、获取image控件的frame
    CGRect rect =  self.btnImage.frame;
    //self.btnImage.frame.origin.y = 20; // 不能直接修改
    // 2、更改Y的值，减小，如果减小到5则一直位5
    rect.origin.y -= 5;
    if( 5 >= rect.origin.y)
    {
        rect.origin.y  = 5;
    }
    // 3、重新赋值
    self.btnImage.frame = rect;
    // 4、动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];

在设置过动画开始后再加上动画执行时间

    // 设置动画的执行时间
    [UIView setAnimationDuration:0.6];

可以看到按钮在平缓移动。

下面是关于动画的一些类方法

@interface UIView(UIViewAnimation)

+ (void)beginAnimations:(NSString *)animationID context:(void *)context;  // additional context info passed to will start/did stop selectors. begin/commit can be nested
+ (void)commitAnimations;                                                 // starts up any animations when the top level animation is commited

// no getters. if called outside animation block, these setters have no effect.
+ (void)setAnimationDelegate:(id)delegate;                          // default = nil
+ (void)setAnimationWillStartSelector:(SEL)selector;                // default = NULL. -animationWillStart:(NSString *)animationID context:(void *)context
+ (void)setAnimationDidStopSelector:(SEL)selector;                  // default = NULL. -animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context
+ (void)setAnimationDuration:(NSTimeInterval)duration;              // default = 0.2
+ (void)setAnimationDelay:(NSTimeInterval)delay;                    // default = 0.0
+ (void)setAnimationStartDate:(NSDate *)startDate;                  // default = now ([NSDate date])
+ (void)setAnimationCurve:(UIViewAnimationCurve)curve;              // default = UIViewAnimationCurveEaseInOut
+ (void)setAnimationRepeatCount:(float)repeatCount;                 // default = 0.0.  May be fractional
+ (void)setAnimationRepeatAutoreverses:(BOOL)repeatAutoreverses;    // default = NO. used if repeat count is non-zero
+ (void)setAnimationBeginsFromCurrentState:(BOOL)fromCurrentState;  // default = NO. If YES, the current view position is always used for new animations -- allowing animations to "pile up" on each other. Otherwise, the last end state is used for the animation (the default).

+ (void)setAnimationTransition:(UIViewAnimationTransition)transition forView:(UIView *)view cache:(BOOL)cache;  // current limitation - only one per begin/commit block

+ (void)setAnimationsEnabled:(BOOL)enabled;                         // ignore any attribute changes while set.
+ (BOOL)areAnimationsEnabled;
+ (void)performWithoutAnimation:(void (^)(void))actionsWithoutAnimation NS_AVAILABLE_IOS(7_0);

@end

下面说一些常用的吧：
beginAnimations 开始动画

commitAnimations 执行动画

setAnimationDelegate 设置动画委托

setAnimationDuration 设置动画时间

setAnimationDelay 设置动画延迟时间

setAnimationStartDate 设置动画开始日期

setAnimationCurve  设置动画曲线

setAnimationRepeatCount 设置动画重复次数

setAnimationsEnabled 关闭动画

areAnimationsEnabled 动画是否开启

3、旋转

下面来看按钮的旋转方法 transform属性
旋转方式有两种：
　　一种改变弧度 π
　　一种改变角度 90

- (IBAction)RotateLeft
{
    // 0、动画头部
    [UIView beginAnimations:nil context:nil];
    // 设置动画时间
    [UIView setAnimationDuration:0.5];
    // 1、获取当前的按钮的transform
     //_btnImage.transform = CGAffineTransformMakeRotation(-M_PI_4); // 每次都是-45度，所以再次点击没有旋转
    
    _btnImage.transform = CGAffineTransformRotate(_btnImage.transform, -M_PI_4); // 返回新的transform对象，可以连续旋转角度
    // 7、动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];
}

4、缩放

可以改变frame属性改变大小

    // 0、动画 （头部-开始动画）
    [UIView beginAnimations:nil context:nil];
    // 设置动画的执行时间
    [UIView setAnimationDuration:0.6];
    // 1、获取image控件的frame
    CGRect rect =  self.btnImage.frame;
    // 2、获取btn控件的中心
    CGPoint point =  self.btnImage.center;
    //self.btnImage.frame.origin.y = 20; // 不能直接修改
    // 3、更改高度和宽度
    rect.size.width *= 1.1;
    rect.size.height *= 1.1;
    // 4、计算新的原点，,保证放大后按钮的中心位置不变
    point.x -= rect.size.width/2;
    point.y -= rect.size.height/2;
    // 5、将新的原点赋值，
    rect.origin = point;

    // 6、重新赋值
    self.btnImage.frame = rect;
    //self.btnImage.center = point;
    // 7、动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];

也可以改变transform属性改变大小,可以想像CGAffineTransformScale内部实现就是方法1

    // 方法2 直接修改transform属性
    // 0、动画 （头部-开始动画）
    [UIView beginAnimations:nil context:nil];
    // 设置动画的执行时间
    [UIView setAnimationDuration:0.6];
    //_btnImage.transform = CGAffineTransformMakeScale(1.2, 1.2); // 只会改变一次
    _btnImage.transform = CGAffineTransformScale(_btnImage.transform, 1.1, 1.1); // 返回修改的transform属性，可连续修改
    // 动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];

5、简化代码
将上面代码整理后是这样

// id 类型的不能用点语法
- (IBAction)Run:(id)sender
{
    // 0、动画 （头部-开始动画）
    [UIView beginAnimations:nil context:nil];
    // 设置动画的执行时间
    [UIView setAnimationDuration:0.6];
    // 1、获取image控件的frame
    CGRect rect =  self.btnImage.frame;
    //self.btnImage.frame.origin.y = 20; // 不能直接修改
    switch ([sender tag] )
    {
        case 1:
            // 2、更改Y的值
            rect.origin.y -= DELTA;
            break;
        case 2:
            // 2、更改Y的值
            rect.origin.y += DELTA;

            break;
        case 3:
            // 2、更改x的值
            rect.origin.x -= DELTA;
            break;
        case 4:
            // 2、更改x的值
            rect.origin.x += DELTA;
            break;
        default:
            break;
    }
       // 3、重新赋值
    self.btnImage.frame = rect;
    // 4、动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];
}

- (IBAction)Scale:(id)sender
{
    // 方法2 直接修改transform属性
    // 0、动画 （头部-开始动画）
    [UIView beginAnimations:nil context:nil];
    // 设置动画的执行时间
    [UIView setAnimationDuration:0.6];
    //_btnImage.transform = CGAffineTransformMakeScale(1.2, 1.2); // 只会改变一次
    float scale = ([sender tag] == 5) ? 1.1 : 0.9;
    _btnImage.transform = CGAffineTransformScale(_btnImage.transform, scale, scale); // 返回修改的transform属性，可连续修改
    // 动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];

}

- (IBAction)Rotate:(id)sender
{
    // 0、动画头部
    [UIView beginAnimations:nil context:nil];
    // 设置动画时间
    [UIView setAnimationDuration:0.5];
    // 1、获取当前的按钮的transform
    //_btnImage.transform = CGAffineTransformMakeRotation(-M_PI_4); // 每次都是-45度，所以再次点击没有旋转
    float rotate = ([sender tag] == 7) ? -M_PI_4 : M_PI_4;
    _btnImage.transform = CGAffineTransformRotate(_btnImage.transform, rotate);
    // 7、动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];
}

仔细观察代码可以发现这三个函数的头部好尾部好多重复代码，
如果代码中又很多函数的头部和尾部都有很多重复代码，可以使用block简化代码

先看一下怎么写得

- (void)btnClickWithBlock:(void(^)())myBlock
{
    // 动画 （头部-开始动画）
    [UIView beginAnimations:nil context:nil];
    // 设置动画的执行时间
    [UIView setAnimationDuration:0.6];
    
    myBlock();
    
    // 动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];
}

这样写后，后面直接调用这个方法就可以了

- (void)btnClickWithBlock:(void(^)())myBlock
{
    // 动画 （头部-开始动画）
    [UIView beginAnimations:nil context:nil];
    // 设置动画的执行时间
    [UIView setAnimationDuration:0.6];
    
    myBlock();
    
    // 动画（尾部-提交动画-执行动画）
    [UIView commitAnimations];
}

// id 类型的不能用点语法
- (IBAction)Run:(id)sender
{

    [self btnClickWithBlock:^{
    // 1、获取image控件的frame
    CGRect rect =  self.btnImage.frame;
    //self.btnImage.frame.origin.y = 20; // 不能直接修改
    switch ([sender tag] )
    {
        case 1:
            // 2、更改Y的值
            rect.origin.y -= DELTA;
            break;
        case 2:
            // 2、更改Y的值
            rect.origin.y += DELTA;

            break;
        case 3:
            // 2、更改x的值
            rect.origin.x -= DELTA;
            break;
        case 4:
            // 2、更改x的值
            rect.origin.x += DELTA;
            break;
        default:
            break;
    }
       // 3、重新赋值
    self.btnImage.frame = rect;
        
    }];


}

- (IBAction)Scale:(id)sender
{
    [self btnClickWithBlock:^{
            //_btnImage.transform = CGAffineTransformMakeScale(1.2, 1.2); // 只会改变一次
    float scale = ([sender tag] == 5) ? 1.1 : 0.9;
    _btnImage.transform = CGAffineTransformScale(_btnImage.transform, scale, scale); // 返回修改的transform属性，可连续修改
        
    }];
 }

- (IBAction)Rotate:(id)sender
{
    [self btnClickWithBlock:^{
        
           // 1、获取当前的按钮的transform
        //_btnImage.transform = CGAffineTransformMakeRotation(-M_PI_4); // 每次都是-45度，所以再次点击没有旋转
        float rotate = ([sender tag] == 7) ? -M_PI_4 : M_PI_4;
        _btnImage.transform = CGAffineTransformRotate(_btnImage.transform, rotate);
  
    }];
}

这样看来代码简洁了很多。

6、恢复形变属性为原状

CGAffineTransformIdentity 这个Const常量就可以直接恢复原状

- (IBAction)reset:(id)sender
{
    // 恢复所有的形变属性，transform的改变全部恢复
    [self btnClickWithBlock:^{
        _btnImage.transform = CGAffineTransformIdentity;
    }];
}

总结
以上这些属性全部继承自UIView，所以对其他控件也适用。
1、frame 表示控件的位置和尺寸，以父控件左上角位坐标原点
2、center 表示控件的中心，，以父控件左上角位坐标原点
3、bounds 表示控件的位置和尺寸，以自己左上角位坐标原点，永远是（0，0）
4、transform 表示控件形状属性，缩放，旋转等
5、tag 表示控件的标识，默认是0

 2015-04-25 今日如此，明日依旧。