Xamarin Forms - как работают цвета на панели навигации для iOS

Question

Я пытаюсь установить BarBackgroundColor и BarTextColor для простого приложения XF, и не понимаю вывод. Изображение того, что я вижу, следует за кодом, и весь код можно загрузить здесь .

Я установил BarBackgroundColor, BarTextColor и BackgroundColor ниже. Кажется, что единственный цвет (из прикрепленного изображения), который устанавливается - это Color.Blue BarBackgroundColor. Разве текст на панели навигации и в строке состояния не должен быть белым? Почему остальная часть страницы не красная?

App.xaml.cs

public App()
{
    InitializeComponent();

    var navPage = new NavigationPage(new MainPage());
    navPage.BarBackgroundColor = Color.Blue; 
    navPage.BarTextColor = Color.White;
    navPage.BackgroundColor = Color.Red;

    MainPage = navPage;
}

XAML

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="SampleApp.MainPage">

    <NavigationPage.TitleView>
        <StackLayout HorizontalOptions="Center" 
                     VerticalOptions="Center">
            <Label Text="Page Title" />
        </StackLayout>
    </NavigationPage.TitleView>

    <StackLayout>
        <!-- Place new controls here -->
        <Label Text="Welcome to Xamarin.Forms!" 
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />
    </StackLayout>

</ContentPage>

Вот вывод, который я получаю.

Answer 1

Разве текст на панели навигации и в строке состояния не должен быть белым?

Да, если код как общий, не будет.

• Сначала , мы проверим, как установить цвет текста на панели навигации.

Поскольку настройка пользовательского представления заголовка на панели навигации выполняется следующим образом:

<NavigationPage.TitleView>
    <StackLayout HorizontalOptions="Center" 
                 VerticalOptions="Center">
        <Label Text="Page Title" />
    </StackLayout>
</NavigationPage.TitleView>

Тогда код navPage.BarTextColor = Color.White; не будет работать. Причина в том, что вы задаете настраиваемый вид заголовка в ContentPage, и ContentPage переопределяет эффект текста панели навигации.

Если вы хотите показать белый цвет заголовка Naviagtion, есть два способа, основанные на общем коде.

One is: Установите TextColor для метки в пользовательском представлении заголовка.

<NavigationPage.TitleView>
    <StackLayout HorizontalOptions="Center" 
                 VerticalOptions="Center">
        <Label Text="Page Title" TextColor = "White" />
    </StackLayout>
</NavigationPage.TitleView>

Другое : Использование исходного заголовка панели навигации.

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="SampleApp.MainPage"
             Title="Page Title"> // Adding title text here

    <StackLayout>
        <!-- Place new controls here -->
        <Label Text="Welcome to Xamarin.Forms!" 
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />
    </StackLayout>

</ContentPage>

Тогда код navPage.BarTextColor = Color.White; будет работать для текста панели навигации.

• Второй , мы проверим, как установить цвет текста в строке состояния.

Здесь вам нужно войти в папку iOS Solution, затем открыть файл Info.plist с редактором Xml какследуйте:

Затем добавьте ключ UIViewControllerBasedStatusBarAppearance и установите его значение на false следующим образом.

<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

Сохранение и повторное создание проекта, теперь код navPage.BarTextColor = Color.White; может работать с цветом текста строки состояния.

Почему остальная часть страницы не красная?

Эта проблема должна быть другой для Android. Если в Android работает navPage.BackgroundColor = Color.Red;, это будет работать. Однако в iOS это не так.

Причина в том, что Navigation Controller отличается в Android и iOS. Панель навигации - это просто панель в Android, однако панель навигации может быть целым представлением страницы в iOS. Это означает, что если для Android задан цвет фона NavigationPage, он может работать на страницах навигации и ContentPage. Однако в iOS он может работать только на странице навигации. Если страница содержания требуется по-другому, вы должны установить ее отдельно на странице содержимого.

Таким образом, настройка цвета фона для iOS, как следует, может работать.

// Добавление цвета фона здесь может работать

<StackLayout>
    <!-- Place new controls here -->
    <Label Text="Welcome to Xamarin.Forms!" 
           HorizontalOptions="Center"
           VerticalOptions="CenterAndExpand" />
</StackLayout>

Окончательный эффектследующим образом: