it-swarm.com.ru

Как изменить цвета TabBar и Navigation Bar в формах Xamarin?

У меня есть приложение Xamarin Forms, и я сейчас работаю над кодом для iOS. В моих настройках у меня есть возможность изменить тему приложения (Dark и Light). Это в основном просто меняет цвет фона и цвета текста страниц. Теперь я хочу изменить SelectedImageTintColor и BarTintColorTabBar, а также BarTintColor и TintColorNavigationBar. На данный момент я создал рендерер для страницы с вкладками: 

protected override void OnElementChanged(VisualElementChangedEventArgs e)
{
   base.OnElementChanged(e);
   App.theme = (Theme)App.DB.GetIntSetting("ThemeColor");
   switch (App.theme)
   {
      case Theme.Dark:
      {
         TabBar.SelectedImageTintColor = UIColor.FromRGB(255, 165, 0);
         TabBar.BarTintColor = UIColor.Black;
         break;
      }
      case Theme.Light:
      {
         TabBar.SelectedImageTintColor = UIColor.FromRGB(60, 132, 60);
         TabBar.BarTintColor = UIColor.White;
         break;
      }
   }
}

Прямо сейчас эти цвета вступят в силу только при первом запуске приложения. 

 enter image description here

Я исследовал эту проблему, но не смог найти ни одного ответа о том, как решить эту проблему. 

Я знаю, что в Xamarin было много изменений, поэтому я хотел бы узнать, есть ли какие-либо недавние разработки или новые способы решения этой проблемы. Я открыт для изучения любых возможных предложений, так как часть требований, предъявляемых к приложению, заключается в возможности изменить эти цвета.

Редактирует: 

Моя страница Tabbed была создана следующим образом: 

public partial class MainPage : TabbedPage
{
   public MainPage()
   {
      InitializeComponent();
      var phrasesPage = new NavigationPage(new PhrasesPage())
      {
         Title = "Play",
         Icon = "play1.png"
      };
      var settingsPage = new NavigationPage(new SettingsPage())
      {
         Title = "Settings",
         Icon = "settings.png"
      };
      // other declarations here

      Children.Add(phrasesPage);
      Children.Add(settingsPage);
      // and more
   }
}

Например, если я выберу Темную тему, то цвет фона TabBar и NavigationBar будет черным, изображение выбранного TabBar будет оранжевым, а текст NavigationBar будет белым. Аналогичным образом, если я выберу «Светлая тема», цвет фона TabBar и NavigationBar будет белым, а изображение TabBar будет зеленым, а текст NavigationBar будет черным.

14
user6742877

Я думаю, проблема в том, что вы не слушаете и не занимаетесь сменой темы. Вы устанавливаете цвета в OnElementChanged, который больше не будет вызываться при смене темы. 

Вы можете создать свойство, которое будет запускать событие, на которое вы подписаны, в вашем пользовательском рендерере. Например, если вы создаете свойство в своем классе приложения, то в вашем пользовательском рендерере TabbedPage вы можете сделать:

protected override void OnElementChanged(VisualElementChangedEventArgs e)
{
    base.OnElementChanged(e);

    if(e.OldElement != null)
    {
        App.Current.PropertyChanged -= Current_PropertyChanged;
        return;
    }

    App.Current.PropertyChanged += Current_PropertyChanged; //subscribe to the App class' built in property changed event
    UpdateTheme();
}

void Current_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
{
    if(e.PropertyName == "DarkTheme")
    {
        UpdateTheme();
    }
}

Поскольку панель навигации контролируется NavigationPage, вам также придется прослушивать изменение свойства. К счастью, вам не понадобится пользовательский рендер, так как вы можете изменить цвет панели и текста с помощью свойств форм. Таким образом, вы можете создать класс, который наследуется от NavigationPage, и подписаться на событие:

public class CustomNavigationPage : NavigationPage
{
    public CustomNavigationPage(Page root) : base(root)
    {
        if(Device.OS == TargetPlatform.iOS)
        {
            App.Current.PropertyChanged += Current_PropertyChanged;
        }
    }
}

Я создал пример проекта который демонстрирует все это, чтобы вы могли проверить это :) 

8
jimmgarr

Вы можете использовать свойство вкладки для изменения фона и цвета значка, когда вам это нужно. 

 TabBar.TintColor = UIColor.White; // changer as per your need for tab icon's color
TabBar.BarTintColor = UIColor.Black; // changer as per your need for tabbar's backgroungcolor 

так же, как для навигации

this.NavigationController.NavigationBar.TintColor = UIColor.White;//change as per your need for tab icon color

this.NavigationController.NavigationBar.BarTintColor = UIColor.Black;// changer as per your need for Navbar' backgroungcolor 
1
KKRocks

Знаете ли вы о функции «Динамический ресурс» в формах Xamarin?

Я дам свой способ сделать это. Может быть нелегко, но я думаю, что это может работать.

Шаг 1: В app.xaml установите ключи и значки по умолчанию, как показано ниже

<FileImageSource x:Key="PlayIconKey">playdark.png</FileImageSource>
<FileImageSource x:Key="AboutIconKey">aboutdark.png</FileImageSource>

and

<Image Source="{ DynamicResource PlayIconKey }" />
<Image Source="{ DynamicResource AboutIconKey}" />

так далее..

Шаг 2: На вашей странице с вкладками установите как

var phrasesPage = new NavigationPage(new PhrasesPage())
{
 Title = "Play",
 Icon = Application.Current.Resources["PlayIconKey"]
};

и так далее для других страниц в TabbedPage

Шаг 3: Теперь, когда вы меняете настройки, просто установите

Application.Current.Resources["PlayIconKey"] = "playlight.png" 

и другие значки здесь.

При таком подходе вы можете поменять все иконки в одном месте .... Дайте мне знать ваше мнение по этому поводу.

0
Avinash Ramireddy