首页 文章

对UIPageControl进行子类化以自定义活动和非活动点图像[关闭]

提问于
浏览
-1

我在我的应用程序中使用UIPageControl作为教程屏幕 . 这是UIPageViewController的基本用法,用户可以在其中滑动信息屏幕以获取有关应用程序使用情况的基本信息,同时每次滑动都会更新屏幕底部的UIPageControl点 .

这是具有色调颜色的常规点的样子

UIPageControl with regular dot

这就是我想做的事情(可以是任何图标)
UIPageControl with custom icon dot

我想要实现的是用我自己的图像替换默认页面控制圈,并设置它们的活动和非活动色调颜色 . 这种自定义实现的原因是因为在界面构建器中,只有可以调整的页面控件的可视部分是色调和当前页面颜色,具有默认大小的圆形项 .

所以我想实现相同的东西,但我自己的图像用于页面控制 . 一个例子很有用 .

1 回答

  • 2

    这是实现所需结果的一个例子

    class CustomPageControl: UIPageControl {
       let imgActive: UIImage = #imageLiteral(resourceName: "activeImg").withRenderingMode(.alwaysTemplate)
       let imgInactive: UIImage = #imageLiteral(resourceName: "inactiveImg")
    
       let customActiveYOffset: CGFloat = 5.0
       let customInactiveYOffset: CGFloat = 3.0
       var hasCustomTintColor: Bool = false
       let customActiveDotColor: UIColor = UIColor(rgb: 0xe62f3e, alphaVal: 1.0)
    
       override var numberOfPages: Int {
           didSet {
               updateDots()
           }
       }
    
       override var currentPage: Int {
           didSet {
               updateDots()
           }
       }
    
       override func awakeFromNib() {
           super.awakeFromNib()
           self.pageIndicatorTintColor = .clear
           self.currentPageIndicatorTintColor = .clear
           self.clipsToBounds = false
       }
    
       func updateDots() {
          var i = 0
          let activeSize = self.imgActive.size
          let inactiveSize = self.imgInactive.size
          let activeRect = CGRect(x: 0, y: 0, width: activeSize.width / 2, height: activeSize.height / 2)
          let inactiveRect = CGRect(x: 0, y: 0, width: inactiveSize.width, height: inactiveSize.height)
    
          for view in self.subviews {
              if let imageView = self.imageForSubview(view) {
                  if i == self.currentPage {
                    imageView.image = self.imgActive
                    if self.hasCustomTintColor {
                        imageView.tintColor = customActiveDotColor
                    }
                    imageView.frame = activeRect
                    imageView.frame.origin.y = imageView.frame.origin.y - customActiveYOffet
                  } else {
                    imageView.image = self.imgInactive
                    imageView.frame = inactiveRect
                    imageView.frame.origin.y = imageView.frame.origin.y - customInactiveYOffset
                  }
                  i = i + 1
              } else {
                  var dotImage = self.imgInactive
                  if i == self.currentPage {
                      dotImage = self.imgActive
                  }
                  view.clipsToBounds = false
                  let addedImageView: UIImageView = UIImageView(image: dotImage)
                  if dotImage == self.imgActive {
                     addedImageView.frame = activeRect
                     addedImageView.frame.origin.y = addedImageView.frame.origin.y - customActiveYOffet
                    if self.hasCustomTintColor {
                        addedImageView.tintColor = customActiveDotColor
                    }
                 } else {
                     addedImageView.frame.origin.y = addedImageView.frame.origin.y - customInactiveYOffset
                 }
                 view.addSubview(addedImageView)
                 i = i + 1
              }
          }
      }
    
     func imageForSubview(_ view:UIView) -> UIImageView? {
        var dot: UIImageView?
        if let dotImageView = view as? UIImageView {
            dot = dotImageView
        } else {
            for foundView in view.subviews {
                if let imageView = foundView as? UIImageView {
                    dot = imageView
                    break
                }
            }
        }
        return dot
    }
    

    尝试和/或修改,看看它是否运作良好 .

相关问题