Hello,
Welcome to our Microsoft Q&A platform!
rounded corner and margin for the FlyoutItems and the certain FlyOutItems to the bottom
The appearance of each FlyoutItem
can be customized by setting the Shell.ItemTemplate
attached property to a DataTemplate, try to custom the item template to add the corner. And Xamarin.Forms.Shell provides the FlyoutFooter which is the content that optionally appears at the bottom of the flyout, you could use it to display the views at bottom.
<Shell.ItemTemplate>
<DataTemplate>
<Frame CornerRadius="5" Padding="0">
<Grid ColumnDefinitions="0.2*,0.8*" VerticalOptions="FillAndExpand" BackgroundColor="LightBlue">
<Image Source="{Binding FlyoutIcon}"
Margin="5"
HeightRequest="45" />
<Label Grid.Column="1"
Text="{Binding Title}"
FontAttributes="Italic"
VerticalTextAlignment="Center" />
</Grid>
</Frame>
</DataTemplate>
</Shell.ItemTemplate>
<Shell.FlyoutFooter>
<!--display the content-->
</Shell.FlyoutFooter>
Tutorial: https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/shell/flyout
Best Regards,
Jarvan Zhang
If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.