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


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.