iOS - 一个简单的带标题的图标的实现
代码不复杂,直接上代码:
ImageViewButton.h
//
// ImageViewButton.h//
// 带有图片、底部标题或者顶部的按钮
//
// #import <UIKit/UIKit.h> NS_ASSUME_NONNULL_BEGIN @interface ImageViewButton : UIView /**
* 带有图标标题的按钮
*
* @param frame 大小
* @param image 图标
* @param title 标题
* @param topTitle 标题是否在顶部
*
*/
- (instancetype)initWithFrame:(CGRect)frame image:(NSString *)image title:(NSString *)title topTitle:(BOOL)topTitle; // 按钮点击回调
@property (copy, nonatomic) void (^iconClickCallback) (void); @end NS_ASSUME_NONNULL_END
ImageViewButton.m
//
// ImageViewButton.m
// #import "ImageViewButton.h" @interface ImageViewButton () // 图标
@property (strong, nonatomic) UIButton *iconButton;
// 标题
@property (strong, nonatomic) UILabel *titleLabel;
// 标题是否在顶部
@property (assign, nonatomic) BOOL topTitle; @end @implementation ImageViewButton - (instancetype)initWithFrame:(CGRect)frame image:(NSString *)image title:(NSString *)title topTitle:(BOOL)topTitle {
if (self = [super initWithFrame:frame]) {
self.topTitle = topTitle;
self.translatesAutoresizingMaskIntoConstraints = NO; // 图标
self.iconButton = [[UIButton alloc] initWithFrame:CGRectZero]; self.iconButton.translatesAutoresizingMaskIntoConstraints = NO;
[self.iconButton setImage:[UIImage imageNamed:image] forState:UIControlStateNormal];
[self.iconButton addTarget:self action:@selector(iconButtonClick:) forControlEvents:UIControlEventTouchUpInside]; [self addSubview:self.iconButton]; // 标题
self.titleLabel = [[UILabel alloc] initWithFrame:CGRectZero]; self.titleLabel.translatesAutoresizingMaskIntoConstraints = NO;
self.titleLabel.textAlignment = NSTextAlignmentCenter;
self.titleLabel.textColor = [UIColor whiteColor];
self.titleLabel.text = title; [self addSubview:self.titleLabel]; [self setConstraints];
} return self;
} - (void)iconButtonClick:(UIButton *)sender {
if (self.iconClickCallback) {
self.iconClickCallback();
}
} - (void)setConstraints {
// 标题
NSLayoutConstraint *titleLabelTopBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0];
NSLayoutConstraint *titleLabelLeadingLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0.0];
NSLayoutConstraint *titleLabelTrailingLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:0.0];
NSLayoutConstraint *titleLabelHeightLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1.0 constant:16.0]; // 图标
NSLayoutConstraint *iconImageViewWidthHeightLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.iconButton attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0.0];
NSLayoutConstraint *iconImageViewCenterXLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:0.0];
NSLayoutConstraint *iconImageViewTopLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.titleLabel attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0];
NSLayoutConstraint *iconImageViewBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0]; if (self.topTitle == NO) {
// 标题在底部
titleLabelTopBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0];
iconImageViewTopLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0];
iconImageViewBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.titleLabel attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0];
} [self addConstraints:@[titleLabelTopBottomLayoutConstraint, titleLabelLeadingLayoutConstraint, titleLabelTrailingLayoutConstraint, titleLabelHeightLayoutConstraint, iconImageViewWidthHeightLayoutConstraint, iconImageViewCenterXLayoutConstraint, iconImageViewTopLayoutConstraint, iconImageViewBottomLayoutConstraint]];
} /*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
// Drawing code
}
*/ @end
iOS - 一个简单的带标题的图标的实现的更多相关文章
- avalon实现一个简单的带增删改查的成绩单
自从angular问世,一直就有去了解学习angular,一直想用angular去做一个项目,但无奈,大ng是国外产物,ng1.2版本就只兼容到IE8,1.3后的几个版本提升到IE9,据说NG2.0更 ...
- iOS一个简单的设置圆角不引起性能问题的分类
http://www.cocoachina.com/articles/18756 iOS设置圆角矩形和阴影效果 https://www.cnblogs.com/rayshen/p/4900336.ht ...
- 一个简单实用的css loading图标
摘要 在web开发中,为了提高用户体验,在加载数据的时候都会给一个loading的提示. Html <!DOCTYPE html> <html xmlns="http:// ...
- 一个简单的带缓存http代理
眼下1.0版模型非常easy.即对客户机发来的请求进行简单处理后,转发到server.转发之前先检查本地缓存.假设有.则直接回送给客户本地资源 程序流程大致例如以下图: 缓存是通过把文件保存到磁盘上, ...
- iOS 一个简单的单例
比如我有一个Singleton的类(DemoStatusManage),他有一个实例方法currentStatus会返回一个1-100的随机数. @interface DemoStatusManage ...
- 从零开始,做一个简单的Vuetify项目,图标安装成功
安装Vuefity的时候,碰到一些坑,经过一番折腾,终于成功,记录正确的姿势如下: 创建一个Vue项目: vue init webpack-simple vular-admin 进入项目目录: cd ...
- 随手撸一个简单的带检查的printf
#include <stdio.h> #include <iostream> #include <vector> #include <string> # ...
- Bootstrap+JSP实例学习笔记一.简单的带登录功能的首页
前言 Bootstrap 是流行的 HTML.CSS 和 JS 框架,用于开发响应式布局.移动设备优先的 WEB 项目.源自于twiteer内部的开发框架. 当前(2019-05)最新版本是v3.3. ...
- iOS开发UI篇—使用嵌套模型完成的一个简单汽车图标展示程序
iOS开发UI篇—使用嵌套模型完成的一个简单汽车图标展示程序 一.plist文件和项目结构图 说明:这是一个嵌套模型的示例 二.代码示例: YYcarsgroup.h文件代码: // // YYcar ...
随机推荐
- Netty快速入门(10)Reactor与Netty
Reactor模式 Reactor是1995年由道格拉斯提出的一种高性能网络编程模式.由于好多年了,当时的一些概念与现在略有不同,reactor模式在网络编程中是非常重要的,可以说是NIO框架的典型模 ...
- JSP九大内置对象之session以及eclispe如何关联源码
一.session的特点及其实例 session:同一次会话共享 a.浏览网站:开始->关闭 b.购物:浏览.付款.退出 c.电子邮件:浏览.写邮件.退出 从一次开始到一次结束,是一次会话. ...
- 云资源中的低成本战斗机——竞价实例,AWS、阿里云等六家云厂商完全用户使用指南
云端资源价格 预留实例:长期持有,批发路线,价格最便宜. 按需实例:即买即用,零售路线,价格最贵. 这两种资源,基于不同区域/价格的六家云厂商价格对比,连同原始数据文档我们已经打包成了一份电子文档,有 ...
- 【Java编程思想阅读笔记】Java数据存储位置
Java数据存储位置 P46页有感 一.前置知识 栈是由系统自动分配的,Java程序员对栈没有直接的操作权限, 堆是所有线程共享的内存区域,栈 是每个线程独享的. 堆是由程序员自己申请的,在使用new ...
- mysql索引创建和使用细节(二)
上篇粗略记录当mysql字段类型是string,传入int类型参数后失效当问题. 现在测试下mysql字段是int类型,传参string类型会发生什么. 题外话,最近膝盖手术后还在家养伤中,只怪自己以 ...
- java 运行和编译
一.编译->运行 1.编译 javac 文件名.java 生成 文件名.class 2.运行 java 文件名 注意:正在运行的是 文件名.class 因此:修改源文件后,要先编译,再运行 ...
- 我的第一个 Kaggle 比赛学习 - Titanic
背景 Titanic: Machine Learning from Disaster - Kaggle 2 年前就被推荐照着这个比赛做一下,结果我打开这个页面便蒙了,完全不知道该如何下手. 两年后,再 ...
- Markdown 标记 粘贴到 小书 匠 才知道 哦
# 一级标题## 这是二级标题### 三级标题##### 五级 高阶== 低阶-- [TOC] > 这是一级引用>>这是二级引用>>> 这是三级引用 ```java ...
- Dynamics email的subject标题出现 CRM:0000xxxx
怎样移除email subject标题中出现的CRM:0000xxxx Settings->Administration->System Settings->Email->Un ...
- airtest启用本地python环境的方法
实现目标,air如果想引用第三方python库,则需要在本地python欢迎执行运行 1.打开设置,红色箭头处,选择本地python路径 2.安装air的两个核心库airtest和pocoui 安装方 ...