スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
このエントリーをはてなブックマークに追加

[iOS]カスタムUISwitch

四角いスイッチが使いたいと思いたち、画像検索していると、良いサンプルに出会えたのでここに掲示しておきます。

>> UICustomSwitch.zip

中身はUISliderを改変したもので、とてもよく作りこまれています。
UISwitchよりもカスタマイズ性が高いです。

さらにフォーラムから以下のソースも追加するとOff状態のTintまでカスタマイズできます。
(ただし色が淡いので改良の余地があります)
//Off側のTintを設定します。
-(void)setOffTintColor:(UIColor*)color
{
if (color != offTintColor)
{
//ARC無しの場合
//[offTintColor release];
//offTintColor = [color retain];

//ARC有りの場合
offTintColor = color;

[self setMaximumTrackImage:[self image:[UIImage imageNamed:@"switchOffPlain.png"] tintedWithColor:offTintColor] forState:UIControlStateNormal];
}
}


あと、画像を暗くしたり明るくしたりしたい場合のソースコードです。
(押した時の画像を作成する場合は効果的です。)
途中で使われているRGBA(r,g,b,a)のソースも追加してください。
//明暗を変更します
- (UIImage *)image:(UIImage*)image lightedWithAlpha:(float)alpha
{
// static NSInteger modeColor = 0;

if (alpha != 0.0f)
{
UIGraphicsBeginImageContext(image.size);

//draw mask so the alpha is respected
CGContextRef currentContext = UIGraphicsGetCurrentContext();
CGImageRef maskImage = [image CGImage];
CGContextClipToMask(currentContext, CGRectMake(0, 0, image.size.width, image.size.height), maskImage);
CGContextDrawImage(currentContext, CGRectMake(0,0, image.size.width, image.size.height), image.CGImage);

[image drawAtPoint:CGPointMake(0,0)];
UIColor *light = RGBA(0, 0, 0, alpha);
[light setFill];
UIRectFillUsingBlendMode(CGRectMake(0,0,image.size.width,image.size.height),kCGBlendModeMultiply);
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

// NSLog(@"modeColor=%i",modeColor);
//
// modeColor += 1;

return newImage;
}
else
{
return image;
}
}


追記:
サンプルの画像をいい具合に同じ色合いにできました。
あとはrightLabelのbackgroundColorを調整すれば完璧に同じになると思います。
(ただし、この方法はかなりズボラな方法なのでよく見ると陰影が死んでいます。反転した同じ画像を利用する方が賢明だと思います。)
//Off側のTintを設定します。
-(void)setOffTintColor:(UIColor*)color
{
if (color != offTintColor)
{
// [offTintColor release];
// offTintColor = [color retain];
offTintColor = color;
// [self setMaximumTrackImage:[self image:[UIImage imageNamed:@"switchOffPlain.png"] tintedWithColor:offTintColor] forState:UIControlStateNormal];
UIImage *switchOffPlane_alphaMax = [self image:[UIImage imageNamed:@"switchOffPlain.png"] lightedWithAlpha:0.3f];
[self setMaximumTrackImage:[self image:switchOffPlane_alphaMax tintedWithColor:offTintColor] forState:UIControlStateNormal];
}

}



参考URL:UICustomSwitch – customizing UISwitch > color it, change labels
このエントリーをはてなブックマークに追加

tag : iOS UISwitch UISlider UICustomSwitch スイッチ カスタム カスタマイズ 自作 オリジナル

コメントの投稿

非公開コメント

Translation


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。
プロフィール

チーズくん

Author:チーズくん
個人的メモをただ羅列しています。
twitter:@cheese1038

バロメーター
最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。