iPhone 複数画像スライド、拡大縮小させる

完成系のイメージはiPhoneのアルバム。

複数画像がある状態で、
1.フリック動作で次の画像、前の画像がみれる
2.2本の指で拡大縮小ができる
3.(できれば)ステータスバーやツールバーが自動的に消える

を作りたいなーと思い、いろいろ調べながら試行錯誤した内容を書きます。

1.フリック動作で次の画像、前の画像がみれる

これはUIScrollViewのプロパティーを設定する。
pagingEnabled ページング
showsHorizontalScrollIndicator 横スクロールバー
showsVerticalScrollIndicator 縦スクロールバー
scrollsToTop ステータスバーをタップしたときにTOPに戻る(今回は横ページ遷移のため特にいらない)

各ページのx座標をずらしてaddSubviewすればOK
1ページ目 CGRextMake(0, 0, 320, 480);
2ページ目 CGRextMake(320, 0, 320, 480);
3ページ目 CGRextMake(640, 0, 320, 480);
のような感じで。


UIScrollView* scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];
    scrollView.pagingEnabled = YES;
    scrollView.showsHorizontalScrollIndicator = NO;// 横スクロールバー非表示
    scrollView.showsVerticalScrollIndicator = NO; // 縦スクロールバー非表示
    scrollView.scrollsToTop = NO; // ステータスバーのタップによるトップ移動禁止

    NSArray* imageNames = [NSArray arrayWithObjects:@"image2.jpeg", @"image1.jpeg", @"image3.jpeg", nil];
    int imageNum = [imageNames count];
    for (int i=0; i < imageNum; i++) {
        UIImage* image = [UIImage imageNamed:[imageNames objectAtIndex:i]];
        UIImageView* imageView = [[[UIImageView alloc] initWithImage:image] autorelease];
        CGSize size = CGSizeMake(MIN(image.size.width, 320), MIN(image.size.height, 480));
        imageView.frame = CGRectMake(320*i + (320 - size.width) / 2, 0 + (480 - size.height) / 2, size.width, size.height);
        [scrollView addSubview:imageView];
    }
    [scrollView setContentSize:CGSizeMake(320*imageNum, 480)];
    [self.view addSubview:scrollView];

0 件のコメント:

コメントを投稿

ReactNativeでAndroid対応する話

前提 ReactNativeでiOS版のアプリをリリースしていて、Android版をリリースする話 トラブルシューティング Build.VERSION_CODES.Q が存在しないエラー compileSdkVersionを29以上にすると解決 メモリー足りないエラー Execu...