You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

81 lines
4.8 KiB

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DragNDrop.InCellsPage"
Title="InCellsPage">
<ScrollView Padding="20">
<VerticalStackLayout Spacing="20">
<Label Text="Demo 1: lock Nounours in cages" FontSize="Title" HorizontalOptions="Center"
FontAttributes="Bold"/>
<Label Text="Drag and drop template nounours from the bag (top) in a cage (bottom). Nounours in the bags are infinite. But one cage can only contains one Nounours. You can also drag and drop a Nounours from a cage to another cage. To remove a Nounours from a cage, just drag and drop it outside any cage." LineBreakMode="WordWrap"/>
<Label Text="Infinite Bag of Nounours" FontSize="Medium" Margin="0,20,0,10" HorizontalOptions="Center"/>
<Border Stroke="DarkSalmon"
StrokeThickness="4" VerticalOptions="Center">
<Border.StrokeShape>
<RoundRectangle CornerRadius="60"/>
</Border.StrokeShape>
<FlexLayout BindableLayout.ItemsSource="{Binding FirstCollection}" MinimumHeightRequest="128"
AlignItems="Center" Wrap="Wrap">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Border WidthRequest="120" HeightRequest="120"
Padding="0" Margin="4"
Stroke="DarkSalmon"
StrokeThickness="4">
<Border.StrokeShape>
<RoundRectangle CornerRadius="60"/>
</Border.StrokeShape>
<Border.Shadow>
<Shadow Brush="DarkSalmon" Offset="3, 4"
Radius="10" Opacity="0.8"/>
</Border.Shadow>
<Border.GestureRecognizers>
<DragGestureRecognizer DragStarting="Bag_DragStarting"/>
</Border.GestureRecognizers>
<Image Source="{Binding Image}"/>
</Border>
</DataTemplate>
</BindableLayout.ItemTemplate>
</FlexLayout>
</Border>
<Label Text="10 Cages for Nounours" FontSize="Medium" Margin="0,30,0,10" HorizontalOptions="Center"/>
<Border Stroke="DarkSalmon"
StrokeThickness="4" VerticalOptions="Center"
Padding="0">
<Border.StrokeShape>
<RoundRectangle CornerRadius="6"/>
</Border.StrokeShape>
<FlexLayout BindableLayout.ItemsSource="{Binding SecondCollection}" MinimumHeightRequest="128"
AlignItems="Center" Wrap="Wrap">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Border WidthRequest="120" HeightRequest="120"
Padding="0" Margin="4"
Stroke="DarkRed"
StrokeThickness="4">
<Border WidthRequest="80" HeightRequest="80"
Padding="0" Margin="4"
Stroke="DarkSalmon"
StrokeThickness="4">
<Border.StrokeShape>
<RoundRectangle CornerRadius="60"/>
</Border.StrokeShape>
<Border.Shadow>
<Shadow Brush="DarkSalmon" Offset="3, 4"
Radius="10" Opacity="0.8"/>
</Border.Shadow>
<Border.GestureRecognizers>
<DragGestureRecognizer DragStarting="Cages_DragStarting"/>
<DropGestureRecognizer Drop="Cages_Drop"/>
</Border.GestureRecognizers>
<Image Source="{Binding MyPrecious.Image}"/>
</Border>
</Border>
</DataTemplate>
</BindableLayout.ItemTemplate>
</FlexLayout>
</Border>
</VerticalStackLayout>
</ScrollView>
</ContentPage>