Definir o raio do canto no UIImageView não funciona

129

Estou um pouco perdido. Eu usei a propriedade de camada do UIView para arredondar os cantos de vários elementos no meu aplicativo. No entanto, este UIImageView simplesmente não está em conformidade. Não tenho certeza do que estou perdendo.

O UIImageView (chamado previewImage) está contido em uma célula de exibição de tabela. Eu tentei configurar a propriedade cornerRadius em vários locais (na própria célula e no controlador que cria a célula) sem sucesso.

static NSString *CellIdentifier = @"MyTableViewCell";

MyTableViewCell *cell = (MyTableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
    NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:CellIdentifier owner:self options:nil];
    cell = [topLevelObjects objectAtIndex:0];
    cell.previewImage.layer.cornerRadius = 20; //Made it 20 to make sure it's obvious.
}

Há algo sobre o modo como as células são carregadas que eu estou perdendo?

— MarkPowell
fonte

377

Você precisa definir a masksToBoundspropriedade da camada para YES:

cell.previewImage.layer.masksToBounds = YES;

Isso ocorre porque o UIImageViewcontrole cria uma pseudo-subview para manter o UIImageobjeto.

— Evan Mulawski
fonte

19

A menos que você também rasterize a visualização (view.layer.shouldRasterize = YES), cada quadro exigirá uma nova máscara de todos os pixels.

— jjxtra

@jjxtra então é melhor definir shouldRasterize = false?

— precisa saber é o seguinte

Se shouldRasterize for falso, você pagará a sobrecarga da criação da máscara a cada quadro. Se shouldRasterize for true e sua camada mudar a cada quadro, você pagará a sobrecarga da máscara e a sobrecarga da rasterização. O caso ideal é uma camada estática (que não muda muito frequentemente) com shouldRasterize = true.

— jjxtra

30

Também vale a pena notar que

Se você estiver usando aspectFit AND cornerRadius com clipsToBounds / masksToBounds, não obterá os cantos arredondados.

ou seja, se você tem isso

theImageView.contentMode = .scaleAspectFit

e

   theImageView.layer.cornerRadius = (theImageView.frame.size.height)/2
    theImageView.clipsToBounds = true

ou

theImageView.layer.masksToBounds = true

Isso não vai funcionar . você terá que se livrar do código aspectFit

//theImageView.contentMode = .scaleAspectFit

Verifique se a largura e a altura da visualização de imagem são iguais

— Naishta
fonte

Em suma: set proporção 1: 1, se você quiser usar AspectFit

— djdance

22

Isso deve funcionar

cell.previewImage.clipsToBounds = YES;

cell.previewImage.layer.cornerRadius = 20;

— Teena nath Paul
fonte

3

Não tenho certeza se clipsToBoundsé um método na classe posterior. Acredite que é masksToBoundscomo acima.

— Alfie Hanssen

4

Camadas @AlfieHanssen tem masksToBounds :, vista tem clipsToBounds:

— Kevin

11

Eu acredito que você precisa definir:

cell.previewImage.layer.masksToBounds = YES;
cell.previewImage.layer.opaque = NO;

— Daniel Dickison
fonte

4

No Xcode Interface Builder, selecionar o atributo de desenho 'Clip Subviews' para a visualização, juntamente com a definição do raio do canto no código, cell.previewImage.layer.cornerRadius = 20;faz o trabalho para mim!

Consulte a opção 'Clip Subviews' no IB

— koira
fonte

2

Experimente este trecho de código abaixo

cell.previewImage.layer.cornerRadius = 20;
cell.previewImage.clipsToBounds = YES;

— Vaibhav Thakre
fonte

2

Experimente este código: -

self.imgaviewName.clipsToBounds = true
self.imageviewName.layer.cornerRadius = 10

— kangna sharma
fonte

As respostas somente de código são desencorajadas. Clique em editar e adicione algumas palavras resumindo como o seu código aborda a pergunta ou talvez explique como a sua resposta difere da resposta / respostas anteriores. Obrigado

— Nick

1

Para imageView.contentMode = .scaleAspectFillo cornerRadiusnão é aplicado se a imagem é muito grande, dependendo do hardware.

Alguns testes com imagens panorâmicas redimensionadas:

iPhone X, tamanho da imagem 5000x1107: 🚫 4000x886: ✅
iPhone 6s Plus, tamanho da imagem 10000x2215: 🚫 5000x1107: ✅
iPhone 6s, tamanho da imagem 10000x2215: 🚫 5000x1107: ✅

As dimensões do imageView são 160x100. Curiosamente, o hardware mais recente não é necessariamente mais capaz.

Sinta-se livre para editar esta postagem com mais resultados de teste!

— Ortwin Gentz
fonte

0

-(void) viewDidAppear:(BOOL)animated{
       [super viewDidAppear:animated];
       [self setMaskTo:viewDistance 
             byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight];
           }

- (void)setMaskTo:(UIView*)view byRoundingCorners:(UIRectCorner)corners
     {
      UIBezierPath *rounded = [UIBezierPath 
                bezierPathWithRoundedRect:view.bounds
                                              byRoundingCorners:corners

                     cornerRadii:CGSizeMake(20.0, 20.0)];

          CAShapeLayer *shape = [[CAShapeLayer alloc] init];
          shape.frame = self.view.bounds;
         [shape setPath:rounded.CGPath];
          view.layer.mask = shape;
       }

— Maulik Patel
fonte

0

Resposta rápida 4.2:

Para que o raio do canto funcione, adicione a imagem a UIViewe, em seguida, você precisa definir a masksToBoundspropriedade da imagem para true:

planeImage.layer.masksToBounds = true
planeImage.layer.cornerRadius = 20

Nota: Substitua 20 pelo desejado cornerRadius

— IronmanX46
fonte

0

Nada das respostas anteriores está funcionando?

Pode acontecer que o tamanho do UIImageView seja maior que o tamanho da imagem. O raio do canto pode ser definido bem, mas não visível nesse caso.

Verificação rápida do tamanho de UIImageView por código: (ou pode usar a ferramenta "Exibir hierarquia da interface do usuário" no XCode)

self.imageView.backgroundColor = [UIColor greenColor];

Nesse cenário, você deve garantir que o UIImageView tenha a mesma proporção da imagem.

— Marek Manduch
fonte