Quantcast
Channel: Xamarin.Forms — Xamarin Community Forums
Viewing all articles
Browse latest Browse all 77050

Xamarin.Forms: how to "center" vertically a label on itself for Android

$
0
0

I try to use a FontIcon to show an item through a customized Label.

As the icon is wider than it is tall, I would like to adjust the height and the vertical alignement.

However, I encounter a strange behavior on Android, whereas it works fine on iOS.

For example, with a default Label and a basic text the result is the same:

<Grid HeightRequest="80">
    <Label Text="A" TextColor="Black" 
           FontSize="150" 
           BackgroundColor="Yellow"
           VerticalOptions="Center" HorizontalOptions="Center" 
           VerticalTextAlignment="Center" />
    </Label>
</Grid>

As I explained, it works fine on iOS,

iOS

But not on Android:

Android

Would you have any explanation or any suggestion?

I've tested another approach by adding a negative margin on Android:

<Grid BackgroundColor="Olive"
      HeightRequest="120">
    <Label Text="A" TextColor="Black" 
           FontSize="180" 
           BackgroundColor="Yellow"
           VerticalOptions="FillAndExpand" HorizontalOptions="Center" 
           VerticalTextAlignment="Start">
        <Label.Margin>
            <OnPlatform x:TypeArguments="Thickness">
                <On Platform="Android" Value="0, -70, 0, 0" />
            </OnPlatform>
        </Label.Margin>
    </Label>
</Grid>

The results looks good, on iOS:

iOS2

And it seems to be good on Android too:

Android2

But this works only for some devices, the rendering is not always the same when I test this on real devices or different emulators...

I'm not that it's the better approach, but I'm not sure that I can achieve this.


Viewing all articles
Browse latest Browse all 77050

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>