2.依附弹窗（AttachListPopup）

愿你出走半生,归来仍是少年！ 

环境：.NET 7

        基于基础的Popup对象实现的依附于某个控件的弹窗，弹窗可呈现数组对象，达到较好的选择交互效果。

1.布局

        通过Border实现圆角边框轮廓，然后通过内部的ListView实现列表展示。

2.代码

        通过传入要依附的控件对象以及需要进行选择的文本集合，可实现弹窗的构建。在选择后通过CloseAsync方法返回选择的数据序号。

/// 

/// 依附列表popup
/// 
public partial class AttachListPopup : CommunityToolkit.Maui.Views.Popup
{

    /// 

    /// 
    /// 
    /// 选项
    /// 依附的控件
    /// 左侧间隔
    /// 底部间隔
    /// 宽度
    public AttachListPopup(List items ,View anchorView,double marginLeft,double marginBottom,double width=140)
    {
        InitializeComponent();

        lv.ItemsSource = items;

        this.Anchor=anchorView;
       
        outLyt.Padding = new Thickness(anchorView.Width+ marginLeft, 0, 0,  marginBottom);
           
        outLyt.WidthRequest = anchorView.Width +marginLeft+ width;
    }
 

    private async void lv_ItemSelected(object sender, SelectedItemChangedEventArgs e)
    {
		await CloseAsync(e.SelectedItemIndex);
    }
}

3.使用

var allBTiles = smv.BasicTiles.Select(p => p.Last().DisplayName).ToList();

var popup = new AttachListPopup(allBTiles, sender as Button, 12, 20);

var result = await this.ShowPopupAsync(popup);

if (result != null)
{
    await smv.ChangedBasicTile((int)result);

    await Toast.Make($"底图已切换为{allBTiles[(int)result]}").Show();
}

4.效果

        此处展示是基于Android平台，实现点击功能按钮后展示弹窗并选择信息给出反馈。