ボタンをクリックするよりもスワイプするとアイテムを削除できるクラシックなTableViewがあります。セルにカスタム背景を設定する方法は知っていますが、そのためのカスタムフォントと色を設定する方法がわかりません。
ご協力ありがとう御座います!
func tableView(tableView: UITableView, editActionsForRowAtIndexPath indexPath: NSIndexPath) -> [AnyObject]? {
var deleteAction = UITableViewRowAction(style: UITableViewRowActionStyle.Default,
title: "Delete",
handler: {
(action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in
println("Delete button clicked!")
})
deleteAction.backgroundColor = UIColor.redColor()
return [deleteAction]
}
さて、カスタムフォントを設定するために私が見つけた唯一の方法は、appearanceWhenContainedIn
プロトコルのUIAppearance
メソッドを使用することです。この方法はSwiftではまだ利用できないため、Objective-Cで行う必要があります。
ユーティリティObjective-Cクラスでクラスメソッドを作成して設定しました。
+ (void)setUpDeleteRowActionStyleForUserCell {
UIFont *font = [UIFont fontWithName:@"AvenirNext-Regular" size:19];
NSDictionary *attributes = @{NSFontAttributeName: font,
NSForegroundColorAttributeName: [UIColor whiteColor]};
NSAttributedString *attributedTitle = [[NSAttributedString alloc] initWithString: @"DELETE"
attributes: attributes];
/*
* We include UIView in the containment hierarchy because there is another button in UserCell that is a direct descendant of UserCell that we don't want this to affect.
*/
[[UIButton appearanceWhenContainedIn:[UIView class], [UserCell class], nil] setAttributedTitle: attributedTitle
forState: UIControlStateNormal];
}
これは機能しますが、絶対に理想的ではありません。包含階層にUIViewを含めないと、開示インジケーターにも影響を与えることになります(開示インジケーターがUIButtonサブクラスであることに気づいていませんでした)。また、セルのサブビュー内にあるセルにUIButtonがある場合、そのボタンもこのソリューションの影響を受けます。
複雑さを考慮すると、テーブルセルのスワイプオプションには、カスタマイズ可能なオープンソースライブラリの1つを使用する方がよい場合があります。
ObjCのソリューションを共有したいのですが、これは単なるトリックですが、期待どおりに機能します。
- (NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath
{
// this just convert view to `UIImage`
UIImage *(^imageWithView)(UIView *) = ^(UIView *view) {
UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.opaque, 0.0);
[view.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
};
// This is where the magic happen,
// The width and height must be dynamic (it's up to you how to implement it)
// to keep the alignment of the label in place
//
UIColor *(^getColorWithLabelText)(NSString*, UIColor*, UIColor*) = ^(NSString *text, UIColor *textColor, UIColor *bgColor) {
UILabel *lbDelete = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 47, 40)];
lbDelete.font = [UIFont boldSystemFontOfSize:11];
lbDelete.text = text;
lbDelete.textAlignment = NSTextAlignmentCenter;
lbDelete.textColor = textColor;
lbDelete.backgroundColor = bgColor;
return [UIColor colorWithPatternImage:imageWithView(lbDelete)];
};
// The `title` which is `@" "` is important it
// gives you the space you needed for the
// custom label `47[estimated width], 40[cell height]` on this example
//
UITableViewRowAction *btDelete;
btDelete = [UITableViewRowAction
rowActionWithStyle:UITableViewRowActionStyleDestructive
title:@" "
handler:^(UITableViewRowAction * _Nonnull action, NSIndexPath * _Nonnull indexPath) {
NSLog(@"Delete");
[tableView setEditing:NO];
}];
// Implementation
//
btDelete.backgroundColor = getColorWithLabelText(@"Delete", [UIColor whiteColor], [YJColor colorWithHexString:@"fe0a09"]);
UITableViewRowAction *btMore;
btMore = [UITableViewRowAction
rowActionWithStyle:UITableViewRowActionStyleNormal
title:@" "
handler:^(UITableViewRowAction * _Nonnull action, NSIndexPath * _Nonnull indexPath) {
NSLog(@"More");
[tableView setEditing:NO];
}];
// Implementation
//
btMore.backgroundColor = getColorWithLabelText(@"More", [UIColor darkGrayColor], [YJColor colorWithHexString:@"46aae8"]);
return @[btMore, btDelete];
}
[YJColor colorWithHexString:<NSString>];
は、16進文字列をUIColorに変換するだけです。
XCodeのデバッグビュー階層を使用して、スワイプボタンがアクティブなときにUITableViewで何が起こっているかを確認すると、UITableViewRowActionアイテムがUITableViewCellDeleteConfirmationView
に含まれる_UITableViewCellActionButton
というボタンに変換されることがわかります。ボタンのプロパティを変更する1つの方法は、ボタンがUITableViewCell
に追加されたときにボタンをインターセプトすることです。 UITableViewCell
派生クラスに、次のように記述します。
private let buttonFont = UIFont.boldSystemFontOfSize(13)
private let confirmationClass: AnyClass = NSClassFromString("UITableViewCellDeleteConfirmationView")!
override func addSubview(view: UIView) {
super.addSubview(view)
// replace default font in swipe buttons
let s = subviews.flatMap({$0}).filter { $0.isKindOfClass(confirmationClass) }
for sub in s {
for button in sub.subviews {
if let b = button as? UIButton {
b.titleLabel?.font = buttonFont
}
}
}
}
UIButton.appearance
を使用して、行アクション内のボタンのスタイルを設定できます。そのようです:
let buttonStyle = UIButton.appearance(whenContainedInInstancesOf: [YourViewController.self])
let font = UIFont(name: "Custom-Font-Name", size: 16.0)!
let string = NSAttributedString(string: "BUTTON TITLE", attributes: [NSAttributedString.Key.font : font, NSAttributedString.Key.foregroundColor : UIColor.green])
buttonStyle.setAttributedTitle(string, for: .normal)
注:これは、このView Controllerのすべてのボタンに影響します。
これは、少なくともフォントの色を設定する場合には機能するようです。
- (void)setupRowActionStyleForTableViewSwipes {
UIButton *appearanceButton = [UIButton appearanceWhenContainedInInstancesOfClasses:@[[NSClassFromString(@"UITableViewCellDeleteConfirmationView") class]]];
[appearanceButton setTitleColor:[UIColor lightGrayColor] forState:UIControlStateNormal];
}