2013年9月2日月曜日

iOS 下へ引っ張って更新(UIRefreshControlを使う)

Twitterなどでよく見られるUIで、新しいアイテムを手動で更新する場合にスクロールして一番上の位置より 下へ引っ張り新しいアイテムを上位にのせるというようなUIのことです。 iOS6より UIRefreshControlというのが登場した模様で簡単に実装できそうです。

特徴

  • storyboardなどUI側の操作は必要ない
  • 下に引っ張って更新するタイプのみ, Gmailみたいに上に引っ張って古いアイテムを取得するタイプのものはサポートしていない
スクリーンショットがうまくとれませんでした。他にもいろいろな方がのせているので参考に。

Sample

UIはテーブルをひとつ用意したものだけです。それ以外は何もありません。

Header

@interface ViewController : UIViewController
@property(nonatomic, strong)NSArray *items;
@property (weak, nonatomic) IBOutlet UITableView *tableView;
@property(nonatomic) UIRefreshControl *refreshControl;
@end&nbsp
UIRefreshControlが入りました。

Code

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
 self.items = [[NSMutableArray alloc] init];
    [self addData:30];
    
   self.refreshControl = [[UIRefreshControl alloc] init];
   [self.refreshControl addTarget:self action:@selector(controlRefresh:) forControlEvents:UIControlEventValueChanged];
    
    [self.tableView addSubview:self.refreshControl];
    self.tableView.dataSource = self;
    self.tableView.delegate = self;
    [self loadItem];
}

-(void)addData:(int)number
{
    NSMutableArray *tmps = [[NSMutableArray alloc] initWithArray:self.items];
    NSUInteger current = [self.items count];
    
    for ( int i=0; i < number; i++ )
    {
        [tmps addObject:[NSNumber numberWithInt:current+i]];
    }
    self.items =[NSArray arrayWithArray:tmps];
}

-(void)loadItem
{
    self.items = [self.items sortedArrayUsingComparator:^NSComparisonResult(id obj1, id obj2) {
        return [obj2 intValue] - [obj1 intValue];
    }];
    [self.tableView reloadData];
}


- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

#pragma mark -
#pragma mark UIRefreshControl
-(void)controlRefresh:(UIRefreshControl *)sender
{
    [self addData:20];
    [self loadItem];
    // Update
    [self.refreshControl endRefreshing];
}

#pragma mark -
#pragma mark UITableViewDataSource, UITableViewDelegate
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 1;
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return [self.items count];
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = [self.tableView dequeueReusableCellWithIdentifier:@"Cell"];
    if ( cell == nil )
    {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"Cell"];
    }
    cell.textLabel.text = [NSString stringWithFormat:@"%d", [[self.items objectAtIndex:indexPath.row] intValue]];
    return cell;
}
@end
テーブルに数字を突っ込んでいます。逆順に並べ替えるコードを入れています。 -(void)controlRefresh:(UIRefreshControl *)senderというのが特徴です。これを実装しますselectorで指定したメソッドなので名前はどうとでもなります。 ここで更新が発生した場合の処理を書きます。 更新終了後endRefreshing を呼び出します。それで終了です。

0 件のコメント:

コメントを投稿