我如何制作像Spotify这样的菜单

时间:2015-11-18 10:00:21

标签: ios

好的问题表明,我想制作一个像spotify app当前的菜单。 我在github中遇到了类似于此的代码,但我想知道如何在DIY(自己动手)级别实现此目的。

我可以理解需要一个浏览器控制器但是丢失了。请指出正确的方向。

修改

这样人们就可以正确理解我所说的要求,这是一个png enter image description here

注意顶部菜单以下划线作为选定菜单滑动。

我发布的github链接是一个可以做到这一点的库,但它很快,所以任何人都可以告诉我如何在目标c中实现这一点

此致

1 个答案:

答案 0 :(得分:3)

我已经制作了类似的样本,但是在Swift 2.0中。看一看。可能会有所帮助。

在下面发布的示例链接中,您要求的查询可以通过以下方式完成。
我们可以使用此方法首先在页面视图的顶部设置按钮

在您的条款中,这是热门菜单

func setupSegmentButtons(){
    navigationView = UIView(frame: CGRectMake(0, 0, self.view.frame.size.width, (self.navigationController?.navigationBar.frame.size.height)! - 4))
    //navigationView.backgroundColor = UIColor.redColor()
    navigationView.layoutIfNeeded()
    let numControllers:NSInteger = viewControllerArray.count
    if(buttonText == nil)
    {
        buttonText = NSArray(objects: "First","Second","Third")
    }

    let buttonWidth:CGFloat = self.view.frame.size.width/CGFloat(numControllers)
    for (var i = 0; i < numControllers; i++) {


        let button:UIButton = UIButton(frame: CGRectMake( CGFloat(i) * buttonWidth, 0, buttonWidth, 40))
        button.addTarget(self, action: "tapSegmentButtonAction:", forControlEvents: .TouchUpInside)
        navigationView.addSubview(button)
        button.tag = i
        button.titleLabel?.font = UIFont(name: "Helvetica", size: 14)
        button.setTitleColor(UIColor.blackColor(), forState: .Normal)
        button.setTitle(buttonText.objectAtIndex(i) as? String, forState: .Normal)

    }

    self.view.addSubview(navigationView)
    self.setupSelector()
}


现在我们必须添加选择栏,它将相应地滑动并选择菜单。

设置选择栏视图

func setupSelector(){

//selection bar view
    selectionBar = UIView(frame: CGRectMake(X_BUFFER - X_OFFSET + SELECTED_POSITION , SELECTOR_Y_BUFFER, (self.view.frame.size.width - 2 * X_BUFFER)/CGFloat(viewControllerArray.count), SELECTOR_HEIGHT))

    selectionBar.backgroundColor = UIColor.brownColor()
    selectionBar.alpha = 0.8
    navigationView.addSubview(selectionBar)
    }


现在我们可以使用滚动视图的 scrollViewDidScroll 委托,以使选择栏视图滑向所选菜单。每次滚动页面视图控制器时都会调用此委托,我们每时每刻都会更改所选条形图的框架。

func scrollViewDidScroll(scrollView: UIScrollView) {

    let xFromCenter : CGFloat = self.view.frame.size.width-scrollView.contentOffset.x;

    let xCoors : CGFloat = X_BUFFER + selectionBar.frame.size.width * CGFloat(currentPageIndex) - X_OFFSET
    _ = selectionBar.frame

    if(CGFloat(xCoors)-xFromCenter / CGFloat(viewControllerArray.count) > self.view.frame.size.width - selectionBar.frame.width)
    {
        selectionBar.frame = CGRectMake(self.view.frame.size.width - selectionBar.frame.width, selectionBar.frame.origin.y, selectionBar.frame.size.width, selectionBar.frame.size.height);
    }
    else if(CGFloat(xCoors)-xFromCenter / CGFloat(viewControllerArray.count) < 0)
    {
        selectionBar.frame = CGRectMake(0, selectionBar.frame.origin.y, selectionBar.frame.size.width, selectionBar.frame.size.height);
    }
    else
    {
       selectionBar.frame = CGRectMake(CGFloat(xCoors)-xFromCenter/CGFloat(viewControllerArray.count), selectionBar.frame.origin.y, selectionBar.frame.size.width, selectionBar.frame.size.height);
    }
}


有关详细信息,请参阅下面的示例链接。

https://github.com/RajanMaheshwari/PageViewController