縦にスワイプすると表情が入れ替わって、横にスワイプすると顔の色が入れ替わる。という感じでiPhoneアプリのサンプルコードを描いてみます。
動かすとこんな感じです
サンプルコード
#import “ViewController.h”
typedef enum int8_t {
FaceTypeSmile,
FaceTypeKiss,
FaceTypePoker,
FaceTypeAngry
} FaceType;
@interface Face : NSObject
@property UIColor *color;
@property UIImage *expression;
@end
@implementation Face @end
@interface ViewController ()
@property (strong, nonatomic) NSMutableArray *faceList;
@end
@implementation ViewController
– (void)viewDidLoad
{
[super viewDidLoad];
[self createFace];
[self createFaceView];
[self setupGesture];
}
– (void)createFace
{
self.faceList = [[NSMutableArray alloc] init];
NSArray *faceImages = @[[UIImage imageNamed:@”smile”],
[UIImage imageNamed:@”kiss”],
[UIImage imageNamed:@”porker”],
[UIImage imageNamed:@”angry”],];
for (int i=0; i<9; i++) {
Face *f = [[Face alloc] init];
f.color = [UIColor colorWithHue:0.1 * i saturation:0.8 brightness:1.0 alpha:1.0];
f.expression = faceImages[i % 4];
[self.faceList addObject:f];
}
}
– (void)createFaceView
{
float w = CGRectGetMaxX(self.view.bounds) / 3.0;
for (int i=0; i<self.faceList.count; i++) {
float x = (i%3) * w + 10;
float y = (i/3) * w + 100;
UIView *fView = [[UIView alloc] initWithFrame:CGRectMake(x, y, w * 0.8, w * 0.8)];
fView.backgroundColor = [self.faceList[i] color];
fView.layer.cornerRadius = w/2.0;
[self.view addSubview:fView];
UIImageView *expressionView = [[UIImageView alloc] initWithImage:[self.faceList[i] expression]];
[fView addSubview:expressionView];
}
}
– (void)setupGesture
{
NSUInteger directions[] = {UISwipeGestureRecognizerDirectionRight,
UISwipeGestureRecognizerDirectionLeft,
UISwipeGestureRecognizerDirectionUp,
UISwipeGestureRecognizerDirectionDown};
for (int i=0; i<4; i++) {
UISwipeGestureRecognizer *swipeUpDown = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipe:)];
[swipeUpDown setDirection:directions[i]];
[self.view addGestureRecognizer:swipeUpDown];
}
}
– (void)swipe:(UISwipeGestureRecognizer*)gr
{
CGPoint p = [gr locationInView:self.view];
UIView *selected;
for (UIView *f in self.view.subviews) {
if (CGRectContainsPoint(f.frame, p)) {
selected = f;
}
}
if (selected) {
UIView *b;
switch (gr.direction) {
case UISwipeGestureRecognizerDirectionDown:
b = [self.view hitTest:CGPointMake(selected.center.x, selected.center.y + 100) withEvent:nil];
break;
case UISwipeGestureRecognizerDirectionUp:
b = [self.view hitTest:CGPointMake(selected.center.x, selected.center.y – 100) withEvent:nil];
break;
case UISwipeGestureRecognizerDirectionLeft:
b = [self.view hitTest:CGPointMake(selected.center.x – 100, selected.center.y) withEvent:nil];
break;
case UISwipeGestureRecognizerDirectionRight:
b = [self.view hitTest:CGPointMake(selected.center.x + 100, selected.center.y) withEvent:nil];
break;
default:
break;
}
if (b && b != self.view) {
[self changeFaceA:selected faceB:b];
}
}
}
– (void)changeFaceA:(UIView*)a faceB:(UIView*)b
{
UIView *expressionA = a.subviews[0];
UIView *expressionB = b.subviews[0];
[self.view addSubview:expressionA];
[self.view addSubview:expressionB];
CGPoint o = expressionA.center;
expressionA.center = [self.view convertPoint:expressionA.center fromView:a];
expressionB.center = [self.view convertPoint:expressionB.center fromView:b];
if (a.center.x == b.center.x) {
[UIView animateWithDuration:0.3 animations:^{
expressionA.center = b.center;
expressionB.center = a.center;
} completion:^(BOOL finished) {
expressionA.center = o;
expressionB.center = o;
[a addSubview:expressionB];
[b addSubview:expressionA];
}];
} else {
CGPoint oa = a.center;
[UIView animateWithDuration:0.3 animations:^{
a.center = b.center;
b.center = oa;
} completion:^(BOOL finished) {
expressionA.center = o;
expressionB.center = o;
[a addSubview:expressionB];
[b addSubview:expressionA];
}];
}
}
@end