IOS 与圆角的矩形描边、 图标和标签中的自定义按钮
我想重新创建此按钮使用代码，所以它是一个可重用的对象，和您可以设置的最小宽度，高度，或它拉伸以适合的图标和标签。整个应用程序，我们会重复使用几个领域中的按钮，它将包括薄圆角的矩形中风、 背景颜色、 图标 (trans PNG) 和一个标签。我们想要的背景颜色和描边颜色可配置所以我们可以切换开/关按钮。
编辑: 几乎工作代码，但文本标签块是白色和需要调整大小图像以适合框架和两个为居中。
自定义按钮的代码：
#import "CustomButton.h"
@implementation CustomButton
- (id)initWithFrame:(CGRect)frame image:(NSString *)image title:(NSString *)title background:(UIColor *)background border:(UIColor *)border
self = [super initWithFrame:frame];
self = [UIButton buttonWithType:UIButtonTypeCustom];
CALayer *layer = [self layer];
self.contentVerticalAlignment = UIControlContentVerticalAlignmentB
self.contentHorizontalAlignment = UIControlContentHorizontalAlignmentC
// background
if (background) {
layer.backgroundColor = (__bridge CGColorRef)(background);
layer.backgroundColor = [[UIColor darkGrayColor] CGColor];
if (border) {
layer.borderColor = (__bridge CGColorRef) (border);
layer.borderColor = [[UIColor lightGrayColor] CGColor];
layer.cornerRadius = 2.0f;
layer.borderWidth = 0.5f;
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:image]];
[self addSubview:imageView];
// text label
UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 25, 55, 15)];
titleLabel.font = [[UIFont alloc] fontWithSize:7.00];
titleLabel.text =
[self addSubview:titleLabel];
[self setFrame:frame];
编辑: 更新后的代码块以上及有按钮才会出现在 viewController 的各自视图中使用以下代码：
CGRect buttonFrame = CGRectMake(125, 3, 52, 37);
CustomButton *btnNearby = [[CustomButton alloc] initWithFrame:buttonFrame image:@"map.png" title:@"NEARBY" background:nil border:nil];
[myCustomView addSubview:btnNearby];
自定义按钮将出现，但仍没有正确设置格式。
这里是一个示例图标 (带横贯白色 PNG)，应显示在按钮的中心。
所需的功能的摘要：
1） 可重用按钮 2） 可以有最小宽度/高度或重写以匹配标签的宽度和高度的图像 + 标签 3） 具有可配置描边颜色 4） 匹配按钮图标上方，描边 + 图标 + 标签 + 背景色 5） 可以更改边框颜色，切换开/关
解决方法 1:
我是能够解决这个问题，并确信它可以进一步推敲但作为所需问题现在显示按钮。看到希望的最终结果和下面的工作代码对齐，以帮助他人。
工作的截图：
工作代码：
CustomButton.h
#import &UIKit/UIKit.h&
#import &QuartzCore/QuartzCore.h&
@interface CustomButton : UIButton
- (id)initWithFrame:(CGRect)frame image:(NSString *)image title:(NSString *)title background:(UIColor *)background border:(UIColor *)
CustomButton.m
#import "CustomButton.h"
@implementation CustomButton
- (id)initWithFrame:(CGRect)frame image:(NSString *)image title:(NSString *)title background:(UIColor *)background border:(UIColor *)border
self = [super initWithFrame:frame];
self = [UIButton buttonWithType:UIButtonTypeCustom];
CALayer *layer = [self layer];
// background
if (background) {
layer.backgroundColor = (__bridge CGColorRef)(background);
layer.backgroundColor = [[UIColor darkGrayColor] CGColor];
if (border) {
layer.borderColor = (__bridge CGColorRef)(border);
layer.borderColor = [[UIColor lightGrayColor] CGColor];
layer.cornerRadius = 2.0f;
layer.borderWidth = 0.5f;
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(14,3,20,19)];
imageView.image = [UIImage imageNamed:image];
imageView.contentMode
= UIViewContentModeScaleAspectF
[self addSubview:imageView];
// text label
UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 20, 50, 14)];
titleLabel.opaque = NO;
titleLabel.numberOfLines = 1;
titleLabel.textAlignment = UITextAlignmentC
titleLabel.font = [UIFont systemFontOfSize:7.00];
titleLabel.textColor = [UIColor whiteColor];
titleLabel.backgroundColor = [UIColor clearColor];
titleLabel.text =
[self addSubview:titleLabel];
[self setFrame:frame];
实例化 UIImage 层有捡到的视图控制器上的按钮：
// Add custom button to image view background layer
CGRect buttonFrame = CGRectMake(125, 3, 50, 35);
CustomButton *btnNearby = [[CustomButton alloc] initWithFrame:buttonFrame image:@"map.png" title:@"NEARBY" background:nil border:nil];
[myCustomView addSubview:btnNearby];◇本站云标签50个Android开发技巧(12 为控件添加圆角边框) - 推酷
50个Android开发技巧(12 为控件添加圆角边框)
以创建一个灰色的带圆角边框的Button为例：
一、创建一个ShapeDrawable作为背景
在drawable目录下创建一个
button_rounded_background.xml文件：
&shape xmlns:android = &/apk/res/android&
android:shape= &rectangle& &
&solid android:color= &#AAAAAA& /&
&corners android:radius= &15dp& /&
见名知意，除了&solid/&,&corners/&标签外，&shape/&还支持很多不同功能标签，更多介绍请移步Android官方文档：
二、在Button中应用ShapeDrawable
main.xml：
&RelativeLayout xmlns:android = &/apk/res/android&
android:layout_width= &fill_parent&
android:layout_height= &fill_parent&
android:gravity= &center& &
android:id =&@+id/button&
android:layout_width =&wrap_content&
android:layout_height =&wrap_content&
android:background =&@drawable/button_rounded_background&
android:padding =&10dp&
android:text =&@string/hello&
android:textColor =&#000000& /&
&/RelativeLayout&
至此就已经构建完成了一个带圆角边框的Button。
ShapeDrawable不仅可以利用在Button中，它还可以应用与所有带背景的控件，例如ListView中的Item等。
已发表评论数()
已收藏到推刊！
请填写推刊名
描述不能大于100个字符!
权限设置： 公开
仅自己可见
正文不准确
排版有问题
没有分页内容
视频无法显示
图片无法显示