Set MenuItemTemplate to Shell

[MattePozzy]

Hi, I need to set a custom template also for the MenuItem items in a Shell. I already used the method ItemTemplate but it works only for the FlyoutItem items.

I have found the property MenuItemTemplate and tried to set like this: .Set(MauiControls.Shell.MenuItemTemplateProperty, new MauiControls.DataTemplate(() => TemplateHost.Create(MenuItemTemplate()).NativeElement)) but I don't know how I should pass the current item.

private static VisualNode MenuItemTemplate(/*??? current Item*/)
        {
            return new Grid("68", "*")
            {
                new Label("boh")
                    .FontFamily(Costanti.Font.MaterialDesignIcons.ToString())
                    .FontSize(FontSize.Medium)
                    .VCenter().Margin(10,0)
            };
        }

for the ItemTemplate I used this function that has as paramters a MauiControls.BaseShellItem

private static VisualNode RenderItemTemplate(MauiControls.BaseShellItem currentItem)
        {
            return new Grid("68", "*")
            {
                new Label(currentItem.Title)
                    .FontFamily(Costanti.Font.MaterialDesignIcons.ToString())
                    .FontSize(FontSize.Medium)
                    .VCenter().Margin(10,0)
            };
        }

Thank you.

[adospace]

Added to the latest version, please use the new method MenuItemTemplate(). This is a sample usage:

        VisualNode RenderShell()
        {
            return new Shell
            {
                new FlyoutItem("Page1")
                {
                    new ContentPage("Page1")
                    {
                        new Label("PAGE 1").VCenter().HCenter().FontSize(50)
                    }
                },
                new FlyoutItem("Page2")
                {
                    new ShellContent()
                        .RenderContent(() => {
                            return new SecondPage();
                        })
                },

                new MenuItem("logout")
                    .OnClicked(logout)
            }
            .BackButtonIsVisible(false)
            .ItemTemplate(RenderItemTemplate)
            .MenuItemTemplate(RenderMenuItemTemplate)
            ;
        }

        void logout()
        {
            MauiControls.Shell.Current.FlyoutBehavior = FlyoutBehavior.Disabled;
            SetState(s => s.LoggedIn = false);
        }

        static VisualNode RenderItemTemplate(MauiControls.BaseShellItem item)
            => new Grid("68", "*")
            {
                new Label(item.Title)
                    .VCenter()
                    .Margin(10,0)
            };

        static VisualNode RenderMenuItemTemplate(MauiControls.MenuItem item)
            => new Grid("68", "*")
            {
                new Label(item.Text)
                    .VCenter()
                    .Margin(10,0)
            };

[MattePozzy]

Added to the latest version, please use the new method MenuItemTemplate(). This is a sample usage:

        VisualNode RenderShell()
        {
            return new Shell
            {
                new FlyoutItem("Page1")
                {
                    new ContentPage("Page1")
                    {
                        new Label("PAGE 1").VCenter().HCenter().FontSize(50)
                    }
                },
                new FlyoutItem("Page2")
                {
                    new ShellContent()
                        .RenderContent(() => {
                            return new SecondPage();
                        })
                },

                new MenuItem("logout")
                    .OnClicked(logout)
            }
            .BackButtonIsVisible(false)
            .ItemTemplate(RenderItemTemplate)
            .MenuItemTemplate(RenderMenuItemTemplate)
            ;
        }

        void logout()
        {
            MauiControls.Shell.Current.FlyoutBehavior = FlyoutBehavior.Disabled;
            SetState(s => s.LoggedIn = false);
        }

        static VisualNode RenderItemTemplate(MauiControls.BaseShellItem item)
            => new Grid("68", "*")
            {
                new Label(item.Title)
                    .VCenter()
                    .Margin(10,0)
            };

        static VisualNode RenderMenuItemTemplate(MauiControls.MenuItem item)
            => new Grid("68", "*")
            {
                new Label(item.Text)
                    .VCenter()
                    .Margin(10,0)
            };

I have update to .133 version but it seems that the render use the same function used for ItemTemplate and not the assigned function in MenuItemTemplate. Could you please check it? Thank you!