你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發綜合 >> iOS開發那些事-表視圖UI設計模式

iOS開發那些事-表視圖UI設計模式

編輯:IOS開發綜合
      軟件設計中有設計模式,在UI設計方面也有設計模式。由於表視圖的應用在iOS中極其廣泛,本節向大家介紹表視圖中兩個UI設計模式:分頁模式和下拉刷新(Pull-to-Refresh)模式。這兩種模式已經成為移動平台開發的標准。     分頁模式    

1

        分頁模式規范了移動平台進行大量數據請求的處理方式 。   下拉刷新模式   下拉刷新(Pull-to-Refresh)是重新刷新表視圖或列表,重新加載數據,這種模式廣泛用於移動平台。下拉刷新與分頁相反,當翻動屏幕到頂部時候,再往下拉屏幕程序就開始重新請求數據,表視圖表頭部分會出現等待指示器,請求結束表視圖表頭消失。下拉刷新模式帶有箭頭動畫效果。   2          在很多開源社區中都有下拉刷新的實現代碼,Github上的git://github.com/leah/PullToRefresh.git有一個下拉刷新的例子,可以供大家參考。   iOS6下拉刷新控件   隨著下拉刷新模式影響力的越來越大,蘋果不得不考慮把它列入自己的規范之中,並在iOS 6 API中推出了下拉刷新控件。iOS 6中的下拉刷新,有點像是在拉一個“膠皮糖”,當這個“膠皮糖”拉斷的時候之後會出現等待指示器。   3          iOS 6 之後UITableViewController添加了一個refreshControl屬性,這個屬性保持了一個UIRefreshControl的對象指針。UIRefreshControl就是iOS 6為表視圖實現下拉刷新而提供的。UIRefreshControl類目前只能應用於表視圖畫面,其它視圖不能使用。該屬性與UITableViewController配合使用,關於下拉刷新布局等問題可以不必考慮,UITableViewController會將其自動放置於表視圖中。   我們通過一個例子來了解一下UIRefreshControl控件的使用。參考創建簡單表視圖的案例,創建工程“RefreshControlSample”,然後修改代碼ViewController.h。   [cpp]  #import <UIKit/UIKit.h>       @interface ViewController : UITableViewController      @property (nonatomic,strong) NSMutableArray* Logs;      @end     #import <UIKit/UIKit.h>   @interface ViewController : UITableViewController   @property (nonatomic,strong) NSMutableArray* Logs;   @end     Logs屬性存放了NDate日期列表,用於在表視圖中顯示需要的數據,ViewController.m中的初始化代碼如下:   [cpp] - (void)viewDidLoad      {      [super viewDidLoad];      //初始化變量和時間       self.Logs = [[NSMutableArray alloc] init];      NSDate *date = [[NSDate alloc] init];      [self.Logs addObject:date];      //初始化UIRefreshControl       UIRefreshControl *rc = [[UIRefreshControl alloc] init];      rc.attributedTitle = [[NSAttributedString alloc]initWithString:@”下拉刷新”];      [rc addTarget:self action:@selector(refreshTableView) forControlEvents:UIControlEventValueChanged];      self.refreshControl = rc;      }     - (void)viewDidLoad   {   [super viewDidLoad];   //初始化變量和時間   self.Logs = [[NSMutableArray alloc] init];   NSDate *date = [[NSDate alloc] init];   [self.Logs addObject:date];   //初始化UIRefreshControl   UIRefreshControl *rc = [[UIRefreshControl alloc] init];   rc.attributedTitle = [[NSAttributedString alloc]initWithString:@”下拉刷新”];   [rc addTarget:self action:@selector(refreshTableView) forControlEvents:UIControlEventValueChanged];   self.refreshControl = rc;   }     viewDidLoad方法中初始化了一條當前時間的模擬數據。UIRefreshControl的構造方式是init。attributedTitle屬性用於下拉控件顯示標題文本。UIRefreshControl的addTarget: forControlEvents:方法能夠通過編程方式為UIControlEventValueChanged事件添加處理方法。refreshTableView是UIControlEventValueChanged事件的處理方法,refreshTableView方法的代碼如下:   [cpp]  -(void) refreshTableView      {      if (self.refreshControl.refreshing) {      self.refreshControl.attributedTitle = [[NSAttributedString alloc]initWithString:@”加載中…”];      //添加新的模擬數據       NSDate *date = [[NSDate alloc] init];      //模擬請求完成之後,回調方法callBackMethod       [self performSelector:@selector(callBackMethod:) withObject:date afterDelay:3];      }      }     -(void) refreshTableView   {   if (self.refreshControl.refreshing) {   self.refreshControl.attributedTitle = [[NSAttributedString alloc]initWithString:@”加載中…”];   //添加新的模擬數據   NSDate *date = [[NSDate alloc] init];   //模擬請求完成之後,回調方法callBackMethod   [self performSelector:@selector(callBackMethod:) withObject:date afterDelay:3];   }   }     UIRefreshControl的refreshing屬性可以判斷控件是否還處於刷新中的狀態,刷新中狀態的圖標是我們常見的等待指示器,在這個階段要將顯示標題文本設置為“加載中…”。接下來應該是進行網絡請求或者數據庫查詢的操作。這些操作完成後應用會回調callBackMethod方法,本案例涉及雲端的技術,我們使用[self performSelector:@selector(callBackMethod:) withObject:date afterDelay:3]語句延時調用callBackMethod方法來模擬實現。   回調方法callBackMethod:的代碼如下。   [cpp]  -(void)callBackMethod:(id) obj      {      [self.refreshControl endRefreshing];      self.refreshControl.attributedTitle = [[NSAttributedString alloc]initWithString:@”下拉刷新”];      [self.Logs addObject:(NSDate*)obj];      [self.tableView reloadData];      }     -(void)callBackMethod:(id) obj   {   [self.refreshControl endRefreshing];   self.refreshControl.attributedTitle = [[NSAttributedString alloc]initWithString:@”下拉刷新”];   [self.Logs addObject:(NSDate*)obj];   [self.tableView reloadData];   }     在請求完成的時候endRefreshing方法可以停止下拉刷新控件,回到初始狀態,顯示的標題文本為“下拉刷新”。[self.tableView reloadData]語句是重新加載表視圖。   實現UITableViewDataSource的兩個方法代碼如下:   [cpp]  - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {      return 1;      }      - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {      return [self.Logs count];      }      - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {      static NSString *CellIdentifier = @”Cell”;      UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];      if (cell == nil) {      cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellIdentifier];      }      NSDateFormatter *dateFormat = [[NSDateFormatter alloc] init];      [dateFormat setDateFormat: @"yyyy-MM-dd HH:mm:ss zzz"];      cell.textLabel.text = [dateFormat stringFromDate: [self.Logs objectAtIndex:[indexPath row]]];      cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;      return cell;      }     - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {   return 1;   }   - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {   return [self.Logs count];   }   - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {   static NSString *CellIdentifier = @”Cell”;   UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];   if (cell == nil) {   cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellIdentifier];   }   NSDateFormatter *dateFormat = [[NSDateFormatter alloc] init];   [dateFormat setDateFormat: @"yyyy-MM-dd HH:mm:ss zzz"];   cell.textLabel.text = [dateFormat stringFromDate: [self.Logs objectAtIndex:[indexPath row]]];   cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;   return cell;   }  
  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved