Home > Software engineering >  .NET MAUI Set individual border widths?
.NET MAUI Set individual border widths?

Time:05-24

With CSS, you can set border-left-width, border-right-width, etc. to get individual widths on your borders.

Is the equivalent possible in .NET MAUI, and if so, how do you do it?

I know about the Border element, but it only has a single StrokeWidth.

CodePudding user response:

Border element can't do that, because it is designed to render a stroke, possibly with rounded corners and dashes.

Use a ContentView with BackgroundColor and Padding.

Here's the Maui dotnet bot with different thickness padding (border) on each side:

    <ContentView BackgroundColor="Gray">
        <ContentView BackgroundColor="HotPink" Padding="1,2,3,4" VerticalOptions="Center" HorizontalOptions="Center">
            <VerticalStackLayout BackgroundColor="LightPink" Spacing="25" Padding="30,0" VerticalOptions="Center" HorizontalOptions="Center">
                <Image Source="dotnet_bot.png" HeightRequest="100" HorizontalOptions="Center" />
                <Button x:Name="CounterBtn" Text="Click me" SemanticProperties.Hint="Counts the number of times you click" Clicked="OnCounterClicked" HorizontalOptions="Center" />
            </VerticalStackLayout>
        </ContentView>
    </ContentView>

  • Related