UITabBar Large Content Size Image (HUD) doesn't display in Large Text mode

Question

iOS 11 has an accessibility feature that shows a large version of a tabbar icon in a pop-up HUD when long pressed. In a WWDC presentation, it was mentioned this just involves turning on: Settings -> General -> Accessibility -> Larger Text

..and adding:

tabBarItem.largeContentSizeImage = UIImage(named: "myHud")

Alternatively, you can add a vector image as the main tool-bar image, with 'Preserve Vector Data' checked in the asset catalog.

I've tried all combinations of this, and a long press does not show the HUD. I also tested with the Files app on my iPad running iOS 11b4 with no luck. This is the app that was demoed at WWDC.

Is there some other accessibility setting I'm missing to enable this feature? Or is it not available in beta 4?

Answer 1

This feature implementation and an example with tab bar are perfectly explained with illustrations on this accessibility site but here are the outlines :

1. Under Xcode, import the image to be enlarged with a pdf extension and a x1 resolution in the xcassets catalog.

2. In the new Image Set, tick Preserve Vector Data and specify Single Scale as Scales attribute.

3. If a storyboard is used for this image, tick Adjusts Image Size in the Image View section, otherwise put the adjustsImageSizeForAccessibilityContentSizeCategory image property to true in code.

4. For your tab bar or tool bar used in the application, first repeat the previous 3 steps for each image included in the items to be enlarged in the middle of the screen and then link the accessibility image to its appropriate item.

5. This feature is available only for the accessibility text sizes.

WARNING : don't forget to check your layout with these new images larger sizes.

For your record, an explanation of the Large Content Viewer is provided in this detailed WWDC video summary if need be ⟹ the UILargeContentViewerItem protocol is an iOS 13 new feature that shows the same HUD that's shown for standard bar items.

Answer 2

You need to go :

Settings > General > Accessibility > Larger Text(set on) > Move slider more then half to the right

Don't forget to set

tabBarItem.largeContentSizeImage = someKindOfImage

And Long press will does the trick.

Answer 3

It isn't enough to turn on Larger Text. You also have to use Larger Text — i.e. slide the slider way to right.

Then it works — well, the HUD appears. But the icon is not being enlarged within the HUD, so I don't quite see the point:

(As you can see, I'm doing this in a test project where I'm experimenting with the vector PDF image feature.)