ios click - Autolayout-la dimensione intrinseca di UIButton non include i margini del titolo




guideline insert (10)

Se ho un UIButton organizzato usando l'autolayout, le sue dimensioni si adattano bene per adattarsi al suo contenuto.

Se imposto un'immagine come button.image , la dimensione instrinsic sembra di nuovo tenere conto di ciò.

Tuttavia, se titleEdgeInsets il titleEdgeInsets del pulsante, il layout non tiene conto di ciò e invece tronca il titolo del pulsante.

Come posso garantire che la larghezza intrinseca dei conti del pulsante per l'inserto?

Modificare:

Sto usando il seguente:

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

L'obiettivo è aggiungere una certa separazione tra l'immagine e il testo.


Answers

La soluzione che uso è aggiungere un vincolo di larghezza sul pulsante. Poi da qualche parte nell'inizializzazione, dopo aver impostato il testo, aggiorna il vincolo di larghezza in questo modo:

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

Dove 8 è qualunque sia il tuo inserto.


L'opzione è disponibile anche nel builder dell'interfaccia. Guarda l'inserto. Ho impostato sinistra e destra per 3. Funziona come un fascino.


Puoi farlo funzionare in Interface Builder (senza scrivere alcun codice), utilizzando una combinazione di insiemi di titoli e contenuti positivi e negativi.

Aggiornamento : Xcode 7 ha un bug in cui non è possibile immettere valori negativi nel campo Inserto Right , ma è possibile utilizzare il controllo stepper accanto ad esso per ridurre il valore. (Grazie Stuart)

In questo modo si aggiungeranno 8 punti di spaziatura tra l'immagine e il titolo e aumenterà la larghezza intrinseca del pulsante della stessa quantità. Come questo:


Quanto sopra non ha funzionato per iOS 9+ , quello che ho fatto è:

  • Aggiungi un vincolo di larghezza (per una larghezza minima quando il pulsante non ha alcun testo. Il pulsante ridimensionerà automaticamente se viene fornito del testo)
  • imposta la relazione su Maggiore di o uguale

Ora per aggiungere un bordo attorno al pulsante basta usare il metodo:

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

Perché non eseguire l'override del metodo intrinsicContentSize su UIView? Per esempio:

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

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

Questo dovrebbe dire al sistema di caricamento automatico che dovrebbe aumentare la dimensione del pulsante per consentire gli inserti e mostrare il testo completo. Non sono al mio computer, quindi non ho provato questo.


Questo thread è un po 'vecchio, ma mi sono imbattuto in questo ed ero in grado di risolverlo usando un inserto negativo. Ad esempio, sostituire qui i valori di riempimento desiderati:

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

Combinato con i giusti vincoli di autolayout, si finisce con un pulsante di ridimensionamento automatico che contiene un'immagine e un testo! Visto sotto con desiredLeftPadding impostato su 10.

Pulsante con immagine e testo breve

Pulsante con immagine e testo lungo

Puoi vedere che la cornice reale del pulsante non comprende l'etichetta (poiché l'etichetta è spostata di 10 punti a destra, fuori dai limiti), ma abbiamo ottenuto 10 punti di padding tra il testo e l'immagine.


Non hai specificato come stai impostando gli inset, quindi suppongo che tu stia usando titleEdgeInsets perché vedo lo stesso effetto che stai ottenendo. Se utilizzo contentEdgeInsets, invece, funziona correttamente.

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

Volevo aggiungere uno spazio di 5pt tra l'icona di UIButton e l'etichetta. Ecco come l'ho raggiunto:

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

Il modo in cui contentEdgeInsets, titleEdgeInsets e imageEdgeInsets si correlano tra loro richiede un po 'di dare e prendere da ciascun riquadro. Quindi, se aggiungi alcuni inserti alla sinistra del titolo, devi aggiungere un inserto negativo a destra e fornire più spazio (tramite un inserto positivo) nel diritto ai contenuti.

Aggiungendo un inserto contenuto giusto per far corrispondere lo spostamento del riquadro del titolo, il mio testo non va oltre i limiti del pulsante.


Per Swift 3 basato sulla risposta di :

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)

    }

}

Questo potrebbe essere correlato a libz.dylib o libz.tbd , libz.tbd solo aggiungerlo ai tuoi obiettivi per i binari di collegamento e provare a compilare di nuovo.





ios cocoa-touch uiview uibutton autolayout