如何在带有弹出窗口的 xamarin shell header 中设置背景图片？

Question

我正在开发 Xamarin.Forms 4 项目，并且正在使用应用程序 shell。

我使用的是 Tabbar，多亏了自定义渲染器，我才能将背景图片添加到 "header"

在

<TabBar>
        <Tab
            Title="ANALYSIS"
            Icon ="chart_icon.png">
            <ShellContent
                ContentTemplate="{DataTemplate local:Reports.ReportsPage}" />
        </Tab>
        // other tabs...
</TabBar>

我已经关注 THIS 渲染器

我已经得到了这个

现在我必须添加侧边菜单，我将之前的 AppShell.xaml 代码替换为：

    <FlyoutItem  FlyoutDisplayOptions="AsMultipleItems">
        <ShellContent Title="ANALYSIS"
                      Icon="chart_icon.png"
                      ContentTemplate="{DataTemplate local:Reports.ReportsPage}" />
        //other tabs...
    </FlyoutItem>

我明白了：（该图标是临时的，代表汉堡菜单图标）

有创建渲染器或类似 Tabbar 渲染器的方法吗？

提前致谢！

Answer 1

根据你的描述，我想你想为工具栏而不是标签栏设置背景图片。

自定义渲染器可以做到这一点。

MyShell.cs

 public class MyShell:Shell
{
}

AppShell.xaml.cs 注意：AppShell需要继承MyShell。

 public partial class AppShell : MyShell
{
    public AppShell()
    {
        InitializeComponent();
    }
}

MyShellRenderer.cs

[assembly: ExportRenderer(typeof(MyShell), typeof(MyShellRenderer))]
namespace ShellDemo.Droid
{
public class MyShellRenderer : ShellRenderer
{
    public MyShellRenderer(Context context) : base(context)
    {
    }

    protected override IShellToolbarAppearanceTracker CreateToolbarAppearanceTracker()
    {
        return new CustomToolbarAppearanceTracker();
    }
}
public class CustomToolbarAppearanceTracker : IShellToolbarAppearanceTracker
{
    public void Dispose()
    {

    }

    public void ResetAppearance(Android.Support.V7.Widget.Toolbar toolbar, IShellToolbarTracker toolbarTracker)
    {

    }

    public void SetAppearance(Android.Support.V7.Widget.Toolbar toolbar, IShellToolbarTracker toolbarTracker, ShellAppearance appearance)
    {
        toolbar.SetBackgroundResource(Resource.Drawable.pink);
    }
}
}

Answer 2

我发现我写错了 shell XAML，这就是解决方案！

    <FlyoutItem  FlyoutDisplayOptions="AsMultipleItems">
        <Tab Title="ANALYSIS"
             Icon="chart_icon.png">
            <ShellContent ContentTemplate="{DataTemplate local:Reports.ReportsPage}" />
        </Tab>
        <!-- others tabs -->
    </FlyoutItem>

按照 "Xanimals" 示例，我不明白“Tab”标签的重要性，应用程序已经返回使用该标签以使用所有样式和渲染器。

如何在带有弹出窗口的 xamarin shell header 中设置背景图片？

How to set a background image in the xamarin shell header with a flyout?

shell

xamarin

xamarin.forms

flyout