Tag Archives: KZColorPicker

[OSA2013] KZColorPicker – あると便利なカラーピッカー

0
Filed under オープンソースライブラリ
Tagged as , , ,

OSS Sampler Advent Calendar 2013
「OSS Sampler AdventCalender 2013」 23日目は、「KZColorPicker」です。

KZColorPicker

色を選ぶ場面ではどのようなUIにするか悩みます。既にデスクトップアプリ等でリッチなUIに慣れたユーザーが満足するものを作るのは結構大変ですが、そういうときにこのライブラリを使うと便利です。
alexrestrepo/KZColorPicker – github
OSS Sampler - KZColorPicker
BSDライセンス(二条項BSDライセンス)です。
上記のGIFでは動き重視なのですが、実際には綺麗にグラデーションになっている、ということのためにもう一枚スクリーンショットを貼っておきます。
OSS Sampler - KZColorPicker 2

使いやすい、分かりやすい

KZColorPickerというクラスを画面に合わせて生成すると、上記でも画面のようにまとめてパーツ配置されます。
下記は、デモのUIViewControllerの初期化部分で、実際この部分だけで構築されています。(あとDelegate)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
- (void)viewDidLoad
{
  [super viewDidLoad];
  // Do any additional setup after loading the view.
  self.selectedColor = [UIColor whiteColor];
 
  UIView *container = [[UIView alloc] initWithFrame:
    [[UIScreen mainScreen] applicationFrame]];
  container.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
  container.backgroundColor = [UIColor darkGrayColor];
  self.view = container;
 
  KZColorPicker *picker = [[KZColorPicker alloc] initWithFrame:container.bounds];
  picker.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
  picker.selectedColor = self.selectedColor;
  picker.oldColor = self.selectedColor;
  [picker addTarget:self action:@selector(pickerChanged:)
    forControlEvents:UIControlEventValueChanged];
  [self.view addSubview:picker];
}

一気に作られてしまったら、使いにくいのでは?と思ったのだが、そこまで分かりにくくはない。
(KZColorPicker自体もUIControlの継承だが)各パーツはUIControlを継承したクラスを使って作られているので、スライダーの要素とかカスタマイズすることも簡単でしょう。

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