fb_license

技術標籤

@selector (1) 初使化區塊 (1) 物件 (1) 物件導向 (2) 型別 (4) 封裝 (1) 流程控制 (1) 陣列 (3) 推論型別 (2) 實機測試 (1) 蓋索林(gasolin) (1) 模組 (1) 憑證 (1) 轉型 (1) 羅康鴻 (121) 類別 (1) 變數 (5) Accelerometer (1) ActiveRecord (1) Activity (1) AFNetworking (1) alloc (1) Android (3) Animation (1) App (1) App ID (1) APP上傳 (1) ASP.NET (1) AVAudioPlayer (1) block (1) C# (2) class (1) CLLocationManager (1) CLLocationManagerDelegate (1) CMMotionManager (4) Controller (1) delegate (1) DELETE語法 (1) Device Motion資料 (1) Dialog (1) DropDownList (1) dynamic language (2) Facebook SDK (9) FBRequest (5) FBRequestConnection (2) FMDB (1) Gesture Recognizers (6) GROUP BY (2) Gyro (1) HAVING (1) IBAction (1) IBOutlet (1) id (3) inheritance (1) init (1) Insert (1) instance variable (1) Interface Builder (1) iOS (70) iOS idea (7) iOS Introduction (1) Layout (1) Magnetometer (1) Menu (2) Method (2) MKMapView (1) MKPointAnnotation (1) MS SQL (5) Nil (1) NSArray (1) NSDictionary (1) NSError (1) NSFileManager & .plist (1) NSMutableArray (1) NSMutableDictionary (1) NSNotificationCenter (1) NULL (1) object (2) Objective-C (16) Objective-C idea (1) ORDER BY (1) Parameter (1) property (1) protocol (2) Provisioning (1) Proximate Sensor (1) Q and A (2) R類別 (1) Rails (9) RESTful SOA (9) Ruby (8) Scene (1) SEELECT (1) Segue (2) SEL (1) SELECT語法 (1) Shake (1) Simulator (1) SOA (8) SQL (6) SQL Server (5) SQL函數 (1) SQL彙總函數 SQL (1) SQLite (1) Storyboard (1) Style (1) Swift (1) Table (1) target & action (1) Theme (1) Toast (1) TRUNCATE TABLE語法 (1) UIActionSheet (1) UIActionSheetDelegate (1) UIActivityIndicatorView (1) UIAlertView (1) UIBarButtonItem (1) UIButton (1) UICollectionView (1) UICollectionViewDataSource (1) UIControl (9) UIDatePicker (1) UIImage (1) UIImagePickerController (2) UIImagePickerControllerDelegate (2) UIImageView (1) UILabel (1) UILongPressGestureRecognizer (1) UINavigationController (2) UIPanGestureRecognizer (1) UIPinchGestureRecognizer (1) UIProgressView (1) UIResponder (1) UIRotationGestureRecognizer (1) UISegmentedControl (1) UISlider (1) UIStepper (1) UISwipeGestureRecognizer (1) UISwitch (1) UITabBarController (1) UITableView (1) UITableViewDataSource (1) UITapGestureRecognizer (1) UITextField (1) UITextFieldDelegate (1) UITextView (2) UITextViewDelegate (1) UIToolBar (1) UIView (8) UIWebView (1) UPDATE語法 (1) var (2) VB.NET (7) View (4) WHERE子句 (1) XML (1)

2014/03/30

[iOS] UINavigationController


我是UINavigationController,我可以幫你以下一頁、下一頁的方式導覽頁面,當然也可以依序退回上一頁







第1步:建立一個名為"UINavigationController"的"Single View Application"專案。

第2步:刪除Main.storyboard上預設的ViewController,同時刪除ViewController.h與ViewController.m檔

第3步:加入UINavigationController

  • 於Main.storyboard中加入UINavigationController,因目前的Main.storyboard中無任何Controller,因此會自動被預設為啟動的Controller

  • 刪除UINavigationController預設的UITableController,選取Root View Controller後按delete鍵刪除




第4步:建立台北車站、善導寺與忠孝新生等ViewController

  • 加入3個ViewController至Main.storyboard中
  • 在台北車站TaipeiViewController中加入UILabel,設定文字為"台北車站",並加入下一站Button
  • 在善導寺ShandaoViewController中加入UILabel,設定文字為"善導寺",並加入下一站與上一站的Button
  • 在忠孝新生ZhongxiaoViewController中加入UILabel,設定文字為"忠教新生",並加入上一站的Button

  • 並分別建立TaipeiViewController、ShandaoViewController與ZhangxiaoViewController類別,皆繼承自UIViewController

  • 將TaipeiController類別與畫面上的ViewController對應起來
  • 將ShandaoController類別與畫面上的ViewController對應起來,同時在Storyboard ID處設定其ID為"shandao",後續將以程式的方式透過此ID取得ShandaoViewController對應畫面,才能從台北車站轉移到善導寺頁面
  • 將ZhongxiaoController類別與畫面上的ViewController對應起來,同時在Storyboard ID處設定其ID為"zhongxiao",後續將以程式的方式透過此ID取得ZhongxiaoViewController對應畫面,才能從善導寺轉移到忠孝新生頁面 



第5步:設定台北車站ViewController為預設Controller

  • 對UINavigationController按右鍵,托拉root view controller至此新的ViewController上,以成為預設的ViewController

第6步:加入至下一站與回上一站的程式

  • 對台北車站TaipeiViewController加入下一站至善導寺ShandaoViewController的功能。於TaipeiViewController畫面中對"下一站"按鈕的Touch Inside Up綁定IBAction,加入next:方法,於next:方法中透過pushController:訊息至下一站善導寺ShandaoViewController
TaipeiViewController.m

- (IBAction)next:(id)sender { //透過目前controller所在的navigationController, //其所在的storyboard找出Storyboard ID為shandao的Controller, UIViewController * s = [self.navigationController.storyboard instantiateViewControllerWithIdentifier:@"shandao"]; //透過navigationController, //傳送pushViewController:animated, //至下一個善導寺站頁面, //第1個ViewController參數即為下一個善導寺Shandao的Controller, //其中的animated參數為YES, //則會以動畫方式轉換頁面。 [self.navigationController pushViewController:s animated:YES]; }
  • 對善導寺ShandaoViewController加入下一站至忠孝新生ZhongxiaoViewController的功能。於ShandaoViewController畫面中對"下一站"按鈕的Touch Inside Up綁定IBAction,加入next:方法,於next:方法中透過pushController:訊息至下一站忠孝新生ZhangxiaoViewController
ShandaoViewController.m

- (IBAction)next:(id)sender { //透過目前controller所在的navigationController, //其所在的storyboard找出Storyboard ID為zhongxiao的Controller, UIViewController * z = [self.navigationController.storyboard instantiateViewControllerWithIdentifier:@"zhongxiao"]; //透過navigationController, //傳送pushViewController:animated, //至下一個忠孝新生站頁面, //第1個ViewController參數即為下一個忠孝新生Zhongxiao的Controller, //其中的animated參數為YES, //則會以動畫方式轉換頁面。 [self.navigationController pushViewController:z animated:YES]; }
  • 對善導寺ShandaoViewController加入回上一站的功能。於ShandaoViewController畫面中對"上一站"按鈕的Touch Inside Up綁定IBAction,加入pre:方法,於pre:方法中透過popViewControllerAnimated:訊息回至上一站
ShandaoViewController.m

- (IBAction)pre:(id)sender { //透過目前controller所在的navigationController, //傳遞popViewControllerAnimated訊息, //以回到上一站的頁面, //代入YES表示要以動畫方式轉換頁面。 [self.navigationController popViewControllerAnimated:YES]; }
  • 對忠孝新生ZhangxiaoViewController加入回上一站的功能。於ZhangxiaoViewController畫面中對"上一站"按鈕的Touch Inside Up綁定IBAction,加入pre:方法,於pre:方法中透過
       popViewControllerAnimated:訊息回至上一站

ZhongxiaoViewController.m

- (IBAction)pre:(id)sender { //透過目前controller所在的navigationController, //傳遞popViewControllerAnimated訊息, //以回到上一站的頁面, //代入YES表示要以動畫方式轉換頁面。 [self.navigationController popViewControllerAnimated:YES]; }


第7步:執行
  • 這時您可以透過UINavigationController的功能,以導覽的方式至下一站的頁面,並透過返回上一站的方式回到上一站的頁面。當然,在使用UINavigationController時,上方的Bar會在左邊出現一個返回的"< Back"按鈕,此按鈕也可回到上一頁,若想進一步修改變更此按鈕的行為或呈現方式,也是可以透過程式的設定來達到你的目的,比如說換個圖片按鈕等等。





檔案連結:UINavigationController.zip


更多的UINavigationController資訊: