自定义滑条封装含有百分比例显示(swift版)
2016-04-12 11:15
309 查看
之前经常会用UIProgress的控件,但是有时候有的地方会要求你上面有个显示比例的地方,所以为了方便以后用到就自己封装了一个小的demo!(http://img.blog.csdn.net/20160412110730682)
你只需在ViewController中写下如下简单代码便可实现
var progress:ProVSpre
progress = ProVSpre(frame: CGRect(x: 0,y: 100,width: self.view.frame.size.width,height: 15))
self.view.addSubview(progress)
progress.linewidth = 4
progress.trackColor = UIColor.magentaColor()
progress.precent = 0.5
progress.backColor = UIColor.greenColor()
当然还有好多属性你也可以自己定义根据你的需求
如下是所有属性
class ProVSpre: UIView{
你只需在ViewController中写下如下简单代码便可实现
var progress:ProVSpre
progress = ProVSpre(frame: CGRect(x: 0,y: 100,width: self.view.frame.size.width,height: 15))
self.view.addSubview(progress)
progress.linewidth = 4
progress.trackColor = UIColor.magentaColor()
progress.precent = 0.5
progress.backColor = UIColor.greenColor()
当然还有好多属性你也可以自己定义根据你的需求
如下是所有属性
class ProVSpre: UIView{
var widthLabel:Float = 60.0 //线的宽度 var linewidth:CGFloat = 5 // 跟踪的那个线的颜色 var trackColor:UIColor = UIColor.redColor() //剩下的后背景的颜色 var backColor:UIColor = UIColor.whiteColor() // 所增长的百分比例 var precent:Float = 0 // 划线的层 var drawlayer:CAShapeLayer! // 显示比例的label的控件 var presentlabel:UILabel! // 设置label的背景颜色 var titleBackColor:UIColor = UIColor.whiteColor() // border的颜色 var borderColor :UIColor = UIColor.blueColor() // 字体的颜色 var fontColor:UIColor = UIColor.blackColor() // 字体大小 var fontSize:Float = 12.0 }
// // proVSpre.swift // 滑条百分比例 // // Created by Aimee on 4/11/16. // Copyright © 2016 Aimee. All rights reserved. // import UIKit class ProVSpre: UIView { var widthLabel:Float = 60.0 //线的宽度 var linewidth:CGFloat = 5 // 跟踪的那个线的颜色 var trackColor:UIColor = UIColor.redColor() //剩下的后背景的颜色 var backColor:UIColor = UIColor.whiteColor() // 所增长的百分比例 var precent:Float = 0 // 划线的层 var drawlayer:CAShapeLayer! // 显示比例的label的控件 var presentlabel:UILabel! // 设置label的背景颜色 var titleBackColor:UIColor = UIColor.whiteColor() // border的颜色 var borderColor :UIColor = UIColor.blueColor() // 字体的颜色 var fontColor:UIColor = UIColor.blackColor() // 字体大小 var fontSize:Float = 12.0 override init(frame: CGRect) { precent = 0 presentlabel = UILabel() super.init(frame: frame) } required init?(coder aDecoder: NSCoder) { fatalError("init(coder:) has not been implemented") } override func layoutSubviews() { var textnum = precent * 100.0 // 拼接字符串 presentlabel.text = String(format: "%.2f%%", textnum) let total:Float = Float(self.frame.size.width) - widthLabel //设置CSAShapelayer来进行设置划线的操作 let path = UIBezierPath() path.moveToPoint(CGPoint(x: 0, y: linewidth/2)) path.addLineToPoint(CGPoint(x: Int(self.frame.size.width), y: Int(linewidth/2))) drawlayer = CAShapeLayer() drawlayer.frame = CGRect(x: 0, y: self.frame.size.height/2-linewidth/2, width: self.frame.size.width, height: linewidth) drawlayer.path = path.CGPath drawlayer.lineWidth = linewidth drawlayer.strokeStart = 0 drawlayer.strokeColor = trackColor.CGColor drawlayer.strokeEnd = 0 drawlayer.fillColor = UIColor.blackColor().CGColor drawlayer.backgroundColor = backColor.CGColor self.layer.addSublayer(drawlayer) // 给划线layer添加的动画效果,其中的时间duration和下面的label的动画时间是一样的为了她们的运动的同时性 let baseanimate = CABasicAnimation(keyPath: "strokeEnd") baseanimate.fromValue = NSNumber(float: 0) baseanimate.toValue = NSNumber(float: precent) baseanimate.fillMode = kCAFillModeForwards baseanimate.removedOnCompletion = false baseanimate.duration = CFTimeInterval(precent) drawlayer.addAnimation(baseanimate, forKey: nil) // 设置label 的一些属性 if self.frame.size.height > 40 { presentlabel.frame = CGRect(x: 0, y: self.frame.size.height/2 - CGFloat(widthLabel/2), width: CGFloat(widthLabel), height: 40) }else{ presentlabel.frame = CGRect(x: 0, y: 0, width: CGFloat(widthLabel), height: self.frame.size.height) } presentlabel.font = UIFont.systemFontOfSize(CGFloat(fontSize)) presentlabel.textColor = fontColor presentlabel.textAlignment = .Center presentlabel.layer.cornerRadius = presentlabel.frame.size.height/2; presentlabel.layer.masksToBounds = true presentlabel.layer.borderColor = borderColor.CGColor presentlabel.layer.borderWidth = 2 presentlabel.backgroundColor = titleBackColor self.addSubview(presentlabel) // label跟随动的动画效果 UIView.animateWithDuration(CFTimeInterval(precent), delay: 0, options: [], animations: { self.presentlabel.center.x = CGFloat(self.widthLabel/2 + total * self.precent) }, completion: nil) } // // Only override drawRect: if you perform custom drawing. // // An empty implementation adversely affects performance during animation. // override func drawRect(rect: CGRect) { // // Drawing code // } }
相关文章推荐
- swift Defer语法
- swift Guard语法
- Swift中声明协议中的class关键字的作用
- Swift中声明协议中的class关键字的作用
- Swift中声明协议中的class关键字的作用
- swift学习日记-可选链(optional chaining)
- swift学习日记-基础部分
- Swift字符串和基本数据类型之间转换
- Swift3.0获取APP版本号,提示用户升级
- Swift Tour
- Swift 定位 SwiftLocationManager
- swift 初步接触 基本语法 方法命名 !和?区别 as!和as?区别 let和var区别 extension override private (一)
- Openstack Swift 原理、架构与 API 介绍
- Swift基础语法(常量变量、数据类型、元组、可选、断言等)
- Swift开源项目汇总
- oc与swift混编教程
- OC 和swift混编网址
- swift.h和briging文件冲突,重复包含
- swift 基础
- swift学习体验