美图秀秀首页界面按钮设计(二)

  本文实现美图秀秀首页中的按钮,它包含3张图片和一个文本。通过开发按钮,我们可以学到iOS的自定义控件,绘制图片和文本的知识。【声明:本博客只能用作学习用途,不得用于商业用途,图片资源均来自官方,产生纠纷,本人不负责】效果如下图

    

关于绘制控件显示内容,我们需要使用CoreGraphics框架,下面简单介绍一下CoreGraphics。

 

  CoreGraphics

  Core Graphics是苹果提供的一套基于C的API,用于绘图操作。Core Graphics 使用图形上下文进行工作,这个上下文的作用像画家的画布一样。在图形上下文之外是无法绘图的,我们可以自己创建一个上下文,但是性能和内存的使用上,效率是非常低得。我们可以通过派生一个UIView的子类,获得它的上下文。在UIView中调用drawRect:方法时,会自动准备好一个图形上下文,可以通过调用UIGraphicsGetCurrentContext()来获取。 因为它是运行期间绘制图片,我们可以动态的做一些额外的操作。drawRect:是系统的方法,不要从代码里面直接调用 drawRect:,而应该使用setNeedsDisplay重绘.

  优点:

  快速、高效,减小应用的文件大小。同时可以自由地使用动态的、高质量的图形图像。 使用Core Graphics,可以创建直线、路径、渐变、文字与图像等内容,并可以做变形处理。

 

  图片资源

第一张为按钮UIControlStateNormal正常状态下的背景图片,第二张为按钮按下去的背景图片。‘

  绘制背景

 if (self.state == UIControlStateNormal) {buttonImage = self.normalButtonImage;CGContextSetFillColorWithColor(context, self.backgroundColor.CGColor);}else {CGContextSetFillColorWithColor(context, self.backgroundColorHighlighted.CGColor);if (self.titleLabel.text.length > 0) {
        }if (self.normalButtonImage != self.highlightedButtonImage && self.highlightedButtonImage != nil) {buttonImage = self.highlightedButtonImage;}else{buttonImage = self.normalButtonImage;}}

 

  绘制按钮显示图片

    CGRect buttonRect = CGRectMake(0.f, 0.f, rect.size.width, rect.size.height);

      UIBezierPath *buttonBezier = [UIBezierPath bezierPathWithRoundedRect:buttonRect cornerRadius:self.cornerRadius];

    [buttonBezier addClip];

      CGContextFillRect(context, buttonRect);

    if (buttonImage != nil) {CGImageRef buttonCGImage = buttonImage.CGImage;CGSize imageSize = CGSizeMake(CGImageGetWidth(buttonCGImage)/[self scale], CGImageGetHeight(buttonCGImage)/[self scale]);CGFloat buttonYOffset = (rect.size.height-kButtonOffset)/2.f - imageSize.height/2.f + kTopPadding;if (self.titleLabel.text.length == 0) {buttonYOffset = rect.size.height/2.f - imageSize.height/2.f;}[buttonImage drawInRect:CGRectMake(rect.size.width/2. - imageSize.width/2.f,buttonYOffset,imageSize.width,imageSize.height)];}

 

  绘制文本

    if (self.titleLabel.text.length > 0) {if (self.state == UIControlStateNormal) {CGContextSetFillColorWithColor(context, self.normalTextColor.CGColor);}else {CGContextSetFillColorWithColor(context, self.highlightedTextColor.CGColor);}[self.titleLabel.text drawInRect:CGRectMake(0.f, (buttonImage != nil ? rect.size.height-kButtonOffset+self.topPading *kTopPadding: rect.size.height/2 - 10.f), rect.size.width, 20.f)withFont:self.titleLabel.fontlineBreakMode:self.titleLabel.lineBreakModealignment:UITextAlignmentCenter];}

 

  添加按钮

btnHome = [FWButton button];[btnHome setTitle:[textArr objectAtIndex:i] forState:UIControlStateNormal];[btnHome setImage:[UIImage imageNamed:[imageViewImageArr objectAtIndex:i]] forState:UIControlStateNormal];[btnHome setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:[imageViewBackImageArr objectAtIndex:i]]]];[btnHome setBackgroundColorHighlighted:[UIColor colorWithPatternImage:[UIImage imageNamed:[highLightedBackImageArr objectAtIndex:i]]]];btnHome.frame = CGRectMake(row * (kWidth + kPadding) + page * WIDTH + startX, col * (kHeight + kPadding) + startY, kWidth, kHeight);[btnHome.titleLabel setFont:[UIFont systemFontOfSize:14]];[btnHome addTarget:self action:@selector(btnClicked:) forControlEvents:UIControlEventTouchUpInside];btnHome.topPading = 0.5;[self.scrolleView addSubview:btnHome];

 

 

项目下载

注:每篇随笔的项目代码都会有区别,请按需下载。

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/286158.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C语言试题四十一之请编写一个函数,用来删除字符串中的所有空格。

📃个人主页:个人主页 🔥系列专栏:C语言试题200例目录 💬推荐一款刷算法、笔试、面经、拿大公司offer神器 👉 点击跳转进入网站 ✅作者简介:大家好,我是码莎拉蒂,CSDN博客专家(全站排名Top 50),阿里云博客专家、51CTO博客专家、华为云享专家 1、题目 请编写一个…

第三方免费加固横向对比

前言 基于java开发的android应用由于其语言的特性,所以很容易被反编译,虽然android提供了proguard,但是也只是增加了源码阅读的难度,其中业务逻辑依旧可以分析得出。有些人通过各种破解手段将apk文件破解、反编译,然后…

(02).NET MAUI实战 布局

1.概要既然要做实战开发会建项目之后就需要认识布局控件了&#xff0c;本篇文章分享.NET MAUI中的一些基础常用的布局控件。GridStackLayoutFalyxLayoutAbsoluteLayout2.详细内容(1)Grid语法&#xff1a;<Grid RowDefinitions"50,50,50,50" RowSpacing"10&qu…

[Javascript] Avoid Creating floats if they are not needed

https://channel9.msdn.com/Series/Practical-Performance-Tips-to-Make-Your-HTMLJavaScript-Faster/06?WT.mc_id13400-DEV-sitepoint-article24 转载于:https://www.cnblogs.com/yoyohappy/p/5884629.html

七、后台入口及添加影院实现《仿淘票票系统前后端完全制作(除支付外)》

一、登录后台窗口显示与跳转 首先打开在线编辑器进入我们的项目&#xff1a;https://editor.ivx.cn/ 上一节已经完成了登录和注册功能&#xff0c;在这一节咱们将会实现对应的后台入口进入和一些后台功能的制作。 首先咱们需要记录一下登录的UID&#xff0c;因为咱们后台界面…

正则表达式 学习笔记4.3

下面看看逆序环视结构&#xff1a;publicclassGeneralSix { publicstaticvoidmain(String[] args) { String[] strings newString[]{"see","bee","tee"};String[] regexs newString[]{"(?<s)ee","(?<!s)ee"}; for…

【MATLAB统计分析与应用100例】案例003:matlab调用smooth函数进行加噪数据的平滑处理

文章目录 1. 产生加噪正弦波信号,绘制加噪波形图2. 利用移动平均法对加噪信号进行平滑处理,绘制平滑波形图3. 利用lowess方法对加噪信号进行平滑处理,绘制平滑波形图4. 利用rlowess方法对加噪信号进行平滑处理,绘制平滑波形图5. 利用loess方法对加噪信号进行平滑处理,绘制…

C语言试题四十二之假定输入的字符串中只包含字母和*号。请编写函数fun,它的功能是:将字符串中的前导*号全部移到字符串的尾部。

📃个人主页:个人主页 🔥系列专栏:C语言试题200例目录 💬推荐一款刷算法、笔试、面经、拿大公司offer神器 👉 点击跳转进入网站 ✅作者简介:大家好,我是码莎拉蒂,CSDN博客专家(全站排名Top 50),阿里云博客专家、51CTO博客专家、华为云享专家 1、题目 请编写一个…

linux curl模拟登录网页

有时在批量抓取网站页面内容时&#xff0c;是需要处于登录状态的&#xff0c;否则无法获取。curl这个强大的工具可以完成这个工作。之前最好也先了解一下http POST方法&#xff0c;网站登录大都是用这个办法。本文基本上参考这篇文章,来自依云s Blog&#xff0c;是archlinux中文…

APP上架到各大应用商店的小总结

转自https://blog.csdn.net/niezhipeng8/article/details/79103436 想要把APP上架到应用市场都要先注册开发者账号才可以。这里的方法包括注册帐号和后期上架及一些需要注意的问题。注意&#xff1a;首次提交应用绝对不能随便删除&#xff0c;否则后面再提交会显示应用APP冲突…

八、影片添加页实现《仿淘票票系统前后端完全制作(除支付外)》

一、影片添加页 首先打开在线编辑器进入我们的项目&#xff1a;https://editor.ivx.cn/ 上一届影院添加页功能已经完成&#xff0c;这一节咱们实现影片添加页内容。 影片添加页如下&#xff1a; 该页面实现起来比较简单&#xff0c;点击图片后使用文件上传组件进行图片上传…

MAUI 通用权限框架(ABP)

简介众所周知, MAUI目前发布正式版本了, 那么对应, MAUI对应的ABP框架也应该马上出现, 这点也恰巧在我的预料之中, 所以在去年年底就开始着手Xamarin.Forms的ABP框架迭代。到目前为止,针对Xamarin.Forms 以及 WPF版本的 ABP框架已经在之前的文章当中给大家介绍过。那么本次主要…

十六、Struts2文件上传与下载

文件上传与下载 1.文件上传前提&#xff1a;<form action"${pageContext.request.contextPath}/*" method"post" enctype"multipart/form-data"> 2.动作类中字段需要符合命名规范 表单字段名&#xff1a;image 动作类&#xff1a;…

C语言试题四十三之求出ss所指字符串中指定字符的个数,并返回此值。

📃个人主页:个人主页 🔥系列专栏:C语言试题200例目录 💬推荐一款刷算法、笔试、面经、拿大公司offer神器 👉 点击跳转进入网站 ✅作者简介:大家好,我是码莎拉蒂,CSDN博客专家(全站排名Top 50),阿里云博客专家、51CTO博客专家、华为云享专家 1、题目 请编写一个…

《Matlab实用案例》系列Matlab从入门到精通实用100例案例教程目录(持续更新)

文章目录1. 专栏简介2. 专栏地址3. 专栏目录1. 专栏简介 2. 专栏地址 「 刘一哥与GIS的故事 」之《Matlab使用案例》 3. 专栏目录 【MATLAB统计分析与应用100例】案例001&#xff1a;matlab使用Importdata函数导入文本txt数据【MATLAB统计分析与应用100例】案例002&#xff…

Quartz2 定时器 《一》(概述)

为什么80%的码农都做不了架构师&#xff1f;>>> Quartz2 说白了&#xff0c;就是个功能比较完善的定时器&#xff0c;可以通过指定的时间执行指定的任务。 应用范围 a.比如让商城的活动&#xff08;对象&#xff09;在指定的时间&#xff08;定时&#xff0…

SQL 数据库远程备份 语句

DECLARE DATABakPath VARCHAR(200) N\\192.168.0.22\DataBak --远程共享目录&#xff08;备份文件夹根目录&#xff09; DECLARE UserName VARCHAR(50) N192.168.0.22\dbuser --远程目录访问用户账户 DECLARE UserPwd VARCHAR(50) N123456 --远程目录访问用户密码 DECLARE R…

九、为影院添加影片《仿淘票票系统前后端完全制作(除支付外)》

一、数据获取 首先打开在线编辑器进入我们的项目&#xff1a;https://editor.ivx.cn/ 上一节已展示了影院页&#xff0c;但是你点击影院页进入后将看不到任何数据&#xff0c;这是因为当前影院还未有添加的影片&#xff0c;本节之后将会从页面开始完成这个功能。 首先我们应…

大话领域驱动设计——基础设施层

概述基础设施层是整个系统的⽀持层&#xff0c;通过对第三⽅类库的调⽤或系统的抽象和集成来实现对其他层的⽀持。与传统架构不同在DDD中&#xff0c;数据库访问的具体实现&#xff08;仓储&#xff09;也被放在了基础设施层。在DDD的理念中&#xff0c;基础设施层是为领域和用…

C语言试题四十四之移动一维数组中的内容,若数组中由n个整数,要求把下标从0到p(p小于等于n-1)的数组元素平移到数组的最后。

📃个人主页:个人主页 🔥系列专栏:C语言试题200例目录 💬推荐一款刷算法、笔试、面经、拿大公司offer神器 👉 点击跳转进入网站 ✅作者简介:大家好,我是码莎拉蒂,CSDN博客专家(全站排名Top 50),阿里云博客专家、51CTO博客专家、华为云享专家 1、题目 请编写一个…