TORQUES LABS

Tweet

OSS Samplerに実装しているオープンソースライブラリを毎日紹介する「OSS Sampler AdventCalender 2013」 、2日目は、「MGBoxKit」です。

MGBoxKit

MGBoxKitは、OSS Samplerのライブラリ情報画面でも使っているレイアウトライブラリです。
sobri909/MGBoxKit – github
通常のUITableViewはちょっとデザインしたいだけのときには結構面倒ですが、そういうときに便利なのがこのMGBoxKit。

ライセンスはBSDライセンス系のオープンソースライセンスですが、クレジットの表示を義務付けていないようなので、嬉しいですね。

特徴

HTMLのように、とりあえず箱を作って、その中に文字を設定すると、適当なサイズに収まるように表示されます。
UITableViewではこれがかなり面倒なので、コンテンツのサイズに柔軟に対応できるレイアウトライブラリを探している人にはオススメ。

素晴らしいライブラリ設計

UIScrollViewを拡張したMGScrollViewを表示領域として生成し、その中にMGBoxを追加していく、というシンプルな作りです。
MGScrollViewは、プロパティとしてboxesというNSMutableArrayをプロパティとして持っているので、次のようなコードになります。

1
2
3
4

// 公式ページより引用.
MGBox *grid = [MGBox boxWithSize:self.bounds.size];
grid.contentLayoutMode = MGLayoutGridStyle;
[scroller.boxes addObject:grid];

MGBoxにはボーダーやマージンなども設定できますし、タッチイベントなどの処理もBlocksで書けてとても使い勝手が良いのです。

1
2
3
4
5
6
7
8
9
10

// 公式ページより引用.
box.onTap = ^{
  NSLog(@"you tapped my box!");    
};
box.onSwipe = ^{
  NSLog(@"you swiped, m'lord?");
};
box.onLongPress = ^{
  NSLog(@"you can let go now.");
};

実際には、MGBoxを派生させているクラスを作ったり、MGLineというMGBoxの派生クラスを使うことになると思います。
ちなみに、OSS Samplerの説明画面のレイアウトはMGLineとMGLineStyledというクラスで作っています。

盛りだくさんの機能！

上に示したアニメGIFのように、ボックスを追加したり削除したりも動的に行って、しかも綺麗にアニメーションしてくれますし、もちろんこのアニメーションもカスタマイズ出来るようになっています。
私も余り使いこなしていませんので、もうちょっと試してみようと思います！

– OSS Sampler – iOSオープンソースライブラリ集
（今回紹介したMGBoxKitの動作も確認できます）