Круглые углы на UITableView

Каков наилучший способ обойти углы всего UITableView, как показано в Stocks and Spotlight? Сгруппированный стиль не решает проблему, потому что круглые углы прокручиваются вместе с ячейкой. Я пытаюсь закрепить изображение так, чтобы углы всегда круглые, независимо от положения прокрутки.

Я видел еще одну дискуссию о том, как это сделать с UIImage, который предложил маскировать его другим изображением. Я не уверен, что это сработает, потому что мне нужны краны, чтобы пройти к столу. Это не идеально для меня, потому что я хочу, чтобы фоновый рисунок показывался через углы.

Ответ 1

Это старый вопрос, но, возможно, вы все еще хотите знать, как это сделать.

Я воспроизвел таблицуView, как в Stocks/Spotlight. Трюк

view.layer.cornerRadius = 10;

Для этого вам нужно включить QuartzCore в класс, который вы называете этим свойством:

#import <QuartzCore/QuartzCore.h>

Я слышал, что это работает только с ОС 3.0. Но поскольку мое приложение использует основные данные, это не проблема, потому что это было уже для OS 3.0 и hight.

Я создал пользовательский UIView с subview с cornerRadius 10 и

view.backgroundColor = [UIColor clearColor];

Затем вы должны поместить в подзону UITableView сгруппированный стиль. Вам необходимо установить backgroundColor на clearColor и separatorColor на clearColor. Затем вам нужно поместить табличное представление внутри закругленного углового вида, это делается путем установки размера кадра и начала координат. Мой класс loadView моего пользовательского UIView выглядит так:

self.view = [[UIView alloc] init];
self.view.backgroundColor = [UIColor clearColor];

CustomUIViewClass *scherm = [[CustomUIViewClass alloc] init];

CGRect frame;
frame.origin.x = 10;
frame.origin.y = 50;
frame.size.width = 300;
frame.size.height = 380;

scherm.frame = frame;
scherm.clipsToBounds = YES;
scherm.layer.cornerRadius = 10;

[self.view addSubview:scherm];

CustomUITableViewClass *table = [[CustomUITableViewClass alloc] initWithStyle:UITableViewStyleGrouped];

frame.origin.y = -10;
frame.origin.x = -10;
frame.size.width = 320;
frame.size.height = 400;

table.tableView.frame = frame;
[scherm addSubview:table.tableView];

Надеюсь, вы поймете мой английский, возможно, я напишу короткое сообщение в блоге об этой технике с образцовым проектом, опубликую ссылку здесь, когда я буду готов.

Ответ 2

Более простой способ сделать это - просто импортировать структуру QuartzCore в свой проект. #import <QuartzCore/QuartzCore.h> на ваш TableViewController и просто установите

myTableView.layer.cornerRadius=5;

Это даст вам закругленные углы, не добавляя табличное представление в супервизор или обрезая его.

Ответ 3

Вместо того, чтобы взломать код, здесь легко подражать сгруппированному стилю. Это работает, если вы хотите только один раздел.

В интерфейсе Builder:

Настройте стиль UITableView на Plain и сделайте кадр с некоторым дополнением слева и справа, возможно, с x = 10 и width = 300.

Затем установите радиус и цвет угла:

 #import <QuartzCore/QuartzCore.h>

 self.tableView.layer.borderColor = [UIColor colorWithWhite:0.6 alpha:1].CGColor;   
 self.tableView.layer.borderWidth = 1;
 self.tableView.layer.cornerRadius = 4;

Ответ 4

Вот решение, с которым я столкнулся. Он сочетает в себе маску слоя и слой cornerRadius. iPhone OS 3.x только. Я не тратил времени, пытаясь заставить работать полоса прокрутки, но я думаю, что это не должно быть слишком сложно.

http://github.com/beetlebugorg/RoundedUITableView

Ответ 5

Другой способ - скрыть UITableView с помощью Core Graphics. Пример маскировки UIView можно найти здесь: http://iphonedevelopment.blogspot.com/2008/11/creating-transparent-uiviews-rounded.html

Ответ 6

Вы пробовали стиль сгруппированных таблиц?

self.tableView.style = UITableViewStyleGrouped;

Дополнительную информацию см. в Руководство по программированию таблиц. В главе "О таблицах" есть несколько скриншотов, описывающих разные стили.

Ответ 7

Недавно я столкнулся с этой проблемой и решил ее по-другому. Я думал, что поделюсь результатами со всеми.

Я создал прямоугольный UIView с четким, закругленным углом внутри, а затем положил его поверх UITableView. Вы можете найти полное описание в моем блоге по программированию.

Это работает именно так, как я хочу.

Ответ 8

Ну, есть много способов решить эту проблему.

Однако в моем случае все работает неправильно. Моя таблица иногда меньше размера таблицы.

Я поделюсь тем, как я это сделал. Я верю, что это намного проще и быстрее, чем некоторые варианты выше.

Сделайте первый и последний элементы округлыми.

Создайте CAShapeLayer сверху (слева | справа) и снизу (слева | справа).

shapeTop = [CAShapeLayer layer];
shapeTop.path = [UIBezierPath 
bezierPathWithRoundedRect:CGRectMake( 0.0f, 0.0f, 306.0f, 58.0f )
byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight
cornerRadii:CGSizeMake( 6.0f, 6.0f )].CGPath;

shapeBottom = [CAShapeLayer layer];
shapeBottom.path = [UIBezierPath 
bezierPathWithRoundedRect:CGRectMake( 0.0f, 0.0f, 306.0f, 58.0f )
byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight
cornerRadii:CGSizeMake( 6.0f, 6.0f )].CGPath;

Стол должен быть backgroud clearColor;
Клетки должны быть цветным фоном;

Задайте для него layer.mask

UIView* backgroundView = [[UIView alloc] initWithFrame:CGRectZero];
backgroundView.backgroundColor = [UIColor whiteColor];
cell.backgroundView = backgroundView;

Не забывайте #import <QuartzCore/QuartzCore.h>

Ответ 9

Ниже код для версии Swift:

 let redColor = UIColor.redColor()
 self.tableView.layer.borderColor = redColor.colorWithAlphaComponent(0.9).CGColor
 self.tableView.layer.borderWidth = 1;
 self.tableView.layer.cornerRadius = 4;

Убедитесь, что в разделе импорта import QuartzCore.