Material-components-ios: [MDCAppBar] Custom titleView no longer visible on iOS 11

Created on 2 Oct 2017  Â·  11Comments  Â·  Source: material-components/material-components-ios

Overview

The custom titleView doesn't appear anymore in the center of the MDCNavigationBar.
This issue happens only on iOS 11, it works fine on iOS 9 and 10.

Reproduction steps

  • Setup AppBar as per documentation (with the controller embedded in a navigationController)
  • Use this code to add a titleView to the current navigationItem inside viewDidLoad:
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 132, height: 26))
imageView.contentMode = .scaleAspectFit
imageView.image = #imageLiteral(resourceName: "logo")
navigationItem.titleView = imageView

Version number

  • 35.2.0

Operating system and device

  • iOS 11.0, iPhone 7 simulator
[AppBar] iPhone X 11 Bug

Most helpful comment

@artemisia-absynthium This is your code

let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 132, height: 26))
imageView.contentMode = .scaleAspectFit
imageView.image = #imageLiteral(resourceName: "logo")
navigationItem.titleView = imageView

Step 1
Simply create a new file under the class UIView.

Step 2
Add "intrinsicContentSize" method in your custom class. Ref screen shot.

Step 3
Update your code as below

let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 132, height:
26))

imageView.contentMode = .scaleAspectFit

imageView.image = #imageLiteral(resourceName: "logo")

UIView *customView = [[CustomSearchBarTitleView
alloc]initWithFrame:self.navigationController.navigationBar.bounds];

                                    or

UIView customView = [[CustomSearchBarTitleView alloc]initWithFrame:
your Image view frame size*];

[customView addSubview:imageView];

navigationItem.titleView = customView

On Wed, Nov 8, 2017 at 2:53 PM, Cristina De Rito notifications@github.com
wrote:

@ChandrapandianJ https://github.com/chandrapandianj I've implemented
your workaround but it didn't solve the issue in my case... could you
provide the entire code snippet so that I can check that we've actually
done the same thing?

May I ask the collaborators some news, too? This issue has become kinda
critical to my enterprise project now.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/material-components/material-components-ios/issues/2074#issuecomment-342758644,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AZHwvW3JFbyasgldKQHmPlog1HF7GBkSks5s0XL1gaJpZM4PqfFb
.

--

Regards,

Chandrapandian* J* |* Senior Software Engineer*

Chennai | Cell *+91-8015447767*

All 11 comments

Me too facing the same issue. I debugged through Hierarchy View and found that custom titleView frame size is (0,0) even we set proper FrameSize/Auto-layout. Do you have any update on this.. ??

Override below method in the custom title view class -

Swift
override var intrinsicContentSize: CGSize {
return UILayoutFittingExpandedSize
}

Obj-C
-(CGSize)intrinsicContentSize {
[super intrinsicContentSize];
return UILayoutFittingExpandedSize;
}

Issue solved to me!

@ChandrapandianJ I've implemented your workaround but it didn't solve the issue in my case... could you provide the entire code snippet so that I can check that we've actually done the same thing?

May I ask the collaborators some news, too? This issue has become kinda critical to my enterprise project now.

Looks like this has been fixed. Can you confirm that this is now working as expected when you update the pod to latest? Thanks

@artemisia-absynthium This is your code

let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 132, height: 26))
imageView.contentMode = .scaleAspectFit
imageView.image = #imageLiteral(resourceName: "logo")
navigationItem.titleView = imageView

Step 1
Simply create a new file under the class UIView.

Step 2
Add "intrinsicContentSize" method in your custom class. Ref screen shot.

Step 3
Update your code as below

let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 132, height:
26))

imageView.contentMode = .scaleAspectFit

imageView.image = #imageLiteral(resourceName: "logo")

UIView *customView = [[CustomSearchBarTitleView
alloc]initWithFrame:self.navigationController.navigationBar.bounds];

                                    or

UIView customView = [[CustomSearchBarTitleView alloc]initWithFrame:
your Image view frame size*];

[customView addSubview:imageView];

navigationItem.titleView = customView

On Wed, Nov 8, 2017 at 2:53 PM, Cristina De Rito notifications@github.com
wrote:

@ChandrapandianJ https://github.com/chandrapandianj I've implemented
your workaround but it didn't solve the issue in my case... could you
provide the entire code snippet so that I can check that we've actually
done the same thing?

May I ask the collaborators some news, too? This issue has become kinda
critical to my enterprise project now.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/material-components/material-components-ios/issues/2074#issuecomment-342758644,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AZHwvW3JFbyasgldKQHmPlog1HF7GBkSks5s0XL1gaJpZM4PqfFb
.

--

Regards,

Chandrapandian* J* |* Senior Software Engineer*

Chennai | Cell *+91-8015447767*

@chuga I had experimented with the one that was the latest version a week ago and I found that it didn't work when the UINavigationController containing the UIViewController that had the MDCAppBar was the initial view controller of the app, but then it started working when returning to the same UINavigationController after some navigation (same with @ChandrapandianJ 's workaround). I had prepared a project to show you the issue but then I started investigating your source code trying to find the bug myself and lost some time in reporting to you (unfortunately I couldn't do it fulltime)! I'm sorry!

I've just checked again by applying the fix you made in #2437 and it works, indeed. Thank you very much!

PS: It was not all wasted time after all, I've appreciated a lot the "Indiana Jones placeholder" thing! 😄

No worries! I'm glad this is finally fixed, sorry that it took so long.

Put ur size here:

override var intrinsicContentSize: CGSize {
return CGSize(width: xxx, height: yyy)
}

For anybody checking from the future. iOS 11 automatically sets the label's intrinsic size, but iOS 10 does not. So meanwhile the titleView seems fine in iOS 11, and not in iOS 10, it's because the size has not been specified.

if #available(iOS 11.0, *) {
frame = CGRect(x: -15.0, y: 0, width:sizewith, height: sizeheigth)
}else{
frame = CGRect(x: -15.0, y: 20, width:sizewith , height: sizeheigth)
}

I have this solution.

I am coming from a typical UINavigationBar and UINavigationItem standpoint in iOS 13. I am experiencing exactly the same behaviour as @artemisia-absynthium has described - the titleView is not shown until after coming back to the relevant UIViewController. I am wondering if anyone has found a reason and a real solution for this problem ?

Was this page helpful?
0 / 5 - 0 ratings