破碎的UIearchBar动画嵌入在NavigationItem中

问题描述 投票:19回答:6

我遇到了将搜索栏添加到导航项的新方法的问题。

正如您在下图中看到的,一个接一个地有两个UIViewControllers,并且都有搜索栏。问题是动画,当搜索栏在第一个视图控制器上可见但在第二个视图控制器上不可见时,这很难看。搜索栏占用的区域停留在屏幕上并突然消失。

Demo

代码非常基本(项目中没有其他更改):

(我主要用C#编写,所以这段代码可能有错误。)

ViewController.swift:

import UIKit

class ViewController: UITableViewController, UISearchResultsUpdating {

override func loadView() {
    super.loadView()

    definesPresentationContext = true;

    navigationController?.navigationBar.prefersLargeTitles = true;
    navigationItem.largeTitleDisplayMode = .automatic;
    navigationItem.title = "VC"

    tableView.insetsContentViewsToSafeArea = true;
    tableView.dataSource = self;

    refreshControl = UIRefreshControl();
    refreshControl?.addTarget(self, action: #selector(ViewController.handleRefresh(_:)), for: UIControlEvents.valueChanged)
    tableView.refreshControl = refreshControl;

    let stvc = UITableViewController();
    stvc.tableView.dataSource = self;

    let sc = UISearchController(searchResultsController: stvc);
    sc.searchResultsUpdater = self;
    navigationItem.searchController = sc;
}

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    var cell = tableView.dequeueReusableCell(withIdentifier: "cell1");
    if (cell == nil) {
        cell = UITableViewCell(style: .default, reuseIdentifier: "cell1");
    }
    cell?.textLabel?.text = "cell " + String(indexPath.row);
    return cell!;
}

override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 20;
}

override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    let vc = ViewController();
    navigationController?.pushViewController(vc, animated: true);
}

@objc func handleRefresh(_ refreshControl: UIRefreshControl) {
    DispatchQueue.main.asyncAfter(deadline: .now() + .seconds(2), execute: {
        refreshControl.endRefreshing();
    })
}

func updateSearchResults(for searchController: UISearchController) {
}
}

AppDelegate.swift:

import UIKit

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {

var window: UIWindow?

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {

    window = UIWindow(frame: UIScreen.main.bounds);
    window?.rootViewController = UINavigationController(rootViewController: ViewController());
    window?.makeKeyAndVisible();

    UINavigationBar.appearance().barTintColor = UIColor.red;

    return true
}
}

想法?

ios animation uisearchbar ios11
6个回答
17
投票

看起来苹果仍然需要在新的大型标题风格中使用UISearchBar。如果你推到的UIViewController没有设置navigationItem.searchController,那么动画效果很好。在两个都有searchController集的UIViewController实例之间导航时,您会遇到导航栏高度跳跃的问题。

您可以通过每次调用UISearchController(而不是在viewDidAppear中创建它)并在loadView上将navigationItem.searchController设置为nil来创建viewDidDisappear来解决(解决)问题。

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)

    DispatchQueue.main.async {
        let stvc = UITableViewController()
        stvc.tableView.dataSource = self

        let sc = UISearchController(searchResultsController: stvc)
        sc.searchResultsUpdater = self
        self.navigationItem.searchController = sc
    }
}

override func viewDidDisappear(_ animated: Bool) {
    super.viewDidDisappear(animated)

    self.navigationItem.searchController = nil
}

异步调度的原因是在navigationItem.searchController方法中设置viewDidAppear内联时会引发异常:

Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: 'Only one palette with a top boundary edge can be active outside of a transition. Current active palette is <_UINavigationControllerManagedSearchPalette: 0x7fad67117e80; frame = (0 116; 414 0); layer = <CALayer: 0x60400002c8e0>>'

我知道这只是一个解决方法,但希望这对你现在有所帮助,直到Apple解决了两个视图控制器之间导航的问题,这两个视图控制器都在UISearchController上设置了navigationItem


1
投票

accepted answer确实解决了某些情况下的问题,但是我遇到了它,如果第一个搜索栏处于活动状态,则导致在推送的视图控制器中完全删除navigationItem

我提出了另一种解决方法,类似于answer by stu,但不需要干预约束。该方法是在segue点确定搜索栏是否可见。如果是,我们指示目标视图控制器使其搜索栏从加载中可见。这意味着导航项动画的行为正确:

Search bar correctly animating

假设两个视图控制器被称为UIViewController1UIViewController2,其中1推动2,代码如下:

class ViewController1: UITableViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let searchController = UISearchController(searchResultsController: nil)
        searchController.obscuresBackgroundDuringPresentation = false
        navigationItem.searchController = searchController

        definesPresentationContext = true
    }

    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if let viewController2 = segue.destination as? ViewController2, let searchController = navigationItem.searchController {

            // If the search bar is visible (but not active, which would make it visible but at the top of the view)
            // in this view controller as we are preparing to segue, instruct the destination view controller that its
            // search bar should be visible from load.
            viewController2.forceSearchBarVisibleOnLoad = !searchController.isActive && searchController.searchBar.frame.height > 0
        }
    }
}
class ViewController2: UITableViewController {

    var forceSearchBarVisibleOnLoad = false

    override func viewDidLoad() {
        super.viewDidLoad()

        let searchController = UISearchController(searchResultsController: nil)
        searchController.obscuresBackgroundDuringPresentation = false
        navigationItem.searchController = searchController

        // If on load we want to force the search bar to be visible, we make it so that it is always visible to start with
        if forceSearchBarVisibleOnLoad {
            navigationItem.hidesSearchBarWhenScrolling = false
        }
    }

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        // When the view has appeared, we switch back the default behaviour of the search bar being hideable.
        // The search bar will already be visible at this point, thus achieving what we aimed to do (have it
        // visible during the animation).
        navigationItem.hidesSearchBarWhenScrolling = true
    }
}


0
投票

我解决这个问题的方法是在UISearchBar被解雇时更新保持UIViewController可见的约束。我无法使用silicon_valley的解决方案,因为即使使用异步调度,我也得到了他提到的崩溃。这无疑是一个非常混乱的解决方案,但Apple并没有让这一切变得简单。

下面的代码假设您在UISearchController子类中包含一个名为UIViewControllersearchController实例的属性

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)

    if
        animated
            && !searchController.isActive
            && !searchController.isEditing
            && navigationController.map({$0.viewControllers.last != self}) ?? false,
        let searchBarSuperview = searchController.searchBar.superview,
        let searchBarHeightConstraint = searchBarSuperview.constraints.first(where: {
            $0.firstAttribute == .height
                && $0.secondItem == nil
                && $0.secondAttribute == .notAnAttribute
                && $0.constant > 0
        }) {

        UIView.performWithoutAnimation {
            searchBarHeightConstraint.constant = 0
            searchBarSuperview.superview?.layoutIfNeeded()
        }
    }
}

你可以删除performWithoutAnimationlayoutIfNeeded,它仍然会动画;但是我发现这个动画从未第一次被触发,而且它看起来并不那么棒。

我希望Apple在以后的iOS版本中修复此问题,在撰写本文时,当前版本为12.1.4。


0
投票

VC1

override func viewDidLoad() {
   if #available(iOS 11.0, *) {
        navigationItem.hidesSearchBarWhenScrolling = false
        navigationItem.searchController = searchController
    }
}
override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)
    if #available(iOS 11.0, *) {
        navigationItem.hidesSearchBarWhenScrolling = true
    }
}

VC2中,使用相同的代码。

这将比将serchController设置为nil更清楚地解决您的问题


0
投票

此问题已在iOS 13 beta 1中修复。在更新应用程序之前检查您的解决方法以获取新版本。


-3
投票

我在viewDidLoad()中添加了这段代码,当我移入标签的b / w时,它正在工作

searchController.dimsBackgroundDuringPresentation
© www.soinside.com 2019 - 2024. All rights reserved.