TestsTested | ✗ |
LangLanguage | Obj-CObjective C |
License | MIT |
ReleasedLast Release | Dec 2014 |
Maintained by Pedro Piñera.
UIButton category with new methods to setup a button with text + FontAwesome Icon. Open App
-(void)setBackgroundColor:(UIColor*)color forUIControlState:(UIControlState)state;
+(UIButton*)buttonWithType:(UIButtonType)type text:(NSString*)text icon:(NSString*)icon textAttributes:(NSDictionary*)attributes andIconPosition:(IconPosition)position;
-(id)initWithFrame:(CGRect)frame text:(NSString*)text icon:(NSString*)icon textAttributes:(NSDictionary*)attributes andIconPosition:(IconPosition)position;
where you can specify text/icon attributes using an NSDictionary ( you'll find more information in Apple Documentation. Moreover you can specify position of Icon inside UIButton thanks to parameter IconPosition (Left or Right ))-(void)setTextAttributes:(NSDictionary*)attributes forUIControlState:(UIControlState)state;
backgroundColor--(void)setBackgroundColor:(UIColor*)color forUIControlState:(UIControlState)state;
iconPosition--(void)setIconPosition:(IconPosition)position;
buttonText--(void)setButtonText:(NSString*)text;
buttonIcon--(void)setButtonIcon:(NSString*)icon;
buttonRadius--(void)setRadius:(CGFloat)radius;
The easiest way to install PPiAwesomeButton is using CocoaPods:
1) Add the pod to podfile
pod 'PPiAwesomeButton'
pod 'FontAwesome+iOS', :git => '[email protected]:alexdrone/ios-fontawesome.git'
2) Refresh your project pods pod install
3) Add awesome font to your Info.plists setting UIAppFonts
entry as array and adding FontAwesome.ttf
to this array.
Here is an example of using for generate an UIButton with Twitter design
UIButton *twitter1=[UIButton buttonWithType:UIButtonTypeCustom text:@"Twitter" icon:@"icon-twitter" textAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15],NSForegroundColorAttributeName:[UIColor whiteColor]} andIconPosition:IconPositionLeft];
[twitter1 setBackgroundColor:[UIColor colorWithRed:27.0f/255 green:178.0f/255 blue:233.0f/255 alpha:1.0] forUIControlState:UIControlStateNormal];
[twitter1 setBackgroundColor:[UIColor colorWithRed:60.0f/255 green:89.0f/255 blue:157.0f/255 alpha:1.0] forUIControlState:UIControlStateHighlighted];
twitter1.frame=CGRectMake(10, 10, 120, 44);
[twitter1 setRadius:5.0];
[self.view addSubview:twitter1];
Here another one for a Pinterest button
UIButton *pinterest2=[UIButton buttonWithType:UIButtonTypeCustom text:@"Pin it!" icon:@"icon-pinterest" textAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:32],NSForegroundColorAttributeName:[UIColor whiteColor]} andIconPosition:IconPositionLeft];
[pinterest2 setBackgroundColor:[UIColor colorWithRed:205.0f/255 green:35.0f/255 blue:44.0f/255 alpha:1.0] forUIControlState:UIControlStateNormal];
[pinterest2 setBackgroundColor:[UIColor colorWithRed:244.0f/255 green:61.0f/255 blue:91.0f/255 alpha:1.0] forUIControlState:UIControlStateHighlighted];
pinterest2.frame=CGRectMake(10, 270, 280, 50);
[pinterest2 setRadius:0.0];
[self.view addSubview:pinterest2];
And for Facetime too:
UIButton *facetime1=[UIButton buttonWithType:UIButtonTypeCustom text:@"Facetime" icon:@"icon-facetime-video" textAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15],NSForegroundColorAttributeName:[UIColor whiteColor]} andIconPosition:IconPositionRight];
[facetime1 setBackgroundColor:[UIColor colorWithRed:40.0f/255 green:219.0f/255 blue:31.0f/255 alpha:1.0] forUIControlState:UIControlStateNormal];
facetime1.frame=CGRectMake(10, 160, 120, 44);
[facetime1 setRadius:22.0];
[self.view addSubview:facetime1];
If you've detected some misalignments in icon and text I've created a new class called UIAwesomeButton (UIView subclass) that has the same behaviour an UIButton has but implemented from zero ( and without misalignments between elements ). Here's an example of implementation into your project:
UIAwesomeButton *button4 = [[UIAwesomeButton alloc] initWithFrame:CGRectMake(10, 400, 280, 50) text:@"Test" icon:nil textAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15],NSForegroundColorAttributeName:[UIColor whiteColor],@"IconFont":[UIFont fontWithName:@"fontawesome" size:40]} andIconPosition:IconPositionLeft];
[button4 setBackgroundColor:[UIColor colorWithRed:205.0f/255 green:35.0f/255 blue:44.0f/255 alpha:1.0] forUIControlState:UIControlStateNormal];
[button4 setBackgroundColor:[UIColor colorWithRed:244.0f/255 green:61.0f/255 blue:91.0f/255 alpha:1.0] forUIControlState:UIControlStateHighlighted];
[button4 setRadius:3.0];
[button4 setSeparation:10];
[button4 setTextAlignment:NSTextAlignmentLeft];
[button4 setActionBlock:^{
NSLog(@"Working!");
}];
[self.view addSubview:button4];
Attributes that you can apply to text in an attributed string.
NSString *const NSFontAttributeName;
NSString *const NSParagraphStyleAttributeName;
NSString *const NSForegroundColorAttributeName;
NSString *const NSBackgroundColorAttributeName;
NSString *const NSLigatureAttributeName;
NSString *const NSKernAttributeName;
NSString *const NSStrikethroughStyleAttributeName;
NSString *const NSUnderlineStyleAttributeName;
NSString *const NSStrokeColorAttributeName;
NSString *const NSStrokeWidthAttributeName;
NSString *const NSShadowAttributeName;
NSString *const NSVerticalGlyphFormAttributeName;
Full list here
You'll find the list of Awesome Icons here. Each icon has an identifier that you have to use in UIButton to add an Icon to your UIButton.