时间戳

首页 > 解决方案 > 我想重现 Twitter 和 Instagram 的通知系统

swift - 我想重现 Twitter 和 Instagram 的通知系统

问题描述

我试图将我的视图控制器分成两个不同的部分，通过向右或向左滑动来访问，就像 Twitter 和 Instagram 的通知一样。

推特通知

我不知道这个设计的名字是什么，所以我对谷歌的研究没有成功。我试着自己做。我有一个视图控制器，其中有一个视图包含 2 个部分标签，光标在下方，还有一个视图容器包含一个页面视图控制器以启用滑动。我可以在 2 个部分之间滑动，但我不知道在 2 个部分之间滑动时如何移动光标并更改标签的颜色和重量。

我所做的模拟器

这是我画线和光标的视图代码：

class LineView: UIView {

    let cursor = CAShapeLayer()

    override func draw(_ rect: CGRect) {
        let line = UIBezierPath()
        line.lineWidth = 1
        line.move(to: CGPoint(x: 0, y: 0))
        line.addLine(to: CGPoint(x: self.frame.width,y: 0))
        UIColor.lightGray.setStroke()
        line.stroke()

        let path = UIBezierPath()
        path.move(to: CGPoint(x: 0, y: 0))
        path.addLine(to: CGPoint(x: self.frame.width / 2, y: 0))
        cursor.path = path.cgPath
        cursor.strokeColor = UIColor(red:1.00, green:0.09, blue:0.40, alpha:1.0).cgColor
        cursor.lineWidth = 2

        layer.addSublayer(cursor)
    }
}

和我的页面视图控制器的代码：

class HomePageViewController: UIPageViewController, UIPageViewControllerDataSource {

    lazy var viewControllerList : [UIViewController] = {
       let storyboard = UIStoryboard(name: "Main", bundle: nil)
        let viewController1 = storyboard.instantiateViewController(withIdentifier: "PublicViewController")
        let viewController2 = storyboard.instantiateViewController(withIdentifier: "PrivateViewController")

        return [viewController1, viewController2]
    }()

    override func viewDidLoad() {
        super.viewDidLoad()

        self.dataSource = self

        if let firstViewController = viewControllerList.first {
            self.setViewControllers([firstViewController], direction: .forward, animated: false, completion: nil)
        }
    }

    func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController: UIViewController) -> UIViewController? {
        guard let index = viewControllerList.firstIndex(of: viewController) else { return nil }
        let previousIndex = index - 1
        guard previousIndex >= 0 else { return nil }
        guard viewControllerList.count > previousIndex else { return nil }
        return viewControllerList[previousIndex]
    }

    func pageViewController(_ pageViewController: UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {
        guard let index = viewControllerList.firstIndex(of: viewController) else { return nil }
        let nextIndex = index + 1
        guard viewControllerList.count != nextIndex else { return nil }
        guard viewControllerList.count > nextIndex else { return nil }
        return viewControllerList[nextIndex]
    }

}

我不确定这是正确的方法！

标签： swift

解决方案

您可以将集合视图用于标题，即Public和Private。

对于控制器，我已将其放置UIScrollView在情节提要的视图控制器内。然后在滚动视图内添加两个容器视图后，与滚动视图相等且高度相同。关于代码，您可以在下面的项目中下载。

这是您想要的完整演示项目：CustomStepperController

推荐阅读