SampleBottomDrawer
SampleBottomDrawer copied to clipboard
BottomDrawer blocks UI
The BottomDrawer blocks the UI even when not visible
expected behaviour: User can click on any item on the page
actual behaviour: User clicks arent recognised (to test replace the label with a button, you cant click it!)
solution: set IsVisible
async Task OpenDrawer()
{
Backdrop.IsVisible = true;
BottomToolbar.IsVisible = true;
await Task.WhenAll
(
Backdrop.FadeTo(1, length: duration),
BottomToolbar.TranslateTo(0, openY, length: duration, easing: Easing.SinIn)
);
}
async Task CloseDrawer()
{
await Task.WhenAll
(
Backdrop.FadeTo(0, length: duration),
BottomToolbar.TranslateTo(0, 500, length: duration, easing: Easing.SinIn)
);
Backdrop.IsVisible = false;
BottomToolbar.IsVisible = false;
}
<BoxView Color="#4B000000" Opacity="0" x:Name="Backdrop" IsVisible="false">
<BoxView.GestureRecognizers>
<TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
</BoxView.GestureRecognizers>
</BoxView>
<Frame x:Name="BottomToolbar" HeightRequest="200" VerticalOptions="End" BackgroundColor="#FFFFFF" CornerRadius="20" TranslationY="260" Padding="15,6" IsVisible="false">
<Frame.GestureRecognizers>
<PanGestureRecognizer
PanUpdated="PanGestureRecognizer_PanUpdated" />
</Frame.GestureRecognizers>
<StackLayout Orientation="Vertical" Padding="0,4">
<BoxView CornerRadius="2" HeightRequest="4" WidthRequest="40" BackgroundColor="LightGray" HorizontalOptions="Center"/>
<Label Text="Actions" HorizontalOptions="Center" FontSize="18" FontAttributes="Bold"/>
<TableView Intent="Settings" VerticalOptions="End" BackgroundColor="White">
<TableSection>
<TextCell
Text="Favorite"/>
<TextCell
Text="Share"/>
</TableSection>
</TableView>
</StackLayout>
</Frame>