Jak zmienić kolory TabBar i NavigationBar w formularzach Xamarin?

Question

Mam aplikację Xamarin Forms i obecnie pracuję nad kodem dla iOS. W moich ustawieniach mam opcję zmiany motywu aplikacji (Ciemny i Jasny). To zasadniczo zmienia kolory tła i kolory tekstu stron. Teraz chciałbym móc zmienić SelectedImageTintColor i BarTintColor z TabBar oraz BarTintColor i TintColor z NavigationBar. W tej chwili mam stworzyć mechanizm renderujący dla zakładkami strony:

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

Teraz te kolory zajmie tylko efekt przy pierwszym uruchomieniu aplikacji.

Badałem ten problem, ale nie mógł znaleźć żadnej odpowiedzi od nikogo o tym, jak rozwiązać ten problem.

Wiem, że było wiele zmian w Xamarin, więc chciałbym się dowiedzieć, czy są jakieś ostatnie zmiany lub nowe sposoby rozwiązania tego problemu. Jestem otwarty na zapoznanie się z ewentualnymi sugestiami, ponieważ częścią wymagań dotyczących wniosku jest możliwość zmiany tych kolorów.

Edits:

Moja Tabbed strona została stworzona tak:

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

Na przykład, jeśli wybiorę Dark Theme to TabBar i NavigationBar kolor tła będzie Czarnego, TabBar ' s selectedimage będzie pomarańczowy, a tekst NavigationBar będzie biały. Podobnie, jeśli wybiorę opcję Jasny, wówczas kolor tła w kolorze TabBar i NavigationBar będzie biały, wybrany obrazek będzie zielony, a tekst NavigationBar będzie czarny.

Answer 1

Myślę, że problemem jest to, że nie są do słuchania i przenoszenia zmianę tematu. Ustawiasz kolory w OnElementChanged, które nie będą ponownie wywoływane po zmianie motywu.

Możesz utworzyć właściwość, która uruchomi wydarzenie, które subskrybujesz w swoim niestandardowym rendererze. Na przykład, jeśli utworzyć właściwość w klasie App następnie w niestandardowym TabbedPage renderujący można zrobić:

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

Ponieważ pasek nawigacyjny jest kontrolowana przez NavigationPage zamiast tego, trzeba będzie słuchać na zmianę własności tam także. Na szczęście nie potrzebujesz niestandardowego renderera, ponieważ możesz zmienić pasek i kolory tekstu za pomocą właściwości Formularzy.Więc można utworzyć klasę, która dziedziczy NavigationPage i zapisać się do imprezy:

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

utworzonego a sample project który pokazuje wszystko to, dzięki czemu można to sprawdzić :)

Answer 2

Możesz użyć właściwości tabbar, aby zmienić kolor tła i ikony, kiedy tylko potrzebujesz.

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 

same jak dla nawigacji

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 

Answer 3

wiesz o „Dynamic Zasobami "funkcja w Xamarin Forms?

Poddam się mojemu sposobowi. Może nie będzie łatwo, ale myślę, że to może zadziałać.

Krok 1: W App.xaml zestaw kluczy i domyślne ikony jak poniżej

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

and 

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

etc ..

Krok 2: Na stronie zakładkami ustawione jak

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

i tak włączone dla innych stron w TabbedPage

Krok 3: Teraz, gdy zmieniasz ustawione ustawienia,

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

i inne ikony tutaj.

Dzięki temu podejściu możesz zmienić wszystkie ikony w jednym miejscu. Daj mi znać swoją opinię na ten temat.