用图像快速更改页面控制点

Posted 2023-03-14

【中文标题】用图像快速更改页面控制点

【英文标题】：Changing page control dots with images swift

【发布时间】：2018-04-12 08:47:21

【问题描述】：

我正在尝试用一些图像更改页面控件中的点..

这是我尝试过的代码：

import UIKit
class PageViewController: UIPageViewController, UIPageViewControllerDelegate, UIPageViewControllerDataSource 
// MARK: Data source functions.
func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController: UIViewController) -> UIViewController? 
    guard let viewControllerIndex = orderedViewControllers.index(of: viewController) else 
        return nil
    
   let previousIndex = viewControllerIndex - 1
    guard previousIndex >= 0 else 
        return orderedViewControllers.last
        // Uncommment the line below, remove the line above if you don't want the page control to loop.
        // return nil
    
    guard orderedViewControllers.count > previousIndex else 
        return nil
    
    return orderedViewControllers[previousIndex]
   
   func pageViewController(_ pageViewController: UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? 
    guard let viewControllerIndex = orderedViewControllers.index(of: viewController) else 
        return nil
    
    let nextIndex = viewControllerIndex + 1
    let orderedViewControllersCount = orderedViewControllers.count
    // the first view controller.
    guard orderedViewControllersCount != nextIndex else 
        return orderedViewControllers.first
        // Uncommment the line below, remove the line above if you don't want the page control to loop.
        // return nil
    
    guard orderedViewControllersCount > nextIndex else 
        return nil
    
    return orderedViewControllers[nextIndex]
    
   lazy var orderedViewControllers: [UIViewController] = 
    return [self.newVc(viewController: "sbYellow"),
            self.newVc(viewController: "sbRed"),
            self.newVc(viewController: "sbBlue")]
()
var pageControl = UIPageControl()
override func viewDidLoad() 
    super.viewDidLoad()
    self.dataSource = self
    // This sets up the first view that will show up on our page control
    if let firstViewController = orderedViewControllers.first 
        setViewControllers([firstViewController],
                           direction: .forward,
                           animated: true,
                           completion: nil)
    
    let pageControl = CustomPageControl(frame: CGRect(x: 100, y: 100, width: 104, height: 40))
    pageControl.numberOfPages = 3
    pageControl.currentPage = 0
    self.view.addSubview(pageControl)
    /*self.delegate = self
    configurePageControl()*/
    // Do any additional setup after loading the view.

override func didReceiveMemoryWarning() 
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.

func configurePageControl() 
    // The total number of pages that are available is based on how many available colors we have.
    pageControl = UIPageControl(frame: CGRect(x: 0,y: UIScreen.main.bounds.maxY - 50,width: UIScreen.main.bounds.width,height: 50))
    self.pageControl.numberOfPages = orderedViewControllers.count
    self.pageControl.currentPage = 0
    self.pageControl.tintColor = UIColor.black
    self.pageControl.pageIndicatorTintColor = UIColor.white
    self.pageControl.currentPageIndicatorTintColor = UIColor.black
    self.view.addSubview(pageControl)

func newVc(viewController: String) -> UIViewController 
    return UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: viewController)

func pageViewController(_ pageViewController: UIPageViewController, didFinishAnimating finished: Bool, previousViewControllers: [UIViewController], transitionCompleted completed: Bool) 
    let pageContentViewController = pageViewController.viewControllers![0]
    self.pageControl.currentPage = orderedViewControllers.index(of: pageContentViewController)!


class CustomPageControl: UIPageControl 
var imageToBeReplacedByDot: UIImage 
return  imageLiteral(resourceName: "av_timer - material")// Image you want to 
replace with dots

var circleImage: UIImage 
return  imageLiteral(resourceName: "cancel - material")//Default Image

override var numberOfPages: Int 
didSet 
updateDots()

override var currentPage: Int 
didSet 
updateDots()

override func awakeFromNib() 
    super.awakeFromNib()
    self.pageIndicatorTintColor = UIColor.clear
    self.currentPageIndicatorTintColor = UIColor.clear
    self.clipsToBounds = false

func updateDots() 
    var i = 0
    for view in self.subviews 
        var imageView = self.imageView(forSubview: view)
        if imageView == nil 
            if i == 0 
                imageView = UIImageView(image: imageToBeReplacedByDot)
             else 
                imageView = UIImageView(image: circleImage)
            
            imageView!.center = view.center
            view.addSubview(imageView!)
            view.clipsToBounds = false
        
        if i == self.currentPage 
            imageView!.alpha = 1.0
         else 
            imageView!.alpha = 0.5
        
        i += 1
    

fileprivate func imageView(forSubview 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

哪个工作正常并用图像更改点...问题是如果我滚动图像不会改变！..我还想将页面控件定位在屏幕的中心顶部..

如何实现？

截图：

【问题讨论】：

滚动时是否调用了updateDots()？

【参考方案1】：

您可以使用此代码作为参考：

import UIKit

class LocationPageControl: UIPageControl 

let locationArrow: UIImage = UIImage(named: "locationArrow")!
let pageCircle: UIImage = UIImage(named: "pageCircle")!

override var numberOfPages: Int 
    didSet 
        updateDots()
    


override var currentPage: Int 
    didSet 
        updateDots()
    


override func awakeFromNib() 
    super.awakeFromNib()
    self.pageIndicatorTintColor = UIColor.clear
    self.currentPageIndicatorTintColor = UIColor.clear
    self.clipsToBounds = false


func updateDots() 
    var i = 0
    for view in self.subviews 
        var imageView = self.imageView(forSubview: view)
        if imageView == nil 
            if i == 0 
                imageView = UIImageView(image: locationArrow)
             else 
                imageView = UIImageView(image: pageCircle)
            
            imageView!.center = view.center
            view.addSubview(imageView!)
            view.clipsToBounds = false
        
        if i == self.currentPage 
            imageView!.alpha = 1.0
         else 
            imageView!.alpha = 0.5
        
        i += 1
    


fileprivate func imageView(forSubview 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

注意：-根据需要设置图片

【讨论】：

我该如何使用它？可以给个完整的示例代码吗？

@Lama 您可以看到这里的两个点已被顶部的图像替换。您可以对您的项目实施相同的操作

您从哪里获取图像。？它是从资产中还是直接复制到 Xcode 中，即拖放。？

您在查找图像时遇到错误。让 locationArrow: UIImage = UIImage(named: "locationArrow")!像这样，请双重交叉验证您使用的图像名称。

我确实仔细检查了它并且它正确并没有错，但它返回 nil :(