在Tab Swift中使用页面视图控制器 [英] Using Page View Controller inside Tab Swift

查看:47
本文介绍了在Tab Swift中使用页面视图控制器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的工作如此之遥:

所以我有一个如下所示的标签栏:

So I have a Tab bar that looks like this:

当我单击餐厅时,我想定向到页面视图控制器

When I click on "Canteen" I want to be directed to a Page View Controller where I can swipe between different pages but stay on the same tab.

我在这里可以在不同页面之间滑动,但仍处于同一标签上。

I have this somewhat working:

我的故事板设置如下:

如您所见,上面的segue来自选项卡栏控制器。

As you can see that segue above is coming from the Tab Bar Controller.

第三个视图(可页面项目控制器,ID: CanItemController)用于其中的所有页面页面视图。

The third view (Can Page Item Controller, ID: "CanItemController) is used for all pages in the page view.

上方的第二个视图(页面视图控制器,ID: CanP ageController)用于控制页面(duh)

The second view above (Page View Controller, ID: "CanPageController) is used for controlling the Pages (duh)

第一个视图(CanteenViewController)包含所有代码并进行所有连接。这就是一切进行的地方。此类中的代码在这里:

The first view (CanteenViewController) contains all the code and makes all the connections. This is where everything goes on. The code inside this class is here:

import UIKit

class CanteenViewController: UIViewController, UIPageViewControllerDataSource {

    // MARK: - Variables
    private var pageViewController: UIPageViewController?

    private let contentImages = ["Radar-512.png",
        "dartp.png",
        "roomp.png",
        "abnews.png",
        "canteenp.png"];

    override func viewDidLoad() {
        super.viewDidLoad()

        createPageViewController()
        setupPageControl()            
    }

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

    private func createPageViewController() {

        let pageController = self.storyboard!.instantiateViewControllerWithIdentifier("CanPageController") as! UIPageViewController
        pageController.dataSource = self

        if contentImages.count > 0 {
            let firstController = getItemController(0)!
            let startingViewControllers: NSArray = [firstController]
            pageController.setViewControllers(startingViewControllers as [AnyObject], direction: UIPageViewControllerNavigationDirection.Forward, animated: false, completion: nil)
        }

        pageViewController = pageController
        addChildViewController(pageViewController!)
        self.view.addSubview(pageViewController!.view)
        pageViewController!.didMoveToParentViewController(self)

    }

    private func setupPageControl() {

        let appearance = UIPageControl.appearance()
        appearance.pageIndicatorTintColor = UIColor.grayColor()
        appearance.currentPageIndicatorTintColor = UIColor.whiteColor()
        appearance.backgroundColor = UIColor.darkGrayColor()

    }

    // MARK: - UIPageViewControllerDataSource

    func pageViewController(pageViewController: UIPageViewController, viewControllerBeforeViewController viewController: UIViewController) -> UIViewController? {

        let itemController = viewController as! CanPageItemController

        if itemController.itemIndex > 0 {
            return getItemController(itemController.itemIndex-1)
        }
        return nil
    }

    func pageViewController(pageViewController: UIPageViewController, viewControllerAfterViewController viewController: UIViewController) -> UIViewController? {

        let itemController = viewController as! CanPageItemController

        if itemController.itemIndex+1 < contentImages.count {
            return getItemController(itemController.itemIndex+1)
        }
        return nil
    }

    private func getItemController(itemIndex: Int) -> CanPageItemController? {

        if itemIndex < contentImages.count {
            let pageItemController = self.storyboard!.instantiateViewControllerWithIdentifier("CanItemController") as! CanPageItemController
            pageItemController.itemIndex = itemIndex
            pageItemController.imageName = contentImages[itemIndex]
            return pageItemController
        }
        return nil
    }

    // MARK: - Page Indicator

    func presentationCountForPageViewController(pageViewController: UIPageViewController) -> Int {
        return contentImages.count
    }

    func presentationIndexForPageViewController(pageViewController: UIPageViewController) -> Int {
        return 0
    }

}

我有2个问题:


  1. 我根本看不到任何页面指示符。
    这来自以下代码:

  1. I can't see any page indicators at all. This comes from the following code:

private func setupPageControl() {

let appearance = UIPageControl.appearance()
appearance.pageIndicatorTintColor = UIColor.grayColor()
appearance.currentPageIndicatorTintColor = UIColor.whiteColor()
appearance.backgroundColor = UIColor.darkGrayColor()

}

是否可以在情节提要中添加页面指示器并引用该指示器以编程方式这样,也许我可以添加约束并拥有更多控制权。我认为页面指示器可能隐藏在选项卡栏的后面。尽管约束也给我带来了问题,这使我遇到了问题2

Is there a way I can add a page indicator in the storyboard and reference that programatically. That way maybe I could add constraints and have more control. I think the page indicator might be hidden behind the Tab Bar. Though constraints are also giving me issues, which leads me to problem 2

正如您在项目控制器中看到的那样,我有一个UIImageView并且约束都是设置正确。但是,当我运行该应用程序时,图像会出现一秒钟(完全不成比例),然后消失。即-我的约束根本无法正常工作

As you can see in the Item Controller, I have a UIImageView and the constraints are all set right. But when I run the app the image appears for a second (completely out of proportion) and then disappears. i.e - my constraints simply don't work properly

问题

我的方法通常只是错误吗?还是可以做一些小改动来解决上述问题。我一直在关注一个教程(我认为是关于Ray Wenderlich的),并且在我尝试将其与Tab Bar集成之前,一切都很好。

Is my approach in general just wrong? Or is there a few little changes I can make to fix the above problems. I I've been following a tutorial (on Ray Wenderlich I think), and it all worked fine until I tried to integrate it with my Tab Bar.

推荐答案

保留上面所有内容,只需执行以下操作。

Leave all above thing, just do as following.

已编辑:按照Swift 5

class CanteenViewController: UIViewController, UIScrollViewDelegate {

@IBOutlet var scrHelp: UIScrollView!
@IBOutlet var pageControl: UIPageControl!

var page = 0

let arrContent: [[String: Any]] = [["name" : "Title1", "icon" : "Radar-512"],
                                   ["name" : "Title2", "icon" : "dartp"],
                                   ["name" : "Title3", "icon" : "roomp"],
                                   ["name" : "Title4", "icon" : "abnews"],
                                   ["name" : "Title5", "icon" : "canteenp"]]

override func viewDidLoad() {
    super.viewDidLoad()
    self.title = "Canteen"
    // Do any additional setup after loading the view, typically from a nib.

    self.createHelpView()

    self.pageControl.backgroundColor = UIColor.clear
    self.pageControl.pageIndicatorTintColor = UIColor.lightGray
    self.pageControl.currentPageIndicatorTintColor = UIColor(red: 251/255, green: 108/255, blue: 108/255, alpha: 1.0)
    self.pageControl.tintAdjustmentMode = UIView.TintAdjustmentMode.dimmed
    self.pageControl.numberOfPages = self.arrContent.count
    self.pageControl.currentPage = 0

}

func createHelpView() {

    var x = 50
    var i = 0
    
    for item in self.arrContent {
        let lblTitle = UILabel(frame: CGRect(origin: CGPoint(x: CGFloat(x), y: 10), size: CGSize(width: CGFloat(self.scrHelp.frame.width-100), height: 25)))
        lblTitle.autoresizingMask = UIView.AutoresizingMask.flexibleBottomMargin
        lblTitle.backgroundColor = UIColor.clear
        lblTitle.font = UIFont.systemFont(ofSize: 17)
        lblTitle.textAlignment = NSTextAlignment.center
        lblTitle.textColor = UIColor.black
        lblTitle.text = item["name"] as? String    //self.arrTitle[i]
        self.scrHelp.addSubview(lblTitle)

        let imgView = UIImageView(frame: CGRect(origin: CGPoint(x: CGFloat(x), y: 50), size: CGSize(width: CGFloat(self.scrHelp.frame.width-100), height: CGFloat(self.scrHelp.frame.height-150))))
        imgView.autoresizingMask = UIView.AutoresizingMask.flexibleBottomMargin
        imgView.backgroundColor = UIColor.clear
        imgView.image = UIImage(named: (item["icon"] as! String))
        imgView.contentMode = UIView.ContentMode.scaleAspectFit
        self.scrHelp.addSubview(imgView)

        x = x + Int(self.scrHelp.frame.width)
        i = i + 1
    }
    self.scrHelp.contentSize = CGSize(width: (CGFloat(self.arrContent.count) * self.view.frame.width), height: 0)
}

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    let pageWidth = CGFloat(self.scrHelp.frame.width)
    let fractionalPage = self.scrHelp.contentOffset.x / pageWidth
    self.page = lround(CDouble(fractionalPage))
    self.pageControl.currentPage = self.page
}
}

最后,添加 UIScrollView UIPageControl 给你故事板,并设置各自的出口和约束。

At last, add UIScrollView and UIPageControl to you storyboard and set respective outlet and constraint.

这篇关于在Tab Swift中使用页面视图控制器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆