Style border of popup

[Daniel]

Hi,

How I set the red line ?

Thanks,

          

Current:

 

To Be:

 <telerikPrimitives:RadPopup.Popup Margin="10">
                    <telerikPrimitives:RadPopup x:Name="popupError" IsOpen="{Binding IsOpenPopup , Mode=TwoWay}"
                                  IsModal="false"
                                  OutsideBackgroundColor="#6F000000"
                                            Placement="Center">
                        <telerikMauiControls:RadBorder CornerRadius="8"  BorderThickness="1"
                                         BackgroundColor="{DynamicResource SecondaryColor}">
                            <Grid Padding="20"
                                WidthRequest="300"
                                HeightRequest="180">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="40" />
                                    <RowDefinition Height="80" />
                                </Grid.RowDefinitions>
                                <Button Grid.Row="0"
                                    Padding="2"
                                   HorizontalOptions="End"
                                   Text="X"  WidthRequest="30" HeightRequest="30"
                                   Command="{Binding ClosePopupCommand}" 
                                  BackgroundColor="{DynamicResource PrimaryColor}" TextColor="White" />
                                <Label x:Name="labelError" Text="{Binding ErrorMessage, Mode=TwoWay}" Grid.Row="1" TextColor="Black" HorizontalOptions="Center" VerticalOptions="Center"/>
                            </Grid>
                        </telerikMauiControls:RadBorder>
                    </telerikPrimitives:RadPopup>
                </telerikPrimitives:RadPopup.Popup>

[Lance | Manager Technical Support]

Hello Daniel,

The BorderThickness property of any element in XAML is a Thickness object in .NET.  The values are set in the following order Left, Top, Right, Bottom... please refer to the Microsoft documentation for more detail and examples Thickness Struct | Microsoft Docs.

When you only set a single value, it is a shortcut that sets all 4 number to that same value.

For example, in your code I see:

BorderThickness="1"

Thanks to the XAML compiler, it will turn into this:

BorderThickness = new Thickness(1,1,1,1);

If you want a different size for one of the sides, then you would just use a different value for that side of the Thickness object.

BorderThickness="Left_Value, Top_Value, Right_Value, Bottom_Value"

 

In your screenshot, it looks like you only want a red border on the left side. That means you just set the value for that side and leave the others at 0.

<MyControl BorderThickness="2,0,0,0" BorderColor="Red" />

Regards,
Lance | Manager Technical Support
Progress Telerik