Forum Xamarin Xamarin.Forms

Xamarin Shell | How to bind list items to Shell Flayout

Hello World,
I want to display dynamic items in AppShell flyout that's retrieve from Webservice
How can I achieve that with binding list to Flyout itemSource

is that possible?

Answers

  • ColeXColeX Member, Xamarin Team Xamurai
    edited September 17

    Unfortunately shell does not support binding to Items currently ,check this issue .

    I tried to make a simplest test to simulate your scenario , code as below

    Model

    public class Content
    {
        public string Name { get; set; }
    
        public string Title { get; set; }
        public string Icon { get; set; }
    }
    
    public class Item
    {
    
        public Item()
        {
            Contents = new List<Content>();
        }
    
        public string Title { get; set; }
        public string Icon { get; set; }
        public List<Content> Contents { get; set; }
    }
    
    public class Model
    {
        public List<Item> Items { get; set; }
    
        public Model()
        {
    
           GetData();
        }
    
    
        async void GetData()
        {
           // replace the code with Webservice fetch
            await Task.Delay(1000);
    
            Items = new List<Item>();
    
    
            Item item1 = new Item();
            item1.Title = "Cat";
            item1.Icon = "cat.png";
    
            item1.Contents.Add(new Content() { Title = "cat1", Name = "CatsPage" });
            item1.Contents.Add(new Content() { Title = "cat2", Name = "CatsPage" });
    
            Item item2 = new Item();
            item2.Title = "Dog";
            item2.Icon = "dog.png";
    
            item2.Contents.Add(new Content() { Title = "dog1", Name = "DogsPage" });
            item2.Contents.Add(new Content() { Title = "dog2", Name = "DogsPage" });
    
    
            Items.Add(item1);
            Items.Add(item2);
        }
    }
    

    AppShell

       protected override void OnAppearing()
        {
            base.OnAppearing();
    
            Model model = new Model();
    
            foreach (var item in model.Items)
            {
                ShellSection s = new ShellSection
                {
                    Title = item.Title,
                    Icon = item.Icon
                };
    
    
                foreach (var content in item.Contents)
                {
                    ShellContent c = new ShellContent();
                    c.Title = content.Title;
                    c.Icon = content.Icon;
    
                    Type type = Type.GetType($"Xaminals.Views.{content.Name}");
                    object o = Activator.CreateInstance(type);
    
                    c.Content = o;
    
                    s.Items.Add(c);
                }
    
                this.Items.Add(s);
            }
        }
    

    The test is failed , it only displays a black screen , we could only hard code the flyout items in xaml or AppShell constructor method ,Webservice and dynamic binding is not supported.

Sign In or Register to comment.