Autolayout - o tamanho intrínseco do UIButton não inclui inserções de título

Se eu tiver um UIButton organizado usando o autolayout, seu tamanho será ajustado para caber em seu conteúdo.

Se eu definir uma imagem como button.image, o tamanho do instrinsic novamente parece explicar isso.

No entanto, se eu ajustar o titleEdgeInsetsbotão, o layout não será responsável por isso e truncará o título do botão.

Como garantir que a largura intrínseca do botão seja responsável pela inserção?

Editar:

Estou usando o seguinte:

[self.backButton setTitleEdgeInsets:UIEdgeInsetsMake(0, 5, 0, 0)];

O objetivo é adicionar alguma separação entre a imagem e o texto.

Você pode resolver isso sem precisar substituir nenhum método ou definir uma restrição de largura arbitrária. Você pode fazer tudo isso no Interface Builder da seguinte maneira.

• A largura intrínseca do botão é derivada da largura do título mais da largura do ícone e das inserções de borda de conteúdo esquerda e direita .

• Se um botão tiver uma imagem e um texto, eles serão centralizados como um grupo, sem preenchimento entre eles.

• Se você adicionar um conteúdo à esquerda, ele será calculado em relação ao texto, não ao texto + ícone.

• Se você definir uma imagem negativa esquerda inserida, a imagem será puxada para a esquerda, mas a largura total do botão não será afetada.

• Se você definir uma imagem esquerda negativa inserida, o layout real utilizará metade desse valor. Portanto, para obter uma inserção esquerda de -20 pontos, você deve usar um valor de inserção esquerda de -40 pontos no Interface Builder.

Portanto, você fornece uma inserção de conteúdo esquerda grande o suficiente para criar espaço para a inserção esquerda desejada e o preenchimento interno entre o ícone e o texto e, em seguida, muda o ícone para a esquerda dobrando a quantidade de preenchimento desejada entre o ícone e o texto. O resultado é um botão com inserções de conteúdo iguais à esquerda e à direita e um par de texto e ícone centralizado como um grupo, com uma quantidade específica de preenchimento entre eles.

Alguns exemplos de valores:

// Produces a button with the layout:
// |-20-icon-10-text-20-|
// AutoLayout intrinsic width works as you'd desire.
button.contentEdgeInsets = UIEdgeInsetsMake(10, 30, 10, 20)
button.imageEdgeInsets = UIEdgeInsetsMake(0, -20, 0, 0)

Você pode fazer isso funcionar no Interface Builder (sem escrever nenhum código), usando uma combinação de títulos e inserções de conteúdo negativos e positivos.

Atualização : O Xcode 7 possui um erro no qual você não pode inserir valores negativos no Rightcampo Inset, mas pode usar o controle stepper ao lado para diminuir o valor. (Obrigado Stuart)

Isso adicionará 8 pontos de espaçamento entre a imagem e o título e aumentará a largura intrínseca do botão na mesma quantidade. Como isso:

Por que não substituir o intrinsicContentSizemétodo no UIView? Por exemplo:

- (CGSize) intrinsicContentSize
{
    CGSize s = [super intrinsicContentSize];

    return CGSizeMake(s.width + self.titleEdgeInsets.left + self.titleEdgeInsets.right,
                      s.height + self.titleEdgeInsets.top + self.titleEdgeInsets.bottom);
}

Isso deve informar ao sistema de pagamento automático que deve aumentar o tamanho do botão para permitir inserções e mostrar o texto completo. Não estou no meu próprio computador, então não testei isso.

Você não especificou como está definindo as inserções, portanto, acho que você está usando titleEdgeInsets porque vejo o mesmo efeito que você está obtendo. Se eu usar contentEdgeInsets, ele funcionará corretamente.

- (IBAction)ChangeTitle:(UIButton *)sender {
    self.button.contentEdgeInsets = UIEdgeInsetsMake(0,20,0,20);
    [self.button setTitle:@"Long Long Title" forState:UIControlStateNormal];
}

E para Swift trabalhou isso:

extension UIButton {
    override open var intrinsicContentSize: CGSize {
        let intrinsicContentSize = super.intrinsicContentSize

        let adjustedWidth = intrinsicContentSize.width + titleEdgeInsets.left + titleEdgeInsets.right
        let adjustedHeight = intrinsicContentSize.height + titleEdgeInsets.top + titleEdgeInsets.bottom

        return CGSize(width: adjustedWidth, height: adjustedHeight)
    }
}

Love U Swift

Esse tópico é um pouco antigo, mas eu mesmo me deparei com isso e fui capaz de resolvê-lo usando uma inserção negativa. Por exemplo, substitua os valores de preenchimento desejados aqui:

UIButton* myButton = [[UIButton alloc] init];
// setup some autolayout constraints here
myButton.titleEdgeInsets = UIEdgeInsetsMake(-desiredBottomPadding,
                                            -desiredRightPadding,
                                            -desiredTopPadding,
                                            -desiredLeftPadding);

Combinado com as restrições corretas de autolayout, você acaba com um botão de redimensionamento automático que contém uma imagem e texto! Visto abaixo com o desiredLeftPaddingconjunto para 10.

Você pode ver que o quadro real do botão não abrange o rótulo (já que o rótulo é deslocado 10 pontos para a direita, fora dos limites), mas alcançamos 10 pontos de preenchimento entre o texto e a imagem.

Para o Swift 3, com base na resposta do pegpeg :

extension UIButton {

    override open var intrinsicContentSize: CGSize {

        let intrinsicContentSize = super.intrinsicContentSize

        let adjustedWidth = intrinsicContentSize.width + titleEdgeInsets.left + titleEdgeInsets.right
        let adjustedHeight = intrinsicContentSize.height + titleEdgeInsets.top + titleEdgeInsets.bottom

        return CGSize(width: adjustedWidth, height: adjustedHeight)

    }

}

Tudo acima não funcionou para o iOS 9+ , o que fiz foi:

• Adicione uma restrição de largura (para uma largura mínima quando o botão não tiver texto. O botão será redimensionado automaticamente se o texto for fornecido)
• defina a relação como Maior que ou Igual

Agora, para adicionar uma borda ao redor do botão, basta usar o método:

button.contentEdgeInsets = UIEdgeInsetsMake(0,20,0,20);

Eu queria adicionar um espaço de 5 pontos entre o ícone do UIButton e o rótulo. Foi assim que consegui:

UIButton *infoButton = [UIButton buttonWithType:UIButtonTypeCustom];
// more button config etc
infoButton.contentEdgeInsets = UIEdgeInsetsMake(0, 0, 0, 5);
infoButton.titleEdgeInsets = UIEdgeInsetsMake(0, 5, 0, -5);

A maneira como contentEdgeInsets, titleEdgeInsets e imageEdgeInsets se relacionam requer um pouco de troca de informações. Portanto, se você adicionar algumas inserções à esquerda do título, precisará adicionar uma inserção negativa à direita e fornecer mais espaço (via inserção positiva) no conteúdo à direita.

Ao adicionar uma inserção de conteúdo correta para corresponder à mudança das inserções de título, meu texto não sai dos limites do botão.

A opção também está disponível no construtor de interface. Veja o Inset. Coloquei esquerda e direita em 3. Funciona como um encanto.

A solução que eu uso é adicionar uma restrição de largura no botão. Em algum momento da inicialização, após a definição do texto, atualize a restrição de largura da seguinte maneira:

self.buttonWidthConstraint.constant = self.shareButton.intrinsicContentSize.width + 8;

Onde 8 é a sua inserção.

chamar sizeToFit () garante que contentEdgeInset seja efetivado

extension UIButton {

   open override func draw(_ rect: CGRect) { 
       self.contentEdgeInsets = UIEdgeInsets(top: 10, left: 40, bottom: 10, right: 40)
       self.sizeToFit()
   }
}