Xamarin - how to create horizontal line with centered text (XAML)

Question

I'm trying this for many days but didn't succeed. I'm trying to do the same than this image:

So my intention is to create in XAML, a simple bar with centered text to be added on the Sign Up Page and Register Page but I really don't how to do it on Xamarin Essentials 1.7.5 & .NET Standard 2.1 using XAML. This project is built on Visual Studio 2022 using C# as a programming language. Tried to create a Grid with 2 rows like this but didn't work as expected.

                <Grid ColumnDefinitions="Auto,*">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <BoxView Grid.Row="0" HeightRequest="1" BackgroundColor="White" Margin="10,0,10,0"/>
                    <Label Grid.Row="1" Text="OR" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"/>
                </Grid>

Could anyone help me? Thanks in advance.

Answer 1

Create a Grid with three columns:

<Grid ColumnDefinitions="*,auto,*">
      <Grid.Resources>
            <Style TargetType="BoxView">
                  <Setter Property="Color" Value="Gray"/>
                  <Setter Property="HorizontalOptions" Value="FillAndExpand"/>
                  <Setter Property="VerticalOptions" Value="Center"/>
                  <Setter Property="HeightRequest" Value="1"/>
            </Style>
      </Grid.Resources>
      <BoxView Grid.Column="0"/>
      <Label Text="OR" Grid.Column="1"/>
      <BoxView Grid.Column="2"/>
</Grid>

This creates a line with a "OR" in the middle. You could add some Margin to the BoxViews so that it fits your needs.