Red > Green > Refactor > Red

cycle is based on desire

UISplitViewController で 2 つの ViewController を 1 つの画面に表示する

UISplitViewController で 2 つの ViewController を 1 つの画面に表示する

結果イメージ

f:id:mat5ukawa:20150519001443j:plain

前提

  • Storyboad, Segue は使わない
  • Xcode 6.3.1
  • iOS 8.1

登場人物

  • LabelsViewController(.xib | .h | .m) (左側に出す画面)
  • ButtonsViewController(.xib | .h | .m) (右側に出す画面)
  • UISplitViewController
  • (他立役者は、各項目を参照)

UISplitViewController モジュールの構成イメージ

画面構成

f:id:mat5ukawa:20150519001600j:plain

  • 左側画面 primary
  • 右側画面 secondary
    • と呼ばれる(別名、master, detail)

primary の幅構成(補足:読み飛ばしてOK)

f:id:mat5ukawa:20150519001643j:plain

f:id:mat5ukawa:20150519001657j:plain

maximumPrimaryWidth(max 幅) と minimumPrimaryWidth(min 幅) を定義し

preferredPrimaryColumnWidthFraction(幅比率) を図のイメージで定義する

結果イメージの構築

RootViewController

xib

f:id:mat5ukawa:20150519001831p:plain

h

#import <UIKit/UIKit.h>

@interface RootViewController : UIViewController
@end

m

#import "RootViewController.h"
#import "ButtonsViewController.h"
#import "LabelsViewController.h"

@interface RootViewController ()
@end

@implementation RootViewController

- (void)viewDidLoad {
  [super viewDidLoad];
}

- (void)didReceiveMemoryWarning {
  [super didReceiveMemoryWarning];
}

- (IBAction)touchShowSplitViewControllerButton:(UIButton *)sender {
  // Show Split View Controller ボタンが押下されたら
  // primary(Labels), secondary(Buttons) を表示する

  UISplitViewController *splitVC = [[UISplitViewController alloc] init];

  // 表示したい 2 ViewController を初期化する
  ButtonsViewController *buttonVC  = [[ButtonsViewController alloc] init];
  LabelsViewController *labelVC = [[LabelsViewController alloc] init];

  // @[primary, secondary] の順に、viewControllers を割り当てる
  splitVC.viewControllers = @[buttonVC, labelVC];

  // primary の min 幅, max 幅, 幅比率 を設定する
  splitVC.minimumPrimaryColumnWidth = 200;
  splitVC.maximumPrimaryColumnWidth = BUTTON_VIEW_CONTROLLER_WIDTH;
  splitVC.preferredPrimaryColumnWidthFraction = 0.3;

  // primary, detail 両方の ViewController を display する
  splitVC.preferredDisplayMode = UISplitViewControllerDisplayModeAllVisible;
  [self presentViewController:splitVC animated:YES completion:nil];
}

@end

ButtonsViewController

xib

width は 500 で作成した

f:id:mat5ukawa:20150519002125p:plain

h

#import <UIKit/UIKit.h>

static const CGFloat BUTTON_VIEW_CONTROLLER_WIDTH = 500;

@interface ButtonsViewController : UIViewController
@end

m

#import "ButtonsViewController.h"

@interface ButtonsViewController ()
@end

@implementation ButtonsViewController

- (void)viewDidLoad {
  [super viewDidLoad];
}

- (void)didReceiveMemoryWarning {
  [super didReceiveMemoryWarning];
}
@end

LabelsViewController

xib

f:id:mat5ukawa:20150519002242p:plain

h

#import <UIKit/UIKit.h>

@interface LabelsViewController : UIViewController
@end

m

#import "LabelsViewController.h"

@interface LabelsViewController ()
@end

@implementation LabelsViewController

- (void)viewDidLoad {
  [super viewDidLoad];
}

- (void)didReceiveMemoryWarning {
  [super didReceiveMemoryWarning];
}
@end

reference

developer.apple.com

labs.techfirm.co.jp

qiita.com