Как сделать округлое прямоугольное изображение с прозрачностью на iphone?

Многие приложения открывают прозрачное представление с закругленными углами и индикатором ActivityIndicator при выполнении длительной операции.

Как это округление и возможно ли это сделать просто с помощью Interface Builder (так как есть много мест, где я хотел бы использовать что-то подобное)? Или я должен использовать просмотр изображений со скругленным прямоугольным или растягиваемым изображением? Нужно ли сам рисовать фон?

До сих пор мне удалось получить базовое представление с аналогичной прозрачностью, установив alphaValue в Интерфейсном Разработчике, однако он не имеет закругленных углов, а также прозрачность применяется ко всем подпредставлениям (мне не нужен текст и индикатор активности) чтобы быть прозрачным, однако, хотя я устанавливаю alphaValue для тех, кто в IB, кажется, игнорируется).

5 ответов

Решение
view.layer.cornerRadius = radius;

Сложный путь (который требовался в первом iPhone SDK) - создать свой собственный UIView подкласс с drawRect: метод:

 CGContextRef context = UIGraphicsGetCurrentContext();
 CGContextSetRGBFillColor(context, 0,0,0,0.75);

 CGContextMoveToPoint(context, rect.origin.x, rect.origin.y + radius);
 CGContextAddLineToPoint(context, rect.origin.x, rect.origin.y + rect.size.height - radius);
 CGContextAddArc(context, rect.origin.x + radius, rect.origin.y + rect.size.height - radius, 
                radius, M_PI, M_PI / 2, 1); //STS fixed
 CGContextAddLineToPoint(context, rect.origin.x + rect.size.width - radius, 
                        rect.origin.y + rect.size.height);
 CGContextAddArc(context, rect.origin.x + rect.size.width - radius, 
                rect.origin.y + rect.size.height - radius, radius, M_PI / 2, 0.0f, 1);
 CGContextAddLineToPoint(context, rect.origin.x + rect.size.width, rect.origin.y + radius);
 CGContextAddArc(context, rect.origin.x + rect.size.width - radius, rect.origin.y + radius, 
                radius, 0.0f, -M_PI / 2, 1);
 CGContextAddLineToPoint(context, rect.origin.x + radius, rect.origin.y);
 CGContextAddArc(context, rect.origin.x + radius, rect.origin.y + radius, radius, 
                -M_PI / 2, M_PI, 1);

 CGContextFillPath(context);

Замечания: rect в этом коде следует взять из [self bounds] (или в любом другом месте), это не имеет смысла rect перешел к drawRect: метод.

Начиная с iPhone SDK 3.0, вы можете просто использовать слой cornerRadius имущество. Например:

view.layer.cornerRadius = 10.0;

Таким же образом вы можете изменить цвет и ширину границы представления:

view.layer.borderColor = [[UIColor grayColor] CGColor];
view.layer.borderWidth = 1;

Я абстрагировал ответ @lostInTransit в эту функцию:

static void ContextAddRoundedRect(CGContextRef c, CGRect rect, CGFloat radius) {
  CGFloat minX = CGRectGetMinX(rect);
  CGFloat maxX = CGRectGetMaxX(rect);
  CGFloat minY = CGRectGetMinY(rect);
  CGFloat maxY = CGRectGetMaxY(rect);

  CGContextMoveToPoint(c, minX + radius, minY);
  CGContextAddArcToPoint(c, maxX, minY, maxX, minY + radius, radius);
  CGContextAddArcToPoint(c, maxX, maxY, maxX - radius, maxY, radius);
  CGContextAddArcToPoint(c, minX, maxY, minX, maxY - radius, radius);
  CGContextAddArcToPoint(c, minX, minY, minX + radius, minY, radius);
}

который помещает путь в контекст для вас, как вы можете

немного разные вызовы CoreGraphics, и я не закрыл путь, на случай, если вы захотите добавить

CGContextFillPath(c);

По вашему мнению, сделать это в методе drawRect

float radius = 5.0f;

CGRect rect = self.bounds;
CGContextRef context = UIGraphicsGetCurrentContext();   
rect = CGRectInset(rect, 1.0f, 1.0f);

CGContextBeginPath(context);
CGContextSetGrayFillColor(context, 0.5, 0.7);
CGContextMoveToPoint(context, CGRectGetMinX(rect) + radius, CGRectGetMinY(rect));
CGContextAddArc(context, CGRectGetMaxX(rect) - radius, CGRectGetMinY(rect) + radius, radius, 3 * M_PI / 2, 0, 0);
CGContextAddArc(context, CGRectGetMaxX(rect) - radius, CGRectGetMaxY(rect) - radius, radius, 0, M_PI / 2, 0);
CGContextAddArc(context, CGRectGetMinX(rect) + radius, CGRectGetMaxY(rect) - radius, radius, M_PI / 2, M_PI, 0);
CGContextAddArc(context, CGRectGetMinX(rect) + radius, CGRectGetMinY(rect) + radius, radius, M_PI, 3 * M_PI / 2, 0);

CGContextClosePath(context);
CGContextFillPath(context);

Это сделает ваш прямоугольник с закругленными углами для вашего просмотра. Вы можете найти полный пример в образце HeadsUpUI, поставляемом с SDK. НТН

Другие вопросы по тегам