ActionBar titleView issues with SearchBar on different ios versions

Did you verify this is a real problem by searching the [NativeScript Forum]

Yes

Tell us about the problem

In some of our pages we use a custom titleView in the ActionBar. It is a GridLayout with a Label and SearchBar. When tapping on the search ActionItem, the default title Label should be hidden and instead the SearchBar is supposed to be shown. The GridLayout is used to stretch the SearchBar to the remaining available space in the ActionBar between the Back-Button on the left and the other ActionItems on the right. Everything works as expected on Android.

On iOS 9 & 10, the Label-title is aligned to the left instead of the middle of the ActionBar. On iOS 11, this problem does not occur.

On iOS 9 and 10, the SearchBar is shown correctly, as it fills the available space of the ActionBar. But on iOS 11, there is an issue on positioning the SearchBar within the ActionBar as it does not fill the available space and it is fixed at the bottom of the ActionBar. I tried to add a margin-bottom value, but this does not help (in addition, it would also affect the iOS 9 and 10 behaviour where the margin would not be necessary)

Which platform(s) does your issue occur on?

iOS

Please provide the following version numbers that your issue occurs with:

• CLI: 4.0.0
• Cross-platform modules: 4.0.0-2018-04-12-03
• Runtime(s): tns-ios 4.0.1

Please tell us how to recreate the issue in as much detail as possible.

Start the sample App. You will see the title of the ActionBar in the correct way on iOS 11 (centered), but aligned left on iOS 10.

Is there code involved? If so, please share the minimal amount of code needed to recreate the problem.

Sample app can be found here:
NativeScript4.zip

Thank you in advance

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

Start with the attached NativeScript4.zip sample app and reproduce the ActionBar titleView and SearchBar behavior on iOS 9, 10, and 11. Compare the title alignment and SearchBar placement across those versions; done means both views are positioned consistently while preserving the reported Android behavior.