Cara membulatkan sudut tombol


182

Saya memiliki gambar persegi panjang (jpg) dan ingin menggunakannya untuk mengisi latar belakang tombol dengan sudut bulat di xcode.

Saya menulis yang berikut ini:

UIButton *button = [[UIButton buttonWithType:UIButtonTypeRoundedRect] retain];
CGRect frame = CGRectMake(x, y, cardWidth, cardHeight);
button.frame = frame;
[button setBackgroundImage:backImage forState:UIControlStateNormal];

Namun, tombol yang saya dapatkan dengan pendekatan itu tidak memiliki sudut yang membulat: melainkan persegi panjang polos yang persis seperti gambar asli saya. Bagaimana saya bisa mendapatkan gambar dengan sudut bulat untuk mewakili tombol saya?

Terima kasih!

Jawaban:


436

Saya pikir saya punya masalah Anda, saya mencoba solusi berikut dengan UITextArea dan saya kira ini akan bekerja dengan UIButton juga.

pertama-tama impor ini di file .m Anda -

#import <QuartzCore/QuartzCore.h>

dan kemudian dalam loadViewmetode Anda tambahkan baris berikut

    yourButton.layer.cornerRadius = 10; // this value vary as per your desire
    yourButton.clipsToBounds = YES;

Semoga ini berhasil untuk Anda dan jika ya, lakukan komunikasi.


6
Juga bekerja dengan inspektur "Atribut Buatan Pengguna Runtime"
Avi Cherry

Bekerja dengan cepat juga! Ubah saja YA menjadi benar.
Andrew Thomas

119

Anda dapat mencapai dengan Atribut RunTime ini

masukkan deskripsi gambar di sini

kita dapat membuat tombol kustom. cukup lihat tangkapan layar terlampir.

mohon memperhatikan:

dalam atribut runtime untuk mengubah warna perbatasan ikuti instruksi ini

  1. buat kelas kategori CALayer

  2. dalam file h

    @property(nonatomic, assign) UIColor* borderIBColor;
  3. dalam file m:

    -(void)setBorderIBColor:(UIColor*)color {
        self.borderColor = color.CGColor;
    }
    
    -(UIColor*)borderIBColor {
        return [UIColor colorWithCGColor:self.borderColor];
    }

sekarang dan seterusnya untuk mengatur tangkapan layar pemeriksaan warna perbatasan

jawaban yang diperbarui

Terima kasih


4
Hanya saya atau apakah informasi dalam jawaban tidak lengkap? Itu tidak benar-benar bekerja. Pembaruan: ini berfungsi selama saya tidak menentukan borderColor. Tapi kemudian selalu menggunakan warna hitam untuk borderColor.
Jonny

3
Jawaban yang diperluas: Warna yang diatur dalam IB kemungkinan jenis UIColor yang tidak berfungsi dengan borderColor, yang merupakan CGColorRef. Atau semacam itu. Jadi solusinya adalah membuat kategori pada CALayer, dengan sesuatu seperti @property(nonatomic, assign) UIColor* borderIBColor;(yang tidak berbenturan dengan nama lain) dalam file header, dan implementasinya adalah:-(void)setBorderIBColor:(UIColor*)color{self.borderColor = color.CGColor;} -(UIColor*)borderIBColor{return [UIColorcolorWithCGColor:self.borderColor];}
Jonny

1
Jika Anda tidak ingin warna batas, atur borderRadius ke 0 dan Anda tidak akan memilikinya!
jungledev

Bagaimana dengan Swift?
Jayprakash Dubey

1
@JayprakashDubey saya membuat ekstensi CALayer.
Krutarth Patel

14

Anda mungkin ingin memeriksa perpustakaan saya yang disebut DCKit . Itu ditulis pada versi terbaru Swift .

Anda dapat membuat tombol sudut / bidang teks bulat dari pembuat antarmuka secara langsung:

DCKit: tombol bulat

Ini juga memiliki banyak fitur keren lainnya, seperti bidang teks dengan validasi, kontrol dengan batas, garis putus-putus, tampilan lingkaran dan garis rambut dll.


11

Mendorong ke batas jari-jari sudut hingga mendapatkan lingkaran:

    self.btnFoldButton.layer.cornerRadius = self.btnFoldButton.frame.height/2.0;

masukkan deskripsi gambar di sini

Jika bingkai tombol berbentuk bujur sangkar, tidak masalah frame.height atau frame.width. Kalau tidak, gunakan yang terbesar dari keduanya.


7

Impor kerangka kerja QuartCore jika tidak ada di proyek Anda yang ada, lalu impor #import <QuartzCore/QuartzCore.h>di viewcontroller.m

UIButton *button = [[UIButton buttonWithType:UIButtonTypeRoundedRect]];
CGRect frame = CGRectMake(x, y, width, height); // set values as per your requirement
button.layer.cornerRadius = 10;
button.clipsToBounds = YES;

6
UIButton* closeBtn = [[UIButton alloc] initWithFrame:CGRectMake(10, 50, 90, 35)];
//Customise this button as you wish then
closeBtn.layer.cornerRadius = 10;
closeBtn.layer.masksToBounds = YES;//Important

4

Lebar set pertama = 100 dan Tinggi = 100 tombol

Tujuan C Solusi

YourBtn1.layer.cornerRadius=YourBtn1.Frame.size.width/2;
YourBtn1.layer.borderColor=[uicolor blackColor].CGColor;
YourBtn1.layer.borderWidth=1.0f;

Solusi Swift 4

YourBtn1.layer.cornerRadius = YourBtn1.Frame.size.width/2
YourBtn1.layer.borderColor = UIColor.black.cgColor
YourBtn1.layer.borderWidth = 1.0

2

Jika Anda ingin sudut bulat hanya untuk satu sudut atau dua sudut, dll ... baca posting ini:

[ObjC] - UIButton dengan sudut bundar - http://goo.gl/kfzvKP

Ini adalah subclass XIB / Storyboard. Impor dan tetapkan batas tanpa menulis kode.



2

diperbarui untuk Swift 3:

digunakan kode di bawah ini untuk membuat putaran sudut UIButton:

 yourButtonOutletName.layer.cornerRadius = 0.3 *
        yourButtonOutletName.frame.size.height

2

Coba kode saya. Di sini Anda dapat mengatur semua properti UIButton seperti warna teks, warna latar belakang, radius sudut, dll.

extension UIButton {
    func btnCorner() {
        layer.cornerRadius = 10
        clipsToBounds = true
        backgroundColor = .blue
    }
}

Sekarang panggil seperti ini

yourBtnName.btnCorner()


0

Untuk iOS SWift 4

button.layer.cornerRadius = 25;
button.layer.masksToBounds = true;

0

masukkan deskripsi gambar di sini

Untuk Tujuan C :

submitButton.layer.cornerRadius = 5;
submitButton.clipsToBounds = YES;

Untuk Swift :

submitButton.layer.cornerRadius = 5
submitButton.clipsToBounds = true

0

Pembaruan Swift 4

Saya juga mencoba banyak pilihan namun saya tidak bisa mendapatkan putaran UIButton saya terpojok. Saya menambahkan kode jari-jari sudut di dalam viewDidLayoutSubviews()masalah Saya.

func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        anyButton.layer.cornerRadius = anyButton.frame.height / 2
    }

Kami juga dapat menyesuaikan cornerRadius sebagai berikut

func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        anyButton.layer.cornerRadius = 10 //Any suitable number as you prefer can be applied 
    }
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.