Как установить фоновое изображение в заголовке оболочки xamarin с помощью всплывающего окна? - PullRequest
1 голос
/ 21 февраля 2020

Я занимаюсь разработкой проекта Xamarin.Forms 4 и использую оболочку приложения.

Я использовал панель вкладок, и благодаря пользовательскому средству визуализации я добавил фоновое изображение в «заголовок»

в

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

и я следовал ЭТОМ для рендерера

И я получил это

Header with background image

Теперь, когда мне нужно добавить боковое меню, я заменил предыдущий код AppShell.xaml на:

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

И я получаю это: Header flyout without the background image (значок является временным и представляет значок меню бургера ?)

Есть способ создать средство визуализации или что-то вроде средства отображения Tabbar?

Заранее спасибо!

Ответы [ 2 ]

2 голосов
/ 24 февраля 2020

Согласно вашему описанию, я думаю, вы хотите установить фоновое изображение для панели инструментов, а не для вкладки.

Пользовательский рендер может сделать это.

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);
    }
}
}

enter image description here

0 голосов
/ 26 февраля 2020

Я обнаружил, что неправильно написал оболочку XAML, это было решение!

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

Следуя примеру "Xanimals", я не понял важность " Tab"tag, с этим тегом приложение вернулось, чтобы использовать все стили и средство визуализации.

...