Xamarin Forms：点击ListView中Logout菜单打开RadPopup的实现方法

步骤1：整合Popup到主页面XAML #

把你原来单独的Popup ContentPage代码直接移到包含ListView的主页面中，无需单独创建ContentPage承载Popup。修改后的主页面XAML如下：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:你的项目命名空间"
             xmlns:lang="clr-namespace:你的语言资源命名空间"
             xmlns:telerikPrimitives="clr-namespace:Telerik.Maui.Controls.Primitives;assembly=Telerik.Maui.Controls"
             x:Class="你的项目命名空间.主页面类名">

    <ContentPage.Content>
        <Grid>
            <!-- 原ListView代码，新增ItemSelected事件 -->
            <ListView x:Name="listview" x:FieldModifier="public" 
                      BackgroundColor="{StaticResource BlueDark}"
                      SeparatorVisibility="Default" 
                      SeparatorColor="White" 
                      SelectionMode="Single"
                      HasUnevenRows="False"
                      ios:ListView.SeparatorStyle="FullWidth"
                      ItemSelected="OnMenuItemSelected">

                <ListView.ItemsSource>
                    <x:Array Type="{x:Type local:MenuItem}">
                        <local:MenuItem  Title="{x:Static lang:AppResources.MenuHome}"           TargetPage="{x:Type local:AlarmsListPage}"/>
                        <local:MenuItem  Title="{x:Static lang:AppResources.MenuSitesAndAssets}" TargetPage="{x:Type local:AlarmsListPage}"/>
                        <local:MenuItem  Title="{x:Static lang:AppResources.MenuUserProfile}"    TargetPage="{x:Type local:AlarmsListPage}"/>
                        <local:MenuItem  Title="{x:Static lang:AppResources.MenuFeedback}"       TargetPage="{x:Type local:AlarmsListPage}"/>
                        <local:MenuItem  Title="{x:Static lang:AppResources.MenuLogout}"        TargetPage="{x:Type local:AlarmsListPage} "/>
                    </x:Array>
                </ListView.ItemsSource>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="33"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <Label Grid.Column="0" Grid.ColumnSpan="3"
                                       Text="{Binding Title}" TextColor="white" Padding="15,0,0,0"
                                       VerticalTextAlignment="Center"/>
                            </Grid>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

            <!-- 直接在页面中声明Logout确认Popup -->
            <telerikPrimitives:RadPopup x:Name="LogoutPopup" Placement="Center" OutsideBackgroundColor="WhiteSmoke" IsModal="True">
                <telerikPrimitives:RadBorder CornerRadius="10" BackgroundColor="{StaticResource BlueDark}">
                    <Grid Padding="25">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="100"/>
                            <ColumnDefinition Width="100"/>
                        </Grid.ColumnDefinitions>
                        
                        <Label Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" 
                               TextColor="{StaticResource White}" HorizontalTextAlignment="Center"
                               Text="Are you sure you want to log out? You will no longer receive alarm notifications."
                               Margin="0,0,0,20"/>
                        
                        <Button Grid.Column="0" Grid.Row="1" BackgroundColor="Transparent" 
                                TextColor="{StaticResource White}" Text="Yes" Clicked="OnLogoutYesClicked"/>
                        
                        <Button Grid.Column="1" Grid.Row="1" BackgroundColor="Transparent" 
                                TextColor="{StaticResource White}" Text="No" Clicked="OnLogoutNoClicked"/>
                    </Grid>
                </telerikPrimitives:RadBorder>
            </telerikPrimitives:RadPopup>
        </Grid>
    </ContentPage.Content>
</ContentPage>

步骤2：编写后台C#事件处理代码 #

在主页面的.cs文件中添加以下逻辑：

using Telerik.Maui.Controls.Primitives;

namespace 你的项目命名空间;

public partial class 主页面类名 : ContentPage
{
    public 主页面类名()
    {
        InitializeComponent();
    }

    // ListView项选中事件
    private void OnMenuItemSelected(object sender, SelectedItemChangedEventArgs e)
    {
        if (e.SelectedItem is not MenuItem selectedItem) return;

        // 判断是否点击了Logout项
        if (selectedItem.Title == AppResources.MenuLogout)
        {
            LogoutPopup.IsOpen = true;
        }
        else
        {
            // 其他菜单选项的页面跳转逻辑，保留你原有代码即可
            var targetPage = (Page)Activator.CreateInstance(selectedItem.TargetPage);
            Navigation.PushAsync(targetPage);
        }

        // 取消选中状态，避免重复触发事件
        listview.SelectedItem = null;
    }

    // 确认退出按钮点击事件
    private void OnLogoutYesClicked(object sender, EventArgs e)
    {
        // 在此添加退出登录逻辑：比如清除用户缓存、跳转登录页
        // 示例：
        // Preferences.Clear();
        // Application.Current.MainPage = new LoginPage();

        LogoutPopup.IsOpen = false;
    }

    // 取消退出按钮点击事件
    private void OnLogoutNoClicked(object sender, EventArgs e)
    {
        LogoutPopup.IsOpen = false;
    }
}

关键说明 #

1. 移除了单独的Popup ContentPage：RadPopup是依附于当前页面的控件，无需独立页面承载。
2. 设置Popup为IsModal="True"：确保用户必须通过按钮操作关闭Popup，避免误触外部区域关闭。
3. 手动取消ListView选中状态：防止重复点击同一菜单项时多次触发事件。

内容的提问来源于stack exchange，提问作者wanderingdev