2011年4月20日水曜日

[iOS]ナビゲーションバーをタップしてテーブルビューの先頭までスクロールさせる方法

画面最上部のステータス・バーをタップするとページ最上部まで一気にスクロールする」というiPhoneの小技があります。

例えば、Safariで縦に長いページを開いている時、ページの途中まで進んでステータスバーをタップすると...

そのページの最上部までスクロールします。


なかなか実用度の高い便利機能なのですが、「ステータス・バー」を非表示にしにしているアプリだとこの機能は使えません。



ステータス・バーのかわりに、ナビゲーション・バー (のタイトル)をタップして最上部までスクロールさせる方法をメモしておきます。


上の画像の場合だと、「フレーム」というナビゲーションバーのタイトルをタップするとページの最上部まで一気にスクロールするようになります。


必要なのは大きく分けて下の2つです。

1. navigationItem.titleView をカスタマイズして独自のボタン(UIButton)を追加する
2. UIScrollViewを先頭までスクロールさせる。

@interface MyTableViewController <UITableViewController> {
}

- (void)scrollToTop;

@end



@implementation MyTableViewController

- (void)loadView {
    [super loadView];

    // ナビゲーションのタイトル用のボタン要素を作成する。
    // 独自のビューをセットするので、色やサイズなどはこちらで設定する必要がある。
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    button.backgroundColor = [UIColor clearColor];
    button.titleLabel.font =[UIFont boldSystemFontOfSize:16.0];
    [button setTitle:@"タイトル" forState:UIControlStateNormal];
    [button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];

    button.frame = CGRectMake(0.0, 0.0, 120.0,
                                                self.navigationController.navigationBar.frame.size.height);

    [button addTarget:self
                        action:@selector(scrollToTop)
       forControlEvents:UIControlEventTouchUpInside];

    self.navigationItem.titleView = button;
}

- (void)scrollToTop {
    // 先頭へスクロール
    [self.tableView scrollRectToVisible:CGRectMake(0, 0, 1, 1) animated:YES];
}

@end

0 件のコメント: