Здесь лучшим подходом будет использование Padding вместо Margin. Вы поймете, почему через некоторое время.
Итак, чтобы начать с реализации - вам нужно использовать возможности пользовательских средств визуализации .
. В этом конкретном случае c нам потребуется наследовать от ShellRenderer
. Кроме того, есть некоторые различия для Android и для iOS - для Android вам потребуется переопределить CreateBottomNavViewAppearanceTracker
и для iOS - CreateTabBarAppearanceTracker
Предполагая, что вы выполнили рекомендации и назвали вашу оболочку AppShell , тогда 2 класса будут выглядеть следующим образом.
Android:
using Android.Content;
using TestShellTabBarMargin;
using TestShellTabBarMargin.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
[assembly: ExportRenderer(typeof(AppShell), typeof(AppShellRenderer))]
namespace TestShellTabBarMargin.Droid
{
public class AppShellRenderer : ShellRenderer
{
public AppShellRenderer(Context context)
: base(context)
{
}
protected override IShellBottomNavViewAppearanceTracker CreateBottomNavViewAppearanceTracker(ShellItem shellItem)
{
return new MarginedTabBarAppearance();
}
}
}
iOS:
using TestShellTabBarMargin;
using TestShellTabBarMargin.iOS;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
[assembly: ExportRenderer(typeof(AppShell), typeof(AppShellRenderer))]
namespace TestShellTabBarMargin.iOS
{
public class AppShellRenderer : ShellRenderer
{
protected override IShellTabBarAppearanceTracker CreateTabBarAppearanceTracker()
{
return new MarginedTabBarAppearance();
}
}
}
Далее вам нужно будет создать классы внешнего вида и реализовать интерфейсы, которые мы только что переопределили для Android и iOS ( IShellBottomNavViewAppearanceTracker
и IShellTabBarAppearanceTracker
соответственно).
После реализации интерфейсов важным методом является SetAppearance
. ResetAppearance
также будет работать, но он вызывается во многих других случаях, и нам нужно изменить его только один раз.
Вот как это выглядит по умолчанию на Android:
Правильная реализация состоит в том, чтобы установить левые и правые отступы нижнего навигационного представления следующим образом:
using Android.Support.Design.Widget;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
namespace TestShellTabBarMargin.Droid
{
public class MarginedTabBarAppearance : IShellBottomNavViewAppearanceTracker
{
public void Dispose()
{
}
public void SetAppearance(BottomNavigationView bottomView, ShellAppearance appearance)
{
bottomView.SetPadding(400, 0, 400, 0);
}
public void ResetAppearance(BottomNavigationView bottomView)
{
}
}
}
Конечный результат:
Если мы хотим установить поля вместо отступов, то мы можем изменить layoutParams вида следующим образом:
public void SetAppearance(BottomNavigationView bottomView, ShellAppearance appearance)
{
if (bottomView.LayoutParameters is LinearLayout.LayoutParams layoutParams)
{
layoutParams.SetMargins(400, 0, 400, 0);
bottomView.LayoutParameters = layoutParams;
}
}
Однако здесь это будет выглядеть так: Вы можете go и попытаться установить цвет фона родительского представления, но конечный результат будет таким же, и с набором отступов вам не нужно будет пытаться исправить то, что не нарушено.
Для iOS базовый поток такой же. Важный метод - снова SetAppearance
, и внутри него мы можем изменить наш UITabBar
.
К сожалению, я еще не нашел правильную конфигурацию, но я обновлю свой ответ, когда я это сделаю. Настройка полей / смещений вида / кадра должна сработать, но я подозреваю, что ребята из Xamarin сбрасывают значения после того, как метод был выполнен. Я должен немного повозиться и проб и ошибок здесь произойти.
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
namespace TestShellTabBarMargin.iOS
{
public class MarginedTabBarAppearance : IShellTabBarAppearanceTracker
{
public void Dispose()
{
}
public void ResetAppearance(UITabBarController controller)
{
}
public void SetAppearance(UITabBarController controller, ShellAppearance appearance)
{
// Modify tab bar settings
}
public void UpdateLayout(UITabBarController controller)
{
}
}
}
Редактировать: Установка ширины и позиционирования элементов в по центру также должна работать и на самом деле работает, но только на iPhone (на Портрет). Как я уже сказал, я подозреваю, что ребята из Xamarin делают некоторые обновления после наших изменений.
Это должно работать, но это не так:
public void SetAppearance(UITabBarController controller, ShellAppearance appearance)
{
var tabBar = controller.TabBar;
tabBar.ItemWidth = 50;
tabBar.ItemPositioning = UITabBarItemPositioning.Centered;
}
NB: Имейте в виду, что вам нужно будет правильно обрабатывать изменения ориентации и, возможно, особенности устройства (планшет или телефон). В соответствии с возвращаемыми значениями вы можете только затем обновить нужные смещения.