Autolayout - ukuran intrinsik UIButton tidak termasuk insets judul

Jika saya memiliki UIButton yang diatur menggunakan autolayout, ukurannya menyesuaikan dengan baik agar sesuai dengan isinya.

Jika saya menetapkan gambar sebagai button.image, ukuran instrinsik lagi tampaknya bertanggung jawab untuk ini.

Namun, jika saya mengubah titleEdgeInsetstombol, tata letak tidak memperhitungkan ini dan malah memotong judul tombol.

Bagaimana saya bisa memastikan bahwa lebar intrinsik tombol menyumbang inset?

Edit:

Saya menggunakan yang berikut ini:

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

Tujuannya adalah untuk menambahkan beberapa pemisahan antara gambar dan teks.

Anda dapat menyelesaikan ini tanpa harus menimpa metode apa pun atau menetapkan batasan lebar sewenang-wenang. Anda bisa melakukan semuanya di Interface Builder sebagai berikut.

• Lebar tombol intrinsik berasal dari lebar judul ditambah lebar ikon ditambah insets tepi konten kiri dan kanan .

• Jika sebuah tombol memiliki gambar dan teks, mereka dipusatkan sebagai grup, tanpa padding di antaranya.

• Jika Anda menambahkan inset konten kiri, itu dihitung relatif terhadap teks, bukan ikon teks +.

• Jika Anda menetapkan inset gambar kiri negatif, gambar ditarik ke kiri tetapi lebar tombol keseluruhan tidak terpengaruh.

• Jika Anda menetapkan inset gambar kiri negatif, tata letak yang sebenarnya menggunakan setengah dari nilai itu. Jadi untuk mendapatkan inset kiri -20 poin, Anda harus menggunakan nilai inset kiri -40 di Interface Builder.

Jadi, Anda memberikan inset konten kiri yang cukup besar untuk menciptakan ruang untuk inset kiri yang diinginkan dan lapisan dalam di antara ikon dan teks, lalu menggeser ikon ke kiri dengan menggandakan jumlah padding yang Anda inginkan antara ikon dan teks. Hasilnya adalah tombol dengan inset konten kiri dan kanan yang sama, dan pasangan teks dan ikon yang dipusatkan sebagai grup, dengan jumlah padding di antaranya.

Beberapa contoh nilai:

// 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)

Anda bisa membuatnya berfungsi di Interface Builder (tanpa menulis kode apa pun), dengan menggunakan kombinasi Judul dan Konten Insets negatif dan positif.

Pembaruan : Xcode 7 memiliki bug di mana Anda tidak dapat memasukkan nilai negatif di Rightbidang Inset, tetapi Anda dapat menggunakan kontrol stepper di sebelahnya untuk mengurangi nilai. (Terima kasih Stuart)

Melakukan ini akan menambah jarak 8pt antara gambar dan judul dan akan menambah lebar intrinsik tombol dengan jumlah yang sama. Seperti ini:

Mengapa tidak mengganti intrinsicContentSizemetode pada UIView? Sebagai contoh:

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

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

Ini akan memberi tahu sistem autolayout bahwa ia harus menambah ukuran tombol untuk memungkinkan insets dan menampilkan teks lengkap. Saya tidak di komputer saya sendiri, jadi saya belum menguji ini.

Anda belum menentukan bagaimana Anda mengatur insets, jadi saya menduga Anda menggunakan titleEdgeInsets karena saya melihat efek yang sama dengan yang Anda dapatkan. Jika saya menggunakan contentEdgeInsets sebagai gantinya berfungsi dengan baik.

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

Dan untuk Swift bekerja ini:

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

Utas ini agak lama, tetapi saya sendiri menabrak ini dan dapat menyelesaikannya dengan menggunakan inset negatif. Misalnya, gantikan nilai padding yang Anda inginkan di sini:

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

Dikombinasikan dengan batasan autolayout yang tepat, Anda akan mendapatkan tombol ubah ukuran otomatis yang berisi gambar dan teks! Terlihat di bawah dengan desiredLeftPaddingset ke 10.

Anda dapat melihat bahwa bingkai tombol yang sebenarnya tidak mencakup label (karena label digeser 10 poin ke kanan, di luar batas), tetapi kami telah mencapai 10 poin bantalan antara teks dan gambar.

Untuk Swift 3 berdasarkan jawaban pasak :

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)

    }

}

Semua di atas tidak berfungsi untuk iOS 9+ , yang saya lakukan adalah:

• Tambahkan batasan lebar (untuk lebar minimum ketika tombol tidak memiliki teks. Tombol akan skala otomatis jika teks disediakan)
• atur hubungannya dengan Greater Than atau Equal

Sekarang untuk menambahkan perbatasan di sekitar tombol cukup gunakan metode:

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

Saya ingin menambahkan ruang 5pt antara ikon UIButton saya dan labelnya. Beginilah cara saya mencapainya:

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

Cara contentEdgeInsets, titleEdgeInsets, dan imageEdgeInsets saling berhubungan membutuhkan sedikit memberi dan menerima dari setiap inset. Jadi, jika Anda menambahkan beberapa insets ke kiri judul Anda harus menambahkan inset negatif di sebelah kanan dan memberikan lebih banyak ruang (melalui inset positif) di konten kanan.

Dengan menambahkan inset konten yang tepat agar sesuai dengan pergeseran judul inset, teks saya tidak melampaui batas tombol.

Opsi ini juga tersedia di pembuat antarmuka. Lihat Inset. Saya mengatur kiri dan kanan ke 3. Bekerja seperti pesona.

Solusi yang saya gunakan adalah menambahkan batasan lebar pada tombol. Kemudian di suatu tempat di inisialisasi, setelah teks Anda diatur, perbarui batasan lebar seperti:

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

Di mana 8 adalah apa pun inset Anda.

memanggil sizeToFit () memastikan bahwa contentEdgeInset diberlakukan

extension UIButton {

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