Passing data to CommunityToolkit.Maui Popup

Question

How do I pass data to a CommunityToolkit Popup in a .Net MAUI app?

Documentation shows how to send a result from Popup back to the page but doesn’t show how to pass data to the Popup.

Answer 1

I made the following Based on Gerald Versluis video:

toolkit popup Xaml:

<toolkit:Popup xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
           xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
           xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
           xmlns:model="modelnamespace"
           x:Class="namespace.PopUpSelectService">
    <VerticalStackLayout>
        <CollectionView x:Name="selectService"
                    HorizontalOptions="Center"
                    VerticalOptions="Center">
            <CollectionView.ItemTemplate>
                <DataTemplate x:DataType="model:sal_ServiceResponse">
                    <Grid RowDefinitions="auto,auto,auto,auto,auto">
                        <Button Text="{Binding nombre_servicio}"
                            Grid.Row="0"
                            Clicked="Button_Clicked" />
                    </Grid>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
    </VerticalStackLayout>
</toolkit:Popup>

PopupSelectService .cs

public partial class PopUpSelectService
{ 
    public PopUpSelectService(List<salServiceDTO> sal_Service)
    {
        InitializeComponent();
        selectService.ItemsSource = sal_Service;        
    }

    private void Button_Clicked(object sender, EventArgs e)
    {
        this.Close(((Button)sender).Text);
    }
}

How i call the popup In my viewmodel:

var popup = new PopUpSelectService(response.sal_Service);                                           
var result = await Shell.Current.ShowPopupAsync(popup);

and also in var result you get the value you select on the popup!