Trying to get UIBarButtonItem custom view to change color within iOS 26 Liquid Glass like native UIBarButtonItem

Question

Created 4w

Replies 4

Boosts 0

Participants 3

One of the bar button items of my bottom toolbar needs to be a custom view., and I’m trying hard to get it to behave like the proper bar button items when it comes to Liquid Glass and matching the appearance of all the other bar button items on my toolbar. I’ve tried many variations of embedding custom views within visual effect views, and this comes closest.

I inited a UIBarButtonItem with a custom UIView like you’re supposed to, and then I placed a UIVisualEffectView with Vibrancy within that, so that I could place a UIImageView inside it and the UIImageView would respect the adaptive color changing that comes with being within a Liquid Glass bar button item. I’ve made sure that the UIImageView is using an SF Symbol and a rendering mode of .alwaysTemplate, and that the .tintColor is set to .label, to ensure that I’m not overriding any Liquid Glass rendering.

Screenshot 2025-08-06 at 7.00.21 AM.png

Below, you can see the bar button item with my custom view on the left, and a native Bar Button Item with the same SF symbol on the right, in several scenarios. It gets part of the way there there: against light backgrounds the image view turns black like it should. But against darker backgrounds, instead of turning white, the symbol has an additional vibrancy that comes close to the right white look against certain grays, but then is obviously too translucent against black.

The symbol is still visible/experiencing some vibrancy, so I assume it might be some configuration of the UIImageView within the Vibrancy that can correct the behavior to match the images in the native bar button items in all conditions. Anyone got thoughts on what the missing piece might be?

Answered by DTS Engineer in 852403022

Did you try to add your custom view directly (UIBarButtonItem(customView: yourCustomView)) without embedding it to the UIVisualEffectView with vibrancy? You should get the default toolbar item effect by doing that.

If you don't mind to share the code snippet that reproduces the issue, I may take a closer look as well.

Best,
——
Ziqiao Chen
 Worldwide Developer Relations.

Boost

Answer 1

DTS Engineer OP

Apple

4w

Recommended

Did you try to add your custom view directly (UIBarButtonItem(customView: yourCustomView)) without embedding it to the UIVisualEffectView with vibrancy? You should get the default toolbar item effect by doing that.

If you don't mind to share the code snippet that reproduces the issue, I may take a closer look as well.

Best,
——
Ziqiao Chen
 Worldwide Developer Relations.

0

Answer 2

KeithB OP

4w

This may well be related to a bug I'm also seeing in iOS 26. In beta 4, many controls were messed up in dark mode, so that they didn't adapt to a dark appearance at all, including UIBarButtonItems with a customView. There have been some improvements in beta 5, but some controls now have a disabled appearance in dark mode when they are in fact enabled.

UIBarButtonItems with a customView are one of the controls affected. I'm seeing this in my own app, and I can easily reproduce this with a UIBarButtonItem that uses a UISegmentedControl as its customView. Here it is in light mode:

(Only the link button should be disabled, so all is as expected in light mode.)

And in dark mode (or in light mode but against a dark background):

As you can see, the segmented control now looks disabled when it isn't. And this is set up using the segmented control directly as the custom view (i.e. UIBarButtonItem(customView: segmentedControl)).

I've reported this as FB19431646.

The issue may be more general, as nav bar titles in sidebars and inspectors also appear pale grey and disabled (FB19431807).

Original report for dark mode issues in beta 4: FB19023069.

0

Answer 3

skeeJay OP

4w

Ziqiao, I was placing it in a UIVisualEffectView with vibrancy because in beta 4, if my symbol was a standalone UIImageView in the custom view, it didn’t get the default effect. I think this was one of the same beta 4 bugs that @KeithB was seeing.

But now   I can tell you that in beta 5, a UIImageView alone in the custom view finally behaves appropriately. It because unnecessary to embed it in the additional UIVisualEffectView with vibrancy and just put it in the custom view alone as you suggested, @DTS Engineer. Thanks.

0

Answer 4

KeithB OP

4w

[Deleted - sorry, I missed the comment from the DTS engineer on my earlier post, so what I posted here was irrelevant, but there doesn't seem to be a way to delete the post. Glad the op got their issue sorted.]

0