What should you know about a navigation history stack in iOS 14

栏目: IT技术 · 发布时间: 4年前

内容简介:Prior to iOS 14, If you are deep down in a navigation stack, the only way to go back is to smash your back button until you reach the root level. This is no longer a case in iOS 14.With iOS 14, if you're deep down in a navigation stack and want to head bac

Prior to iOS 14, If you are deep down in a navigation stack, the only way to go back is to smash your back button until you reach the root level. This is no longer a case in iOS 14.

With iOS 14, if you're deep down in a navigation stack and want to head back to any level quickly, you can long-press the back button to bring up the history stack.

What should you know about a navigation history stack in iOS 14
Example of a history stack of Settings

Why should we care about this?

At first glance, this looks like a nice feature and nothing we need to do to adopt this. We get this behavior automatically when building our app against iOS 14 SDK.

The problem is, it is quite a trend nowadays that designers would design an app without a back button title. The following are some example apps without a back button title.

What should you know about a navigation history stack in iOS 14
Apps that have no back button title. Pinterest (left), Tasty (Middle), and Google news (Right)

Without a back button title, history stack will look like this (I assume you hide back button title withthis method).

What should you know about a navigation history stack in iOS 14
History stack without back button title

Where does history stack pick up the title?

To solve this problem, we need to know which string is used as titles in a history stack. From my testing, a history stack getting the title from a navigation back button title, not the navigation title.

Let's test this out in different scenarios. In the following examples, I set up an AViewController where the right navigation item is pushing another AViewController to itself.

If we set only title , this title will also use as a back button title and also use in a history stack.

class AViewController: UIViewController {
    override func viewDidLoad() {
        title = "Title A"
    }
}
What should you know about a navigation history stack in iOS 14
Back button title is getting from the title

If your title is long enough, the back button title will be shortened to just "Back" for saving space, but this won't affect a title in a history stack.

What should you know about a navigation history stack in iOS 14
Back button title show as "Back" for a long title
What should you know about a navigation history stack in iOS 14
Title show in history stack still use the full title

Customize back button title

As mentioned before, a back button title string will be used in a history stack. So, the text in backButtonTitle will be used as a title in a history stack if set.

class AViewController: UIViewController {
    override func viewDidLoad() {
        title = "Title A"
        navigationItem.backButtonTitle = "Custom back title A"
    }
}
What should you know about a navigation history stack in iOS 14
Custom back button title
What should you know about a navigation history stack in iOS 14
Value in backButtonTitle will be used as history title

Since history stack depends on the back button title, set empty title won't affect a history stack. You can design an app with or without a title since this won't affect a history stack.

class AViewController: UIViewController {
    override func viewDidLoad() {
        title = ""
        navigationItem.backButtonTitle = "Custom back title A"
    }
}
What should you know about a navigation history stack in iOS 14
Empty title

No back button title

This is the most interesting scenario of all since an empty back button title is quite popular among designers.

class AViewController: UIViewController {
    override func viewDidLoad() {
        title = "Title A"
        navigationItem.backButtonTitle = ""
    }
}
What should you know about a navigation history stack in iOS 14
Empty back title
What should you know about a navigation history stack in iOS 14
Empty back title will result in empty history title

As you can see, this is the most harmful design for iOS 14. Does this mean we have to tell our designers to put back a button title from now on? Luckily, the answer is no. We can work around this problem.

We know that a back button title must be there for history stack to pick up a title. So, we have to set backButtonTitle a value you want to show in history and then try to hide it in UI.

Change offset (not work)

The first idea that comes up is setting negative x offset like what we sometimes do with a CSS styling. You can hide a back button title with this method, but you will suffer from transition animation. You will see a title slide beyond the back button indicator.

UIBarButtonItem.appearance().setBackButtonTitlePositionAdjustment(UIOffset(horizontal:-500, vertical: 0), for: .compact)
UIBarButtonItem.appearance().setBackButtonTitlePositionAdjustment(UIOffset(horizontal:-500, vertical: 0), for: .default)
What should you know about a navigation history stack in iOS 14
Try to hide back button title by set negative offset

Transparent color

This solution is quite straight forward. We set a back button title color to transparent. This method uses some knowledge from UINavigationBar changes in iOS13 , you might want to check it out.

let appearance = UINavigationBarAppearance()
appearance.configureWithDefaultBackground()

appearance.backButtonAppearance.normal.titleTextAttributes = [.foregroundColor: UIColor.clear]

UINavigationBar.appearance().standardAppearance = appearance
UINavigationBar.appearance().compactAppearance = appearance
What should you know about a navigation history stack in iOS 14
Transition animation look perfect with clear color
What should you know about a navigation history stack in iOS 14
History stack show as normal

This looks like a subtle change, but it requires some extra work on both the design and implementation phases. You can continue to design an app without a back button title, but make sure you provide a name for each view for a history stack.


以上所述就是小编给大家介绍的《What should you know about a navigation history stack in iOS 14》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

PHP项目开发全程实录

PHP项目开发全程实录

清华大学出版社 / 2008 / 56.00元

《软件项目开发全程实录丛书•PHP项目开发全程实录:DVD17小时语音视频讲解(附光盘1张)》主要特色: (1)12-32小时全程语音同步视频讲解,目前市场上唯一的“全程语音视频教学”的案例类 图书,培训数千元容,尽在一盘中! (2)10套“应用系统”并公开全部“源代码”,誓将案例学习进行到底! (3)丛书总计80个应用系统300个应用模块。 (4)含5000页SQL se......一起来看看 《PHP项目开发全程实录》 这本书的介绍吧!

随机密码生成器
随机密码生成器

多种字符组合密码

MD5 加密
MD5 加密

MD5 加密工具

XML、JSON 在线转换
XML、JSON 在线转换

在线XML、JSON转换工具