Centre title in android

[Roozbeh Farhadi]

Hi,

I’m trying to centre the title in android but I can’t do that for some reason!

I tried

<ons-toolbar fixed-style>

But this doesn’t centre the title at all…

I tried to use this example here:

https://tutorial.onsen.io/?framework=vanilla&category=Reference&module=navigator

Is there something I’m missing?

Thanks in advance.

[Fran Diox]

@Roozbeh-Farhadi Looks like fixed-style was removed after we supported official Material Design styles with autostyling feature. If you want your title to be centered you can overwrite text-align property: <div class="center" style="text-align: center">Title</div>.

[munsterlander]

@Roozbeh-Farhadi

https://onsen.io/v2/docs/js/ons-toolbar.html

<ons-toolbar>
<div class="center">Content</div>
</ons-toolbar>

[Roozbeh Farhadi]

@munsterlander said:

@Roozbeh-Farhadi

https://onsen.io/v2/docs/js/ons-toolbar.html

<ons-toolbar>
<div class="center">Content</div>
</ons-toolbar>

that only works on iOS. But the solution that Fran Diox posted works fine in Android.

[munsterlander]

@Roozbeh-Farhadi Very interesting as my Android Apps use this and the title is centered. Hopefully, nothing has been updated to prevent this behavior. Here is an example of one of my published apps that uses that exact code I posted:

https://play.google.com/store/apps/details?id=com.cfuze.perfectroundtimer2

[Roozbeh Farhadi]

@munsterlander what’s the onsen ui verion that you are using? could it be because you are using an older version?

[munsterlander]

@Roozbeh-Farhadi Perfect Round Timer 2 uses 2.0.0-rc.16. I ran an example app with the code and sure enough, using 2.0.4 Material disregards the classes text alignment. So something changed somewhere, but meh, just a bit more CSS and you get center so no biggie. When I responded initially, the mobile web site didn’t show that @Fran-Diox had responded, so I was trying to get a timely response in there. After posting, I saw he had already responded and his answers are 100% correct vs mine! :bowtie:

[Fran Diox]

@munsterlander Isn’t that iOS style in the app you posted? Or just a white Android toolbar with the text centered? I think titles in MD style have always been left aligned, but maybe I don’t remember correctly…

[munsterlander]

@Fran-Diox You know what, I do think that is the flat style. I know it does Material as well because it autostyles, but I may have done something else in there. I just don’t remember doing anything extra to center but obviously my memory is failing. Please disregard me ramblings.