多機能レイアウトライブラリ

sobri909/MGBox2 · GitHub

グリッド配置用のライブラリとカスタムなスクロールビューから構成される。
以下はデモアプリのスクリーンショット。

全体がグリッドレイアウトになっていてコレクションビューのような動きをする。下のテーブルビューはカスタムなスクロールビューで表現されている。

回転にも対応。


このライブラリを使ったアプリが紹介されている。



テーブルはカスタムなスクロールビューから作る。UITableViewと異なり行をメソッドで追加していく。

MGScrollView *scroller = [MGScrollView scrollerWithSize:self.bounds.size];
[self.view addSubview:scroller];

// a string on the left and a horse on the right
MGLineStyled *row1 = [MGLineStyled lineWithLeft:@"Left text" 
    right:[UIImage imageNamed:@"horse.png"] size:rowSize];
[section.topLines addObject:row1];

// a string with Mush markup
MGLineStyled *row2 = MGLineStyled.line;
row2.multilineLeft = @"This row has **bold** text, //italics// text, __underlined__ text, "
    "and some `monospaced` text. The text will span more than one line, and the row will "
    "automatically adjust its height to fit.|mush";
row2.minHeight = 40;
[section.topLines addObject:row2];

グリッド配置は MGBoxというコンテナクラスを使う。

MGBox *grid = [MGBox boxWithSize:self.bounds.size];
grid.contentLayoutMode = MGLayoutGridStyle;
[scroller.boxes addObject:grid];

for (int i = 0; i < 10; i++) {
    MGBox *box = [MGBox boxWithSize:(CGSize){100, 100}];
    box.leftMargin = box.topMargin = 10;
    [grid.boxes addObject:box];
}

MGBox内にはMGBoxを複数配置することができる。スクロールビュー内にも配置できるようだ（デモがそんな感じ）。 他に、非同期なレイアウト、CSSライクな位置調整、Blocksベースのオブザーバーやジェスチャー、イベント処理などかなり作りこまれている。

box.onTap = ^{
    NSLog(@"you tapped my box!");    
};
box.onSwipe = ^{
    NSLog(@"you swiped, m'lord?");
};
box.onLongPress = ^{
    NSLog(@"you can let go now.");
};

テーブルやグリッドレイアウトで凝ったデザインや動作を行わせる用途に使えるかもしれない。