美文网首页swiftiOS DeveloperiOS 开发
iOS-小的Demo(Swift基础练习)--自定义进度条

iOS-小的Demo(Swift基础练习)--自定义进度条

作者: 云之君兮鹏 | 来源:发表于2016-08-06 18:04 被阅读439次
    零落成泥碾作尘,唯有香如故!<蓝蟾蜍>

    忙里偷闲练习一下 Swift
    效果图:

    自定义 barbutton.gif

    效果分析: 其实这个效果就是就是类似一个 UISlider只是自定义了滑块,使用的是 UIProgress 进度条, 点击进度条的上点, 滑块自动滑到对应的点! 这里的滑块可以换成其他的控件.
    思路: 我的思路就是在 UIProgress 进度条上添加一个 UIView 作为滑块, 然后进度上加点击手势根据点击的位置去调整进度条的进度值, 以及改变滑块的位置!

    代码部分:

    # 这个代理协议是为了在进度条改变的时候  让其代理执行方法  例如音频根据改变的进度去  相应的调整到对应的位置播放
    protocol DDProgressViewDelegate
    {
        func ddProgressView(ddProgressView: DDProgressView, changeProgress currenProgress:Float)
        
    }
    
    class DDProgressView: UIProgressView {
        
        // 进度条上的滑块
        let sliderView: UIView = UIView.init()
        // 代理
         var delegate:DDProgressViewDelegate?
        
    # 代码初始化方法
        override init(frame: CGRect) {
            super.init(frame: frame)
            // 设置一下  滑块的大小 位置 颜色 等属性
            sliderView.backgroundColor = UIColor.redColor()
            sliderView.bounds = CGRectMake(0, 0, 5, 5)
            // 让小滑块的中心点 在进度的端点位置
            sliderView.center = CGPointMake( CGFloat(self.progress) * self.bounds.size.width, self.bounds.size.height / 2);
            self.addSubview(sliderView)
            
            // 给滑条加一个手势 目的是为了点击滑条  进度端点就变成点击点位置
            self.userInteractionEnabled = true; // 开交互
            let tap: UITapGestureRecognizer = UITapGestureRecognizer.init(target: self, action: "tapAction:")
            self.addGestureRecognizer(tap)
        }
    # 可视化编程 初始化  
        required init?(coder aDecoder: NSCoder) {
            super.init(coder: aDecoder)
     // 设置一下  滑块的大小 位置 颜色 等属性
            sliderView.backgroundColor = UIColor.redColor()
            sliderView.bounds = CGRectMake(0, 0, 5, 5)
            sliderView.center = CGPointMake( CGFloat(self.progress) * self.bounds.size.width, self.bounds.size.height / 2);
            self.addSubview(sliderView)
            
     // 给滑条加一个手势 目的是为了点击滑条  进度端点就变成点击点位置
            self.userInteractionEnabled = true; // 开交互
            let tap: UITapGestureRecognizer = UITapGestureRecognizer.init(target: self, action: "tapAction:")
            self.addGestureRecognizer(tap)
            
           
        }
      
    // 点击进度条后执行的  手势事件
        func tapAction(tap : UITapGestureRecognizer)
        {
        let touchPoint: CGPoint = tap.locationInView(self)
        
    // 设置进度条的进度  当前点击的点前面的长度  占整个宽度的百分比  就是当前的进度
        self.setProgress(Float(touchPoint.x / self.bounds.size.width) , animated: true)
        
    // 进度条改变了 出发代理执行代理事件  让用的地方可以相应的改变  比如音频视频的播放进度调整
            self.delegate?.ddProgressView(self, changeProgress: self.progress)
        }
        
        
    // 重新把 子控件的滑块  布局到端点位置
        override  func layoutSubviews()
        {
            super.layoutSubviews()
    // 让小滑块的中心点 在进度的端点位置
            sliderView.center = CGPointMake( CGFloat(self.progress) * self.bounds.size.width, self.bounds.size.height / 2);
        }
        
    }
    

    相关文章

      网友评论

      本文标题:iOS-小的Demo(Swift基础练习)--自定义进度条

      本文链接:https://www.haomeiwen.com/subject/xmwksttx.html