从数据库数据创建的 Xamarin Shell Flyout [xaml 版本]答案

【问题标题】：Xamarin Shell Flyout created from database data[xaml version]从数据库数据创建的 Xamarin Shell Flyout [xaml 版本]
【发布时间】：2021-04-18 18:54:42
【问题描述】：

我也在尝试从数据库列表中生成 Shell Flyout 元素。但我不确定直接在AppShell.xaml.cs 中实现是个好主意。是否有可能做同样的事情，但在 xml?

我在Define FlyoutItem appearance 中看到了类似的东西。但我还是想不通。另外，将代码直接实现到AppShell.xaml.cs 或App.xaml.cs 中是否是个好主意？

            LocationLevelViewModel diudu = new LocationLevelViewModel();
            var lists = diudu.Items;
            foreach (var list in lists)
            {
                ShellSection shell_section = new ShellSection();

                shell_section.Title = list.LocationName;
                shell_section.Icon = "icon_feed.png";
                shell_section.Items.Add(new ShellContent() { Content = new LocationLevelPage() });
                this.Items.Add(shell_section);
            }

【问题讨论】：

标签： android shell xamarin.forms flyout

【解决方案1】：

您提供的代码，您可以创建一个名为 AppShellCS 的新类，并在新的 AppShellCS.cs 文件中使用该代码，如下所示。它运作良好。我做了一个简单的例子来测试而不是数据库。

public class AppShellCS : Shell
{
    public AppShellCS()
    {
        LocationLevelViewModel diudu = new LocationLevelViewModel();
        //var lists = diudu.Items;
        var lists = new List<LocationLevelViewModel>
        {
            new LocationLevelViewModel() {  LocationName="A"},
            new LocationLevelViewModel() {  LocationName="B"},
            new LocationLevelViewModel() {  LocationName="C"}
        };

        foreach (var list in lists)
        {
            ShellSection shell_section = new ShellSection();

            shell_section.Title = list.LocationName;
            shell_section.Icon = "tab_feed.png";
            shell_section.Items.Add(new ShellContent() { Content = new LocationLevelPage() });
            this.Items.Add(shell_section);               
        }             


    }
}
public class LocationLevelViewModel
{
    public string LocationName { get; set; }
}

App.xaml.cs

public App()
    {
        InitializeComponent();

        DependencyService.Register<MockDataStore>();
        MainPage = new AppShellCS();
    }

输出：

如果你想在现有的 Shell 项目中添加它，你可以试试下面的代码。

AppShell.xaml.cs

public partial class AppShell : Xamarin.Forms.Shell
{
    public AppShell()
    {
        InitializeComponent();
        //Routing.RegisterRoute("step", typeof(Page2));

        LocationLevelViewModel diudu = new LocationLevelViewModel();
        //var lists = diudu.Items;
        var lists = new List<LocationLevelViewModel>
        {
            new LocationLevelViewModel() {  LocationName="A"},
            new LocationLevelViewModel() {  LocationName="B"},
            new LocationLevelViewModel() {  LocationName="C"}
        };

        foreach (var list in lists)
        {
            ShellSection shell_section = new ShellSection();

            shell_section.Title = list.LocationName;
            shell_section.Icon = "tab_feed.png";
            shell_section.Items.Add(new ShellContent() { Content = new LocationLevelPage() });
            this.Items.Add(shell_section);
        }

    }
}

输出：

【讨论】：