UITableViewCell имеет квадратный угол с изображением

Question

У меня есть группа UITableView, которая содержит несколько ячеек (только стандартные UITableViewCell s), все из которых имеют стиль UITableViewCellStyleSubtitle.Буэно.Однако когда я вставляю в них изображения (используя предоставленное свойство imageView), углы с левой стороны становятся квадратными.

Пример изображения http://files.lithiumcube.com/tableView.png

Код, используемый для назначениязначения в ячейке:

cell.textLabel.text = currentArticle.descriptorAndTypeAndDifferentiator;
cell.detailTextLabel.text = currentArticle.stateAndDaysWorn;
cell.imageView.image = currentArticle.picture;

и currentArticle.picture - это UIImage (также изображения, как вы можете видеть, отображаются очень хорошо, за исключением квадратных углов).

Он отображается одинаково на моем iPhone 3G, в симуляторе iPhone 4 и в симуляторе iPad.

То, что я собираюсь сделать, похоже на UITableViewCell s, которые Apple использует в своем iTunesприложение.

Есть идеи о том, что я делаю не так?

Спасибо,
-Аарон

Answer 1

cell.imageView.layer.cornerRadius = 16; // 16 is just a guess
cell.imageView.clipsToBounds = YES;

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

В противном случае вам придется добавить свой собственный вид изображения, который будет только вокруг одного угла.Вы можете сделать это, установив область клипа в drawRect: перед вызовом super.Или просто добавьте свое собственное изображение, которое не так близко к левому краю.

Answer 2

Вы можете добавить категорию на UIImage и включить этот метод:

// Return the image, but with rounded corners. Useful for masking an image
// being used in a UITableView which has grouped style
- (UIImage *)imageWithRoundedCorners:(UIRectCorner)corners radius:(CGFloat)radius {

    // We need to create a CGPath to set a clipping context
    CGRect aRect = CGRectMake(0.f, 0.f, self.size.width, self.size.height);
    CGPathRef clippingPath = [UIBezierPath bezierPathWithRoundedRect:aRect byRoundingCorners:corners cornerRadii:CGSizeMake(radius, radius)].CGPath;

    // Begin drawing
    // Start a context with a scale of 0.0 uses the current device scale so that this doesn't unnecessarily drop resolution on a retina display.
    // Use `UIGraphicsBeginImageContextWithOptions(aRect.size)` instead for pre-iOS 4 compatibility.
    UIGraphicsBeginImageContextWithOptions(aRect.size, NO, 0.0);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextAddPath(context, clippingPath);
    CGContextClip(context);
    [self drawInRect:aRect];
    UIImage *croppedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return croppedImage;
}

Затем, когда вы конфигурируете свои ячейки, в контроллере табличного представления вызовите что-то вроде:

if ( *SINGLE_ROW* ) {
    // We need to clip to both corners
    cell.imageView.image = [image imageWithRoundedCorners:(UIRectCornerTopLeft | UIRectCornerBottomLeft) radius:radius];
} else if (indexPath.row == 0) {
    cell.imageView.image = [image imageWithRoundedCorners:UIRectCornerTopLeft radius:radius];   
} else if (indexPath.row == *NUMBER_OF_ITEMS* - 1) {
    cell.imageView.image = [image imageWithRoundedCorners:UIRectCornerBottomLeft radius:radius];
} else {
    cell.imageView.image = image;
}

но замените SINGLE_ROW и т. Д. Реальной логикой, чтобы определить, есть ли у вас одна строка в разделе или это последняя строка. Здесь следует отметить, что я обнаружил (экспериментально), что радиус для таблицы стилей группы равен 12, что отлично работает в симуляторе, но не на iPhone. Я не был в состоянии проверить это на устройстве без сетчатки. Радиус 30 выглядит хорошо на iPhone 4 (поэтому мне интересно, если это масштабирование изображения, поскольку изображения, которые я использую, взяты из адресной книги, поэтому не имеют подразумеваемого масштабного коэффициента) Поэтому перед этим у меня есть код, который изменяет радиус ...

CGFloat radius = GroupStyleTableCellCornerRadius;
if ([[UIScreen mainScreen] respondsToSelector:@selector(scale)] && [[UIScreen mainScreen] scale] == 2){
    // iPhone 4
    radius = GroupStyleTableCellCornerRadiusForRetina;
}

надеюсь, что это поможет.