仿腾讯新闻下拉表格刷新数据

在开发一个项目时,需要刷新一个UITableView的数据,看到腾讯新闻的那种下拉table释放就刷新数据的体验效果蛮好,所以就仿照腾讯新闻,做了一个这样的Demo,有需要的朋友可以下载。
原理是这样的:放一个UIView在表格的上面,同时,这个UIView会被UISegmentedControl挡住,看不到,当下拉表格的时候,触发scrollViewDidScroll事件,在这个事件中,把UIView的位置随着拖动一起改变,然后当拖动到一定程度时,提示用户松开进行数据的刷新,当用户松开之后,触发scrollViewDidEndDragging事件,进行数据刷新,当刷新完毕之后,将UIView的位置复原。
效果图如下:
开始界面

 

拖动表格界面

2


释放理解刷新界面
3

 

正在刷新界面
4

 

代码如下:
RefreshNewsViewController.h

//
//  RefreshNewsViewController.h
//  RefreshNews
//
//  Created by walkman Apple on 11-1-6.
//  Copyright http://www.shouji138.com 手机主题下载 2011. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface RefreshNewsViewController : UIViewController <UITableViewDelegate,UITableViewDataSource>{
 UITableView *tableview;//表格
 UISegmentedControl *titleSegment;
 UIView* refreshView;
 UILabel *statusLabel;
 UIImageView *imgview;
 BOOL isShoudRefresh;
 UIImageView *SegmentBgView;
 UIActivityIndicatorView *activeView;
 bool isFinished;
 NSInteger segSelectedIndex;
}
@property(nonatomic,retain)  UITableView *tableview;

-(void)BeginGetData;
-(void)BindData;
-(void)hiddenview;
-(void)CallWS;
-(void)BeginThread;
-(void)UpdateUI;

@end

 

RefreshNewsViewController.m

//
//  RefreshNewsViewController.m
//  RefreshNews
//
//  Created by walkman Apple on 11-1-6.
//  Copyright http://www.shouji138.com 2011. All rights reserved.
//

#import "RefreshNewsViewController.h"
#define ROWSCOUNT 50
@implementation RefreshNewsViewController
@synthesize tableview;


/*
// The designated initializer. Override to perform setup that is required before the view is loaded.
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {
    if ((self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil])) {
        // Custom initialization
    }
    return self;
}
*/

/*
// Implement loadView to create a view hierarchy programmatically, without using a nib.
- (void)loadView {
}
*/


/*
// Implement viewDidLoad to do additional setup after loading the view, typically from a nib.
*/
 - (void)viewDidLoad {
    [super viewDidLoad];
  self.title = @"仿腾讯新闻下拉刷新数据演示"; 
 
  titleSegment = [[UISegmentedControl alloc]initWithFrame:CGRectMake((self.view.bounds.size.width-328)/2,0, 328, 30)];
  [titleSegment insertSegmentWithTitle:@"时政新闻" atIndex:0 animated:NO];
  [titleSegment insertSegmentWithTitle:@"娱乐新闻" atIndex:1 animated:NO];
  titleSegment.segmentedControlStyle = UISegmentedControlStyleBar;
  titleSegment.selectedSegmentIndex = 0;
  [titleSegment addTarget:self action:@selector(titleSegmentClick:) forControlEvents:UIControlEventValueChanged];
  [self.view addSubview:titleSegment];
 
  SegmentBgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"segbg.png"]];
  SegmentBgView.frame = CGRectMake(0, 0, 160, 30);
  [self.view addSubview:SegmentBgView];
 
  tableview = [[UITableView alloc] initWithFrame:CGRectMake(0, 30, 320, 360) style:UITableViewStylePlain];
  tableview.delegate = self;
  tableview.dataSource = self;
  tableview.rowHeight = 35;
  tableview.sectionHeaderHeight = 35;
  [tableview setBackgroundColor:[UIColor clearColor]];
 
  [self.view addSubview:tableview]; 
 
  self.navigationController.toolbar.barStyle = UIBarStyleBlackOpaque;
 
  refreshView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 30)];
  refreshView.backgroundColor = [UIColor clearColor];
  imgview = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"1.png"]];
  imgview.frame = CGRectMake(78,6, 20, 20);
  [refreshView addSubview:imgview];
  activeView = [[UIActivityIndicatorView alloc]
       initWithFrame:CGRectMake(55,6, 20, 20)];
  [activeView setActivityIndicatorViewStyle:UIActivityIndicatorViewStyleGray];
  [activeView  stopAnimating]; 
  [refreshView addSubview:activeView];
 
 
  statusLabel = [[UILabel alloc]initWithFrame :CGRectMake(100,0, 220, 30)];
  statusLabel.text = @"下拉刷新...";
  statusLabel.backgroundColor = [UIColor clearColor];
  [refreshView addSubview:statusLabel];
  [self.view addSubview:refreshView];
  [self.view bringSubviewToFront:titleSegment];
  [self.view bringSubviewToFront:SegmentBgView]; 
  segSelectedIndex = 0;
  [self BeginGetData];
 
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{ 
 if (isShoudRefresh) {
  if (scrollView.contentOffset.y>-30) {
   return;
  }
 }
 //NSLog(@"%@,%f",@"scrollViewDidScroll",scrollView.contentOffset.y);
 refreshView.frame = CGRectMake(0, -scrollView.contentOffset.y, 320, 30);
 
 if (isShoudRefresh) {
  return;
 }
 
 if (scrollView.contentOffset.y<-30) {  
  statusLabel.text = @"释放立即刷新...";
  [UIView beginAnimations:nil context:nil];
  [UIView setAnimationDuration:0.2];  
  imgview.transform = CGAffineTransformMakeRotation(-3.14);
  [UIView commitAnimations];
 }
 else {
  
  statusLabel.text = @"下拉刷新...";
  [UIView beginAnimations:nil context:nil];
  [UIView setAnimationDuration:0.2];  
  imgview.transform = CGAffineTransformMakeRotation(0);
  [UIView commitAnimations];
 }
 
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{
 
 //NSLog(@"%@,%f",@"scrollViewDidEndDragging",scrollView.contentOffset.y);
 if (scrollView.contentOffset.y<-30) {
  isShoudRefresh = YES;
 }
 else {
  isShoudRefresh = NO;
 }
 
 if (isShoudRefresh && isFinished ) {
  [activeView  startAnimating];
  statusLabel.text = @"正在刷新...";
  tableview.scrollEnabled = NO;
  
  [UIView beginAnimations:nil context:nil];
  [UIView setAnimationDuration:0.5];
  refreshView.frame = CGRectMake(0, 30, 320, 30);
  CGRect rect = tableview.frame;
  rect.origin.y +=30;
  tableview.frame = rect;
  [UIView commitAnimations];
  [self BeginGetData];
 } 
}

-(void)titleSegmentClick:(id)sender{
 [UIView beginAnimations:nil context:nil];
 [UIView setAnimationDuration:0.2];
 SegmentBgView.frame = CGRectMake(titleSegment.selectedSegmentIndex*160,0, 160, 30);
 [UIView commitAnimations];
 segSelectedIndex = titleSegment.selectedSegmentIndex;
 if (titleSegment.selectedSegmentIndex ==0 ) {
 }
 else if(titleSegment.selectedSegmentIndex ==1) {
 }
 [self BindData]; 
}


-(void)BindData{
 [UIView beginAnimations:nil context:nil];
 [UIView setAnimationDuration:0.5];
 imgview.transform = CGAffineTransformMakeRotation(0);
 [UIView commitAnimations];
 [self performSelector:@selector(hiddenview) withObject:nil afterDelay:0.5];
 [tableview reloadData]; 
}
-(void)hiddenview{
 isShoudRefresh = NO;
 statusLabel.text = @"下拉刷新...";
 tableview.scrollEnabled = YES;
 [activeView stopAnimating];
 [UIView beginAnimations:nil context:nil];
 [UIView setAnimationDuration:0.5];
 tableview.frame = CGRectMake(0, 30, 320, 360);
 refreshView.frame = CGRectMake(0, 0, 320, 30);
 [UIView commitAnimations]; 
}
-(void)BeginThread
{
 NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init]; 
 isFinished = NO; 
 [self performSelectorInBackground:@selector(CallWS) withObject:nil];
 [self performSelectorOnMainThread:@selector(UpdateUI) withObject:nil waitUntilDone:YES];
 [pool release];
}
-(void)BeginGetData{
 [NSThread detachNewThreadSelector:@selector(BeginThread) toTarget:self withObject:nil];
}
-(void)UpdateUI

 NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init]; 
 if(!(isFinished))
 {
  [NSTimer scheduledTimerWithTimeInterval:0.2 target:self selector:@selector(UpdateUI)
            userInfo:nil repeats:NO];
  NSLog(@"waiting.....");
    }
 else {
  [self BindData];
 }
 [pool release];
}

-(void)CallWS

 NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];   
 //这里调用网络数据,是一个耗时的操作。

 isFinished = YES;
 [pool release];
}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
 return 1;
}


- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
 return ROWSCOUNT;
}


// Customize the appearance of table view cells.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
   
 //NSLog(@"%@",@"begin");
    static NSString *CellIdentifier = @"Cell";
   
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellIdentifier] autorelease];
    }
    cell.textLabel.text = [NSString stringWithFormat: @"第%d行%@",indexPath.row+1,segSelectedIndex==0?@"时政新闻":@"娱乐新闻"]; 
 cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;   
    return cell;
}

 

/*
// Override to allow orientations other than the default portrait orientation.
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
    // Return YES for supported orientations
    return (interfaceOrientation == UIInterfaceOrientationPortrait);
}
*/

- (void)didReceiveMemoryWarning {
 // Releases the view if it doesn't have a superview.
    [super didReceiveMemoryWarning];
 
 // Release any cached data, images, etc that aren't in use.
}

- (void)viewDidUnload {
 // Release any retained subviews of the main view.
 // e.g. self.myOutlet = nil;
}


- (void)dealloc {
 [tableview release];
 [titleSegment release];
 [refreshView release];
 [activeView release];
 [statusLabel release];
 [imgview release];
 [SegmentBgView release];
    [super dealloc];
}

@end


其中用到了iPhone的动画效果,用户体验效果不错。有兴趣的朋友可以下载。
地址:
http://www.shouji138.com/files/RefreshNews.zip
也欢迎光临作者的小站:手机主题 http://www.shouji138.com/
欢迎与作者交流:haolinks#163.com

posted @ 2011-01-06 14:31  漫步walkman  阅读(1700)  评论(3编辑  收藏  举报