A large FontSize alters the text alignment - Android

[FANMixco]

Description

Steps to Reproduce

1. Add a Label
2. Type a long text
3. Center the text
4. Change its font-size forcing word wrapping for example: "Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries"

Expected Behavior

Keep the text centered.

Actual Behavior

Changes the format to left.

Working:

<StackLayout
                Grid.Row="2"
                VerticalOptions="CenterAndExpand">
                <Label
                    x:Name="lblSubtitle"
                    Text="For everyone who saves at least 15%!"
                    HorizontalOptions="CenterAndExpand"
                    FontSize="15" />
</StackLayout>

Not working:

<StackLayout
                Grid.Row="2"
                VerticalOptions="CenterAndExpand">
                <Label
                    x:Name="lblSubtitle"
                    Text="For everyone who saves at least 15%!"
                    HorizontalOptions="CenterAndExpand"
                    FontSize="30" />
</StackLayout>

Basic Information

• Version with issue: 5.0.0.2012
• Last known good version: Not sure, it's my first app with Forms.
• Platform Target Frameworks:
  • iOS: Never tried.
  • Android: 31.0.2
  • UWP: N/A
• Android Support Library / AndroidX Version:
• NuGet Packages:
• Affected Devices:

Environment

=== Visual Studio Community 2019 for Mac ===

Version 8.10.1 (build 71) Installation UUID: 15a15040-35e3-4c34-9896-7312e5694663 GTK+ 2.24.23 (Raleigh theme) Xamarin.Mac 6.18.0.23 (d16-6 / 088c73638)

Package version: 612000140

=== Mono Framework MDK ===

Runtime: Mono 6.12.0.140 (2020-02/51d876a041e) (64-bit) Package version: 612000140

=== Roslyn (Language Service) ===

3.10.0-4.21269.26+029847714208ebe49668667c60ea5b0a294e0fcb

=== NuGet ===

Version: 5.9.0.7134

=== .NET Core SDK ===

SDK: /usr/local/share/dotnet/sdk/5.0.301/Sdks SDK Versions: 5.0.301 5.0.203 5.0.202 5.0.103 5.0.102 5.0.101 5.0.100 3.1.410 3.1.409 3.1.408 3.1.406 3.1.405 3.1.404 3.1.403 3.1.402 2.1.810 2.1.701 MSBuild SDKs: /Applications/Visual Studio.app/Contents/Resources/lib/monodevelop/bin/MSBuild/Current/bin/Sdks

=== .NET Core Runtime ===

Runtime: /usr/local/share/dotnet/dotnet Runtime Versions: 5.0.7 5.0.6 5.0.5 5.0.3 5.0.2 5.0.1 5.0.0 3.1.16 3.1.15 3.1.14 3.1.12 3.1.11 3.1.10 3.1.9 3.1.8 3.1.2 2.1.22

=== .NET Core 3.1 SDK ===

SDK: 3.1.410

=== Xamarin.Profiler ===

Version: 1.6.12.29 Location: /Applications/Xamarin Profiler.app/Contents/MacOS/Xamarin Profiler

=== Updater ===

Version: 11

=== Apple Developer Tools ===

Xcode 12.5 (18205) Build 12E262

=== Xamarin.Mac ===

Version: 7.14.0.3 (Visual Studio Community) Hash: 17fdcf569 Branch: d16-10 Build date: 2021-05-20 15:46:14-0400

=== Xamarin Designer ===

Version: 16.10.0.119 Hash: 36a2d986f Branch: remotes/origin/d16-10 Build date: 2021-06-02 19:41:34 UTC

=== Xamarin.Android ===

Version: 11.3.0.1 (Visual Studio Community) Commit: xamarin-android/d16-10/22fc2b3 Android SDK: /Users/fanmixco/Library/Developer/Xamarin/android-sdk-macosx Supported Android versions: None installed

SDK Tools Version: 26.1.1 SDK Platform Tools Version: 31.0.2 SDK Build Tools Version: 30.0.2

Build Information: Mono: b4a3858 Java.Interop: xamarin/java.interop/d16-10@f39db25 ProGuard: Guardsquare/proguard/v7.0.1@912d149 SQLite: xamarin/sqlite/3.35.4@85460d3 Xamarin.Android Tools: xamarin/xamarin-android-tools/d16-10@c5732a0

=== Microsoft OpenJDK for Mobile ===

Java SDK: /Users/fanmixco/Library/Developer/Xamarin/jdk/microsoft_dist_openjdk_1.8.0.25 1.8.0-25 Android Designer EPL code available here: https://github.com/xamarin/AndroidDesigner.EPL

=== Android SDK Manager ===

Version: 16.10.0.12 Hash: e240b8c Branch: remotes/origin/d16-10 Build date: 2021-06-01 18:26:34 UTC

=== Android Device Manager ===

Version: 16.10.0.14 Hash: e340248 Branch: remotes/origin/d16-10 Build date: 2021-06-01 18:26:52 UTC

=== Xamarin.iOS ===

Version: 14.20.0.3 (Visual Studio Community) Hash: 17fdcf569 Branch: d16-10 Build date: 2021-05-20 15:46:15-0400

=== Build Information ===

Release ID: 810010071 Git revision: 3664adb3ec17b7a29476110bb1c6f7083d43b1ab Build date: 2021-06-08 13:22:15-04 Build branch: release-8.10

=== Operating System ===

Mac OS X 10.16.0 Darwin 20.5.0 Darwin Kernel Version 20.5.0 Sat May 8 05:10:33 PDT 2021 root:xnu-7195.121.3~9/RELEASE_X86_64 x86_64

Reproduction Link

Attached. SaveThatPower.zip

Workaround

I'm checking. Probably to write native code in Android.

[holecekp]

You probably need to add HorizontalTextAlignment="Center" for the label to center the text inside it.

[AmrAlSayed0]

With the Label's HorizontalOptions set to CenterAndExpand, the Label itself is centered but the text is still left aligned (the default). When the text is small, there is extra space on both sides of the label and it becomes centered. When the text is large, it fills the entire width of the screen and centered, left or right aligned Labels appear exactly the same. The text wraps to the next line, and since the text alignment is set to left (the default) it appears like it does in the 2nd screenshot.

Try setting HorizontalTextAlignment to Center. That should fix your problem.

[jsuarezruiz]

@FANMixco Could you try the previous feedback?