ここ半年以上、ウェブから離れていたので、その間に溜め込んだTIPSのメモ。
Objective-Cは厳格だけど楽しいです。あとXcode4からデバックが相当楽になりました。
と、余談は置いといて、UIScrollView でスクロールしたときに、表示されているそれぞれに視差をつけて動かすとき、真ん中を基準にして単純に可動範囲の横幅を足すのが一番楽でした。
iPadだと、実際の横幅は1024pxになるところを、表示させているOBJECT_Aには、可動域を1280pxとして動かす。
こうすると、OBJECT_Aが背景と同期していないように動いて、まるで視差があるように見えます。
何個かオブジェクトを配置して、別々の値を設定しておくと、なかなか面白い動きをしてくれます。
多分、GUINNESS WORDL RECORDSのアプリとかに近い動きになるはず。
今回やった方法は、UIScrollViewをベースのUIViewに配置して、UIScrollViewDelegateからscrollViewDidScrollで吐き出される値をそれぞれのオブジェクトに渡すというもの。
[ BaseView.h ]（← UIViewControllerにaddSubview:されたUIViewと想定）
#import
@interface BaseView : UIView {
// 基本となるUIScrollView
UIScrollView *scrollView;
NSMutableArray *pages;
}
- (void)initObject;
- (int)currentPage;
@end
[ BaseView.m ]
#import "BaseView.h"
#import "PageView.h"
#define NUM_OF_PAGES 5 // 5ページあると想定
@implementation BaseView
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
[self initObject];
}
return self;
}
- (void)initObject {
CGRect rect = CGRectMake( 0.0f, 0.0f, 1024.0f, 768.0f );
scrollView = [[UIScrollView alloc] initWithFrame:rect];
scrollView.pagingEnabled = YES;
scrollView.delegate = self;
scrollView.contentSize = CGSizeMake( NUM_OF_PAGES * rect.size.width, rect.size.height );
[self addSubview:scrollView];
pages = [[NSMutableArray alloc] initWithCapacity: NUM_OF_PAGES];
for( int i = 0; i < NUM_OF_PAGES; i++ ) {
PagaView *page = [[UIPageView alloc] initWithFrame:rect];
if( page.superview == nil ) {
CGRect viewFrame = page.frame;
viewFrame.origin.x = viewFrame.size.width * i;
viewFrame.origin.y = 0;
page.frame = viewFrame;
[pages addObject:page];
[scrollView addSubview:page];
}
}
- (int)currentPage {
CGFloat pageWidth = scrollView.frame.size.width;
int page = floor((scrollView.contentOffset.x - pageWidth / 2) / pageWidth) + 1;
return page;
}
- (void)scrollViewDidScroll:(UIScrollView *)sv {
int page = [self currentPage];
if( page < 0 ) return;
if( page >= NUM_OF_PAGES ) return;
PageView *view = [pages objectAtIndex:page];
if( view.superview != nil )
[view adjustObjectPosition:sv.contentOffset.x pageIndex:page]; // この値を元に視差をつける
}
[ PageView.h ]
#import
@interface PageView : UIView {
// 今回は、それぞれのオブジェクトに画像を当てはめる想定
UIImageView *aImage;
UIImageView *bImage;
UIImageView *cImage;
}
- (void)setupPageObject;
- (void)adjustObjectPosition:(float)xpos pageIndex:(int)index;
- (UIImageView *)makeImageView:(CGRect)rect withImageName:(NSString *)imageName
@end
[ PageView.m ]
#import "PageView.h"
// それぞれの差異の値を設定
#define DIFF_A 500.0f
#define DIFF_B 300.0f
#define DIFF_C 100.0f
@implementation UIPageView
- (void)setupPageObject {
CGRect aRect = CGRectMake( 90.0f, 140.0f, 815.0f, 510.0f );
CGRect bRect = CGRectMake( 80.0f, 100.0f, 450.0f, 190.0f );
CGRect cRect = CGRectMake( 300.0f, 20.0f, 160.0f, 90.0f );
aImage = [self makeImageView:aRect withImageName:@"aImage.png"];
[self addSubview:aImage];
bImage = [self makeImageView:bRect withImageName:@"bImage.png"];
[self addSubview:bImage];
cImage = [self makeImageView:cRect withImageName:@"cImage.png"];
[self addSubview:cImage];
}
- (void)adjustObjectPosition:(float)xpos pageIndex:(int)index {
float pos = xpos - ((page + 1) * 1024.0f);
// 真ん中を基点としたそれぞれのX座標の差異
float moveValue_a = -((pos / 1024.0f) * DIFF_A) - (DIFF_A - 90.0f);
float moveValue_b = -((pos / 1024.0f) * DIFF_B) - (DIFF_B - 80.0f);
float moveValue_c = -((pos / 1024.0f) * DIFF_C) - (DIFF_C - 300.0f);
// 各画像にX座標を適応
aImage.frame = CGRectMake( moveValue_a, 140.0f, 815.0f, 510.0f );
bImage.frame = CGRectMake( moveValue_b, 100.0f, 450.0f, 190.0f );
cImage.frame = CGRectMake( moveValue_c, 20.0f, 160.0f, 90.0f );
}
- (UIImageView *)makeImageView:(CGRect)rect withImageName:(NSString *)imageName {
NSString *path = [[NSBundle mainBundle] pathForResource:imageName ofType:@""];
UIImage *img = [[UIImage alloc] initWithContentsOfFile:path];
UIImageView *imgView = [[UIImageView alloc] initWithFrame:rect];
imgView.image = img;
[img release];
return imgView;
}
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
[self setupPageObject];
}
return self;
}
- (void)dealloc {
[aImage removeFromSuperview];
[aImage release];
aImage = nil;
[bImage removeFromSuperview];
[bImage release];
bImage = nil;
[cImage removeFromSuperview];
[cImage release];
cImage = nil;
[super dealloc];
}
@end
こーゆーのは、Flashで培ったごまかしの技術が生かされる気がします。
COMMENT
0 Comment