ストーリーボードを使用する

エントリー

最近リリースされたiOS 5は、プログラムインターフェイスを開発するための便利なメカニズム、 Storyboardを導入しました。 このメカニズムにより、画面間の遷移、Popover'aディスプレイ、さらにはテーブル内のセルの設定に関連するコードの量を大幅に削減できます。



タスク：ボタンをクリックして、現在のNavigationControllerに配置して次の画面を表示します。

ストーリーボードのないソリューション：

DDetailViewController* nextController = [DDetailViewController new]; [self.navigationController pushViewController:nextController animated:YES]; [nextController release];
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ストーリーボードを使用したソリューション：





以上です！ コードなし！

仕組み

プロジェクトで.storyboardファイルが作成され、そこからインターフェイス全体がロードされます。 シーンはこのファイル内に記述されています。





この矢印は、プログラムをオンにしたときに表示される最初の画面を示しています。 Storyboardに最初のコントローラーを追加した後、自動的に追加されます。将来、他のコントローラーにドラッグして、最初のコントローラーにすることができます。





この矢印は、コントローラー間の関係を表します。この場合、rootViewController NavigationControllerはFirstViewControllerに対応します。 この接続は、アウトレットとアクションの接続が設定されるのと同じ方法で設定できます（たとえば、Ctrlを押しながら1つのコントローラーから別のコントローラーに線を引くことができます）。





この矢印は、別のコントローラーへの移行を示します。 このような遷移は、以前の場合と同じ方法で簡単に確立できます。通信の開始は、ボタン、テーブルセルなど、目的のインターフェイス要素からすぐに移動できます。 彼女には設定があります-遷移の識別子とタイプ。



一見、すべてが非常に簡単に見えますが、疑問がすぐに生じます。あるコントローラーから別のコントローラーに移動するときにデータを転送する必要がある場合はどうすればよいでしょうか。

画面キャプチャ

コントローラー間の各遷移はUIStoryboardSegueクラスによって記述されます。そのインターフェイスには、 identifier 、 sourceViewController 、 destinationViewControllerの 3つのプロパティしかありません。 メソッドで渡されるのはこのクラスです

 - (void)prepareForSegue:(UIStoryboardSegue*)segue sender:(id)sender
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

このメソッドは、遷移が開始されたコントローラーで呼び出されます。この場合、FirstViewControllerになります。 次のように定義します。

 - (void)prepareForSegue:(UIStoryboardSegue*)segue sender:(id)sender { if ([[segue identifier] isEqualToString:@"showDetail"]) { [[segue destinationViewController] setText:@"SecondViewController"]; } else { [super prepareForSegue:segue sender:sender]; } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

識別子の値は、移行設定で設定されました。

iPadのストーリーボード

iPhoneでは、一度に1つのシーンしか実行できませんが、iPadではポップオーバーという形で例外があります。 ポップオーバーを表示するために、 UIStoryboardSegueの子孫であるUIStoryboardPopoverSegueクラスが使用されます。 このクラスでは、1つのプロパティが追加されます。popoverControllerは、現在のシーンが表示されるポップオーバーを常に返します。

コードミックス

すべてのトランジションをストーリーボードで説明できるわけではありません。 この場合、Storyboardをコントローラーの表示と切り替えの古い、馴染みのある方法と組み合わせることができます。 また、いくつかの小さな単純化があります。

• UIViewControllerクラスには、ストーリーボードを操作するための新しいメソッドとプロパティがあります。それらの1つは、シーンの現在のストーリーボードを返すstoryboardです。
  
  
• トランジションがストーリーボードに既に存在し、識別子が割り当てられている場合、UIViewControllerに属する次のメソッドを使用してトランジションを呼び出すことができます。
  
  

   - (void)performSegueWithIdentifier:(NSString*)identifier sender:(id)sender
        
        
  
          
          
          
        
  
      
          
          
          
        
        
  
          
          
          
        
  
      
       

  
  
  
• トランジションがストーリーボードに記述されていないが、コントローラーが記述されている場合、UIStoryboardに属するメソッドを使用してそれを呼び出すことができます。
  
  

   - (id)instantiateViewControllerWithIdentifier:(NSString*)identifier
        
        
  
          
          
          
        
  
      
          
          
          
        
        
  
          
          
          
        
  
      
       

  
  
  
• それ以外の場合は、古い方法を使用できます。
  
  

すてきなこと

記事の冒頭で約束したように、ストーリーボードでUITableViewCellを直接カスタマイズできるようになりました！ 既製のセルタイプから選択することも、独自のセルタイプを作成することもできます！



そのようなインターフェースの使いやすさは疑いますが、それまではもっと時間がかかりました。 コントローラーでUITableViewDataSourceメソッドを定義しない場合、コード内のラベルはまったく同じに見えます。 テーブルを動的に埋める必要がある場合は、古いメソッドを使用しますが、テーブルメソッドは

 - (id)dequeueReusableCellWithIdentifier:(NSString *)identifier
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

常にセルを返すようになりました。 キューにそのようなセルがない場合は、作成されます。

ストーリーボードをプロジェクトに追加する方法

• 新しいプロジェクトを作成する場合、すべてが簡単です-[ ストーリーボードを使用]チェックボックスをオンにします。
• インターフェイスの新しい部分を既存のプロジェクトに追加する必要があり、Storyboardを試してみたい場合は、次の手順を実行します：プロジェクトに新しいファイルを追加し、ウィザードで、iOS-> User InterfaceセクションでStoryboardファイルタイプを選択します。 次に、 UIStoryboardクラスを使用してシーンを作成します。
• 既存のプロジェクトのインターフェイス全体をストーリーボードに転送する場合は、上記の段落のように、そこでインターフェイス全体を転送し、プロジェクト設定で目的のターゲットを選択し、（概要）タブで、メインインターフェイスフィールドのすべてを削除し、メインストーリーボードにシーンの名前を入力します：
  
  

おわりに

もちろん、Storyboardをプロジェクトに統合し始めるのは時期尚早です。これは、以前のバージョンのサポートが必要なためですが、技術は魅力的に見えます。 さらに、十分な標準遷移タイプがない場合は、子孫UIStoryboardSegueをtotalで記述できます。