UI_05 設計模式、⼿勢識別器

⼀、target/action設計模式

耦合

     耦合是衡量⼀個程序寫的好壞的標準之⼀， 是衡量模塊與模塊之間關聯程度的指標。 「⾼內聚，低耦合」是⾯向對象編程的核⼼思想。

使⽤target…action實現解耦

touchView.h:

@interface TouchView : UIView

@property (nonatomic, retain) id target;
@property (nonatomic, assign) SEL action;

- (instancetype)initWithTarget:(id)target action:(SEL)action;

@end

touchView.m

- (instancetype)initWithTarget:(id)target action:(SEL)action
{
    self = [super init];
    if (self) {
        self.target = target;
        self.action = action;
    }
    return self;
}

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    NSLog(@"clicked");
    [self.target performSelector:self.action withObject:self];

}

RootViewController.h

#import "RootViewController.h"

#import "TouchView.h"
#import "UIColor+RandomColor.h"

@interface RootViewController ()
@property (nonatomic, retain) TouchView *aTouchView;
@end

@implementation RootViewController

- (void)dealloc
{
    [_aTouchView release];
    [super dealloc];
}

- (void)viewDidLoad {
    [super viewDidLoad];
   

    self.aTouchView = [[TouchView alloc] initWithTarget:self action:@selector(changeColor:)];

    //changeColor:方法的參數爲TouchView.m中performSelector: withObject:方法的obj        

    //[_target performSelector:sel withObject:obj];

    //一個Target-Action在一個時間只能作一個事件

    self.aTouchView.frame = CGRectMake(100, 100, 200, 200);
    self.aTouchView.backgroundColor = [UIColor redColor];

    [self.view addSubview:_aTouchView];
    [self.aTouchView release];

    self.view.backgroundColor = [UIColor blueColor];
}

- (void)changeColor:(TouchView *)view
{
    view.backgroundColor = [UIColor randomColor];

}

@end

---

⼆、代理設計模式

delegate也是⽤來解耦的，它再也不簡簡單單讓⺫標去執⾏⼀個動 做了，⽽是delegate去處理⼀些列事件、就像UITextFieldDelegate⼀ 樣，能監測將要開始編輯，已經開始編輯、return按鈕點擊等等。

經過使用代理設計模式，實現開始點擊自定義視圖touchView時變換顏色，結束點擊時變換位置

TouchViewDelegate.h

#import <Foundation/Foundation.h>
@class TouchView;
//#import "TouchView.h"
@protocol TouchViewDelegate <NSObject>

@optional

- (void)touchViewTouchBegan:(TouchView *)touchView;     //作飯

- (void)touchViewTouchMoved:(TouchView *)touchView;

- (void)touchViewTouchEnd:(TouchView *)touchView;

- (void)touchViewTouchCancel:(TouchView *)touchView;

@end

touchView.h

@interface TouchView : UIView

@property (nonatomic, assign) id<TouchViewDelegate> delegate;  //保姆

@end

toucheView.m

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event  // 餓了

{

#pragma mark -- Delegate --

    if ([self.delegate respondsToSelector:@selector(touchViewTouchBegan:)]) {
        [self.delegate touchViewTouchBegan:self];
    }
    if ([self.delegate respondsToSelector:@selector(touchViewTouchEnd:)]) {
        [self.delegate touchViewTouchEnd:self];

    }

}

RootViewController.m

#import "RootViewController.h"
#import "TouchView.h"

@interface RootViewController ()
{
    TouchView *_touchView1;
    TouchView *_touchView2;
}
@end

@implementation RootViewController

- (void)viewDidLoad {
    [super viewDidLoad];
   
    _touchView1 = [[TouchView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];
    _touchView1.backgroundColor = [UIColor blueColor];

    

#pragma mark -- Delegate --
    //設置代理

    _touchView1.delegate = self;

    [self.view addSubview:_touchView1];
    [_touchView1 release];

}

#pragma mark -- Delegate --

- (void)touchViewTouchBegan:(TouchView *)touchView     //作飯

{

    touchView.backgroundColor = [UIColor colorWithRed:arc4random() %256 / 255.0 green:arc4random() %256 / 255.0 blue:arc4random() %256 / 255.0 alpha:arc4random() %100 / 100.0];;

}

- (void)touchViewTouchEnd:(TouchView *)touchView
{
    touchView.center = CGPointMake(50, 50);

}

@end

利用家庭－保姆來理解：

     TouchView:     家庭類

  ContainerViewController:保姆類

  TouchViewDelegate:      協議

  

---

3、UIImageView

     UIImageView是iOS中⽤於顯⽰圖⽚的類，iOS中⼏乎全部看到的 圖⽚，都是由這個類來顯⽰的。

下面用UIImageView分別演示如何添加靜態和動態圖片

一、UIImageView常⽤屬性

    image //設置圖⽚

    animationImages //設置⼀組動態圖⽚

    animationDuration //設置播放⼀次⼀組動態圖⽚的時間

    animationRepeatCount //設置重複次數

    startAnimating //開始動畫

    stopAnimating //結束動畫

二、UIImageView幀動畫相關屬性和方法

    @property(nonatomic,copy) NSArray *animationImages;
    須要播放的序列幀圖片數組（裏面都是UIImage對象，會按順序顯示裏面的圖片）
    @property(nonatomic) NSTimeInterval animationDuration;
    幀動畫的持續時間
    @property(nonatomic) NSInteger animationRepeatCount;
    幀動畫的執行次數（默認是無限循環）
    - (void)startAnimating;
    開始執行幀動畫
    - (void)stopAnimating;
    中止執行幀動畫
    - (BOOL)isAnimating;

    是否正在執行幀動畫

三、UIImage的2種加載方式

方式一：有緩存（圖片所佔用的內存會一直停留在程序中）

+ (UIImage*)imageNamed:(NSString*)name;

方式二：無緩存（圖片所佔用的內存會在一些特定操做後被清除）

+ (UIImage *)imageWithContentsOfFile:(NSString *)path
- (id)initWithContentsOfFile:(NSString *)path;

+ (UIImage*)imageWithContentsOfFile:(NSString *)path

- (id)initWithContentsOfFile:(NSString*)path;

RootViewController.m

#import "RootViewController.h"
#import "UIColor+RandomColor.h"

@interface RootViewController ()
@property (nonatomic,retain) UIImageView *imgView;

@end

@implementation RootViewController

- (void)dealloc
{
    [_imgView release];

    [super dealloc];

}

- (void)viewDidLoad {
    [super viewDidLoad];
   

#pragma mark -- UImageView --

    self.imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"1.png"]];   PNG格式的圖片能夠省略擴展名

    // 若是設置_imgView.frame,則圖片大小爲frame大小，發生形變。若不設置，則frame的大小爲圖片的大小。
//    _imgView.frame = CGRectMake(0, 0, 371, 600);
    NSLog(@"%.f %.f", _imgView.frame.size.width, _imgView.frame.size.height);
    [self.view addSubview:_imgView];

    [_imgView release];

#pragma mark -- 使用UIImageView播放動畫圖片gif --
    UIImageView * animationImage = [[UIImageView alloc] init];
    animationImage.frame = CGRectMake(100, 350, 150, 150);
   
    NSMutableArray * imagesArr = [NSMutableArray array];
    for (int i = 1; i<4; i++) {
        UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"tu%d.tiff", i]];
        [imagesArr addObject:image];
    }
   
    animationImage.animationImages = imagesArr;
    animationImage.animationDuration = 0.1;
    [animationImage startAnimating];
//    [animationImage stopAnimating];
   
    [self.view addSubview:animationImage];

    [animationImage release];

}

...

@end

---

4、⼿勢識別器

     ⼿勢識別器是對觸摸事件作了封裝，咱們⽆需⾃⼰去判斷某個⼿勢 是否觸發，⼿勢識別器本⾝起到了識別做⽤，咱們把重⼼放在識別之 後要作什麼操做上⾯。

     ⼿勢識別器有7個⼦類,⼀旦指定的⼿勢被識別，咱們能夠執⾏咱們⾃⼰定義好的操做。

• 輕拍⼿勢:UITapGestureRecognizer

• 平移⼿勢:UIPanGestureRecognizer

• 輕掃⼿勢: UISwipeGestureRecognizer

• 捏合⼿勢:UIPinchGestureRecognizer

• 旋轉⼿勢:UIRotationGestureRecognizer

• ⻓按⼿勢:UILongPressGestureRecognizer

• 屏幕邊界平移⼿勢: UIScreenEdgePanGestureRecognizer(iOS7+)

RootViewController.m 

@interface RootViewController ()
@property (nonatomic,retain) UIImageView *imgView;
@property (nonatomic, retain) UIView *tapView;
@end

@implementation RootViewController

- (void)dealloc
{
    [_imgView release];
    [_tapView release];
    [super dealloc];

}

- (void)viewDidLoad {

    [super viewDidLoad];   

#pragma mark -- UIGestureRecognizer --
    UIView * tapView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
    tapView.backgroundColor = [UIColor grayColor];
    self.tapView = tapView;
    [self.view addSubview:tapView];
    [tapView release];
    //輕拍手勢
    UITapGestureRecognizer * tapGR = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapOnce:)];
    //添加手勢
    [self.tapView addGestureRecognizer:tapGR];
    [tapGR release];
   
    //長按手勢
    UILongPressGestureRecognizer * longGR = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longPress:)];
    [self.tapView addGestureRecognizer:longGR];
    [longGR release];
   
    //平移手勢
    UIPanGestureRecognizer * panGR = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];
    [self.tapView addGestureRecognizer:panGR];
   
//    [animationImage addGestureRecognizer:panGR];
    [panGR release];
   
    //捏合手勢
    UIPinchGestureRecognizer * pinchGR = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(pinch:)];
    [self.tapView addGestureRecognizer:pinchGR];
    [pinchGR release];
   
    //旋轉
    UIView * aView = [[UIView alloc] initWithFrame:CGRectMake(0, 100, 100, 100)];
    aView.backgroundColor = [UIColor brownColor];
    [self.view addSubview:aView];
    [aView release];
    UIRotationGestureRecognizer * rotationGR = [[UIRotationGestureRecognizer alloc] initWithTarget:self action:@selector(rotation:)];
    [aView addGestureRecognizer:rotationGR];
    [rotationGR release];

   

    //輕掃 

//    UISwipeGestureRecognizer
   
    //屏幕邊界平移手勢

//    UIScreenEdgePanGestureRecognizer

}

- (void)tapOnce:(UITapGestureRecognizer *)GR
{
//    self.tapView.hidden = YES;
//    self.tapView.backgroundColor = [UIColor randomColor];
    NSLog(@"");
}

- (void)longPress:(UILongPressGestureRecognizer *)GR
{
    GR.view.backgroundColor = [UIColor randomColor];
}

- (void)pan:(UIPanGestureRecognizer *)GR
{
   
    CGPoint translation = [GR translationInView:GR.view];
    NSLog(@"%@", NSStringFromCGPoint(translation));
    CGPoint center = GR.view.center;
    center.x += translation.x;
    center.y += translation.y;
    GR.view.center = center;
   
    [GR setTranslation:CGPointMake(0, 0) inView:GR.view];

}

- (void)pinch:(UIPinchGestureRecognizer *)GR
{
   
    GR.view.transform = CGAffineTransformScale(GR.view.transform, GR.scale, GR.scale);
    GR.scale = 1;
   
}

- (void)rotation:(UIRotationGestureRecognizer *)GR
{
    //第二個參數是弧度
    //180度 3.1415926 M_PI
    GR.view.transform = CGAffineTransformRotate(GR.view.transform, GR.rotation);
    GR.rotation = 0;

}

...

@end

    利用transform屬性能夠修改控件的位移（位置）、縮放、旋轉
   
    建立一個transform屬性

    CGAffineTransform CGAffineTransformMakeTranslation(CGFloat tx,  CGFloat ty) ;

    CGAffineTransform CGAffineTransformMakeScale(CGFloat sx, CGFloat sy);

    CGAffineTransform CGAffineTransformMakeRotation(CGFloat angle)

    (注意：angle是弧度制，並非角度制)
   
    在某個transform的基礎上進行疊加

    CGAffineTransform CGAffineTransformTranslate(CGAffineTransform t, CGFloat tx, CGFloat ty);

    CGAffineTransform CGAffineTransformScale(CGAffineTransform t, CGFloat sx, CGFloat sy);
    CGAffineTransform CGAffineTransformRotate(CGAffineTransform t, CGFloat angle);
   
    清空以前設置的transform屬性

    view.transform = CGAffineTransformIdentity;