Як закруглити кути кнопки


182

У мене є зображення прямокутника (jpg) і хочу використовувати його, щоб заповнити фон кнопки закругленим кутом у xcode.

Я написав таке:

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

Однак у кнопки, яку я отримую при такому підході, немає її закруглених кутів: натомість це звичайний прямокутник, який виглядає точно як моє оригінальне зображення. Як я можу отримати замість зображення із закругленим кутом зображення моєї кнопки?

Дякую!

Відповіді:


436

Я думаю, що у мене виникла ваша проблема, я спробував таке рішення з UITextArea, і, мабуть, це буде працювати і з UIButton.

насамперед імпортуйте це у свій .m файл -

#import <QuartzCore/QuartzCore.h>

а потім у своєму loadViewметоді додайте наступні рядки

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

Сподіваємось, це працює для вас, і якщо так, то спілкуйтеся.


6
Також працює з інспектором "Атрибути, визначені користувачем"
— Avi Cherry

Працює і для швидкого! Просто змініть ТАК на справжній.
— Ендрю Томас

119

Ви можете досягти за допомогою цих атрибутів RunTime

введіть тут опис зображення

ми можемо зробити власні кнопки. просто побачити скріншот, що додається.

ласкаво зверніть увагу:

під час виконання атрибутів для зміни кольору рамки виконайте цю інструкцію

  1. створити категорію класу CALayer

  2. у h-файлі

    @property(nonatomic, assign) UIColor* borderIBColor;
  3. у файлі m:

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

тепер, щоб встановити скріншот перевірки кольору межі

оновлена ​​відповідь

Дякую


4
Тільки я або інформація у відповіді неповна? Це насправді не працює. Оновлення: працює, поки я не вказую borderColor. Але тоді він завжди використовує чорний колір для кордону кольору.
— Джоні

3
Розширена відповідь: Набір кольорів у ІБ, ймовірно, типу UIColor, який не працює з borderColor, що є CGColorRef. Або щось подібне. Таким чином, рішення - створити категорію на CALayer, яка має щось подібне @property(nonatomic, assign) UIColor* borderIBColor;(що не зіштовхується з якоюсь іншою назвою) у заголовковому файлі, а реалізація така:-(void)setBorderIBColor:(UIColor*)color{self.borderColor = color.CGColor;} -(UIColor*)borderIBColor{return [UIColorcolorWithCGColor:self.borderColor];}
— Jonny,

1
Якщо ви не хочете кольору рамки, встановіть borderRadius на 0, і його у вас не буде!
— jungledev

А що з Свіфтом?
— Джайпракаш Дубей

1
@JayprakashDubey я створюю розширення CALayer.
— Krutarth Patel

14

Ви можете перевірити мою бібліотеку під назвою DCKit . Це написано на останній версії Swift .

Ви можете зробити закруглену кутову кнопку / текстове поле безпосередньо з конструктора інтерфейсів:

DCKit: округла кнопка

Він також має багато інших цікавих функцій, таких як текстові поля з валідацією, елементи керування рамками, пунктирні рамки, перегляд кола та лінії волосся тощо


11

Натискаючи на межі радіуса кута вгору, щоб отримати коло:

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

введіть тут опис зображення

Якщо рамка кнопки - квадрат, це не має значення висота рамки або ширина рамки. В іншому випадку використовуйте найбільші з обох.


7

Імпортуйте рамку QuartCore, якщо її немає у вашому існуючому проекті, тоді імпортуйте #import <QuartzCore/QuartzCore.h>у 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

Спочатку встановіть ширину = 100 та висоту = 100 кнопки

Завдання C Рішення

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

Swift 4 Рішення

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

2

Якщо ви хочете закруглений кут лише до одного кута або двох кутів тощо ... читайте цей пост:

[ObjC] - UIButton із закругленим кутом - http://goo.gl/kfzvKP

Це підклас XIB / Розповідь. Імпорт і встановлення меж без коду запису.



2

оновлено для Swift 3:

Нижче використовується код, щоб зробити кут UIButton круглим:

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

2

Спробуйте мій код. Тут ви можете встановити всі властивості UIButton, такі як колір тексту, колір тла, радіус кута тощо.

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

Тепер дзвоніть так

yourBtnName.btnCorner()




0

Швидке оновлення 4

Я також спробував багато варіантів, але мені не вдалося закрутити свій UIButton. Я додав код радіуса кута всередині viewDidLayoutSubviews()вирішеної проблеми.

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

Також ми можемо відрегулювати кут Радіус наступним чином

func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        anyButton.layer.cornerRadius = 10 //Any suitable number as you prefer can be applied 
    }
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.