2016-10-19 3 views
-1

Как создать панель навигации, которая будет циклически переключаться между 3 видами и будет масштабировать значок вида так же, как Tinder's? http://i3.mirror.co.uk/news/technology-science/technology/article6812543.ece/ALTERNATES/s615b/Tinder-update.jpgКак создать навигационную панель, такую ​​как tinder's in swift 2

+0

Вы должны наследоваться 'UINavigationBar'. Для этого потребуется много кода. –

+0

В навигационной панели нет ничего особенного. Просто выполняйте то, что вы обычно делаете: используйте контроллер навигации, и каждый контроллер дочернего представления устанавливает свои собственные свойства navigationItem. – matt

ответ

2

This Framework обеспечивает точное Navbar как трут и для Swift 2.

pod 'SLPagingViewSwift' 

Простота внедрения:

// Make views for the navigation bar 
var img1 = UIImage(named: "gear") 
img1 = img1?.imageWithRenderingMode(.AlwaysTemplate) 
var img2 = UIImage(named: "profile") 
img2 = img2?.imageWithRenderingMode(.AlwaysTemplate) 
var img3 = UIImage(named: "chat") 
img3 = img3?.imageWithRenderingMode(.AlwaysTemplate) 

var items = [UIImageView(image: img1), UIImageView(image: img2), UIImageView(image: img3)] 
var controllers = [ctr1, ctr2, ctr3] 
controller = SLPagingViewSwift(items: items, controllers: controllers, showPageControl: false) 

Тогда вы можете сделать свой собственный Поведение:

// Tinder Like 
controller?.pagingViewMoving = ({ subviews in 
    for v in subviews { 
     var lbl = v as UIImageView 
     var c = gray 

     if(lbl.frame.origin.x > 45 && lbl.frame.origin.x < 145) { 
      c = self.gradient(Double(lbl.frame.origin.x), topX: Double(46), bottomX: Double(144), initC: orange, goal: gray) 
     } 
     else if (lbl.frame.origin.x > 145 && lbl.frame.origin.x < 245) { 
      c = self.gradient(Double(lbl.frame.origin.x), topX: Double(146), bottomX: Double(244), initC: gray, goal: orange) 
     } 
     else if(lbl.frame.origin.x == 145){ 
      c = orange 
     } 
     lbl.tintColor = c 
    } 
}) 

Для дальнейших зрителей: я раздвоенный Структуру и обновил его Swift 3.

SLPagingViewSwift Swift 3

Чтобы установить вилку:

pod 'SLPagingViewSwift-Swift3', :git => 'https://github.com/davidseek/SLPagingViewSwift-Swift-3-Tinder-Twitter.git' 

enter image description here

Редактировать

Чтобы построить пользовательский интерфейс с Interface Builder, вы должны установить свои UIViewController ALS глобальных объектов, в противном случае TableViews будет использовать делегат из-за слабую собственность. Создать Swift файл и ввести имена контроллеров:

var one: ViewControllerOne? 
var two: ViewControllerTwo? 
var three: ViewControllerThree? 

Затем инстанцировании контроллеры в своем классе контроллера или AppDelegate и назвать все:

func load() { 
    appDelegate.window = UIWindow(frame: UIScreen.main.bounds) 

    self.setupViews() 
    self.setItems() 

    let items = [UIImageView(image: bla), 
       UIImageView(image: bli), 
       UIImageView(image: blubb)] 

    let controllers = [one!, 
         two!, 
         three!] 

    controller = SLPagingViewSwift(items: items, controllers: controllers, showPageControl: false) 

    self.setupController() 
    self.setRoot() 
} 

func setupViews() { 
    one = main.instantiateViewController(withIdentifier: "ViewControllerOne") as? ViewControllerOne 
    two = main.instantiateViewController(withIdentifier: "ViewControllerTwo") as? ViewControllerTwo 
    three = main.instantiateViewController(withIdentifier: "ViewControllerThree") as? ViewControllerThree 
} 

func setRoot() { 
    nav = UINavigationController(rootViewController: controller) 
    appDelegate.window?.rootViewController = nav 
    appDelegate.window?.backgroundColor = UIColor.black 
    appDelegate.window?.makeKeyAndVisible() 
} 

func setupController() { 
    controller.pagingViewMoving = ({ subviews in 
     if let imageViews = subviews as? [UIImageView] { 
      for imgView in imageViews { 
       var c = cachedGray 
       let originX = Double(imgView.frame.origin.x) 

       if (originX > 95 && originX < 195) { 
        c = gradient(originX, topX: 96, bottomX: 194, initC: cachedOrange, goal: cachedGray) 
       } 
       else if (originX > 195 && originX < 245) { 
        c = gradient(originX, topX: 196, bottomX: 294, initC: cachedGray, goal: cachedOrange) 
       } 
       else if(originX == 195){ 
        c = cachedOrange 
       } 
       imgView.tintColor = c 
      } 
     } 
    }) 
} 

В моем примере вы можете использовать пустой вид как начальный контроллер представления на раскадровке и позвонить load() в viewDidLoad(). Тогда ваш контроллер будет загружен.

Here is a working test project with Tinder style and 3 ViewControllers from Storyboard

+0

Спасибо за работу @DavidSeek Выглядит потрясающе. но означает ли это, что вы не можете использовать контроллеры представления main.storyboard для проектирования остальных элементов пользовательского интерфейса? я буду делать все это программно? –

+0

вы можете. Я сейчас использую его в проекте. я добавлю комментарий к своему ответу, чтобы показать вам, как –

+0

Спасибо, очень ценю! –

Смежные вопросы