App theme updates in 4.6-SR4. (#629)

* Page rename for 4.6-SR4.

* App theme updates due to 4.6-SR4.

Author: davidbritch

UserInterface/SystemThemesDemo/SystemThemesDemo.Android/SystemThemesDemo.Android.csproj

@@ -53,7 +53,7 @@
     <Reference Include="System.Numerics.Vectors" />
   </ItemGroup>
   <ItemGroup>
-    <PackageReference Include="Xamarin.Forms" Version="4.6.0.800" />
+    <PackageReference Include="Xamarin.Forms" Version="4.6.0.967" />
   </ItemGroup>
   <ItemGroup>
     <Compile Include="MainActivity.cs" />

UserInterface/SystemThemesDemo/SystemThemesDemo.iOS/SystemThemesDemo.iOS.csproj

@@ -123,7 +123,7 @@
     <Reference Include="System.Numerics.Vectors" />
   </ItemGroup>
   <ItemGroup>
-    <PackageReference Include="Xamarin.Forms" Version="4.6.0.800" />
+    <PackageReference Include="Xamarin.Forms" Version="4.6.0.967" />
   </ItemGroup>
   <Import Project="$(MSBuildExtensionsPath)\Xamarin\iOS\Xamarin.iOS.CSharp.targets" />
   <ItemGroup>

UserInterface/SystemThemesDemo/SystemThemesDemo/App.xaml

@@ -7,44 +7,39 @@
              x:Class="SystemThemesDemo.App">
     <Application.Resources>
 
-        <AppThemeColor x:Key="PageBackgroundColor"
-                       Light="White"
-                       Dark="Black" />
-        <AppThemeColor x:Key="NavigationBarColor"
-                       Light="WhiteSmoke"
-                       Dark="Teal" />
-        <AppThemeColor x:Key="PrimaryColor"
-                       Light="WhiteSmoke"
-                       Dark="Teal" />
-        <AppThemeColor x:Key="SecondaryColor"
-                       Light="Black"
-                       Dark="White" />
-        <AppThemeColor x:Key="PrimaryTextColor"
-                       Light="Black"
-                       Dark="White" />
-        <AppThemeColor x:Key="SecondaryTextColor"
-                       Light="White"
-                       Dark="White" />
-        <AppThemeColor x:Key="TertiaryTextColor"
-                       Light="Gray"
-                       Dark="WhiteSmoke" />
-        <AppThemeColor x:Key="TransparentColor"
-                       Light="Transparent"
-                       Dark="Transparent" />
+        <Color x:Key="TransparentColor">Transparent</Color>
+
+        <!-- Light colors -->
+        <Color x:Key="LightPageBackgroundColor">White</Color>
+        <Color x:Key="LightNavigationBarColor">WhiteSmoke</Color>
+        <Color x:Key="LightPrimaryColor">WhiteSmoke</Color>
+        <Color x:Key="LightSecondaryColor">Black</Color>
+        <Color x:Key="LightPrimaryTextColor">Black</Color>
+        <Color x:Key="LightSecondaryTextColor">White</Color>
+        <Color x:Key="LightTertiaryTextColor">Gray</Color>
+
+        <!-- Dark colors -->
+        <Color x:Key="DarkPageBackgroundColor">Black</Color>
+        <Color x:Key="DarkNavigationBarColor">Teal</Color>
+        <Color x:Key="DarkPrimaryColor">Teal</Color>
+        <Color x:Key="DarkSecondaryColor">White</Color>
+        <Color x:Key="DarkPrimaryTextColor">White</Color>
+        <Color x:Key="DarkSecondaryTextColor">White</Color>
+        <Color x:Key="DarkTertiaryTextColor">WhiteSmoke</Color>
 
         <Style TargetType="NavigationPage">
             <Setter Property="BarBackgroundColor"
-                    Value="{DynamicResource NavigationBarColor}" />
+                    Value="{AppThemeBinding Light={StaticResource LightNavigationBarColor}, Dark={StaticResource DarkNavigationBarColor}}" />
             <Setter Property="BarTextColor"
-                    Value="{DynamicResource SecondaryColor}" />
+                    Value="{AppThemeBinding Light={StaticResource LightSecondaryColor}, Dark={StaticResource DarkSecondaryColor}}" />
         </Style>
 
         <Style x:Key="ButtonStyle"
                TargetType="Button">
             <Setter Property="BackgroundColor"
-                    Value="{DynamicResource PrimaryColor}" />
+                    Value="{AppThemeBinding Light={StaticResource LightPrimaryColor}, Dark={StaticResource DarkPrimaryColor}}" />
             <Setter Property="TextColor"
-                    Value="{DynamicResource SecondaryColor}" />
+                    Value="{AppThemeBinding Light={StaticResource LightSecondaryColor}, Dark={StaticResource DarkSecondaryColor}}" />
             <Setter Property="HeightRequest"
                     Value="45" />
             <Setter Property="WidthRequest"
@@ -56,23 +51,23 @@
         <Style x:Key="LargeLabelStyle"
                TargetType="Label">
             <Setter Property="TextColor"
-                    Value="{DynamicResource SecondaryTextColor}" />
+                    Value="{AppThemeBinding Light={StaticResource LightSecondaryTextColor}, Dark={StaticResource DarkSecondaryTextColor}}" />
             <Setter Property="FontSize"
                     Value="30" />
         </Style>
 
         <Style x:Key="MediumLabelStyle"
                TargetType="Label">
             <Setter Property="TextColor"
-                    Value="{DynamicResource PrimaryTextColor}" />
+                    Value="{AppThemeBinding Light={StaticResource LightPrimaryTextColor}, Dark={StaticResource DarkPrimaryTextColor}}" />
             <Setter Property="FontSize"
                     Value="25" />
         </Style>
 
         <Style x:Key="SmallLabelStyle"
                TargetType="Label">
             <Setter Property="TextColor"
-                    Value="{DynamicResource TertiaryTextColor}" />
+                    Value="{AppThemeBinding Light={StaticResource LightTertiaryTextColor}, Dark={StaticResource DarkTertiaryTextColor}}" />
             <Setter Property="FontSize"
                     Value="15" />
         </Style>

UserInterface/SystemThemesDemo/SystemThemesDemo/SystemThemesDemo.csproj

@@ -11,7 +11,7 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Xamarin.Forms" Version="4.6.0.800" />
+    <PackageReference Include="Xamarin.Forms" Version="4.6.0.967" />
   </ItemGroup>
   <ItemGroup>
     <Folder Include="Images\" />

UserInterface/SystemThemesDemo/SystemThemesDemo/Views/UserDetailsPage.xaml

@@ -4,7 +4,7 @@
              xmlns:local="clr-namespace:SystemThemesDemo"
              x:Class="SystemThemesDemo.Views.UserDetailsPage"
              Title="User Details"
-             BackgroundColor="{DynamicResource PageBackgroundColor}">
+             BackgroundColor="{AppThemeBinding Light={StaticResource LightPageBackgroundColor}, Dark={StaticResource DarkPageBackgroundColor}}">
     <ScrollView>
         <Grid>
             <Grid.RowDefinitions>
@@ -15,7 +15,7 @@
             </Grid.RowDefinitions>
             <Image Source="{local:ImageResource SystemThemesDemo.Images.FacePalm.jpg}"
                    Aspect="AspectFill" />
-            <Grid BackgroundColor="{DynamicResource TransparentBackgroundColor}">
+            <Grid BackgroundColor="{StaticResource TransparentColor}">
                 <Label VerticalOptions="End"
                        Margin="15"
                        Style="{StaticResource LargeLabelStyle}">

UserInterface/SystemThemesDemo/SystemThemesDemo/Views/UserSummaryPage.xaml

@@ -4,15 +4,15 @@
              xmlns:local="clr-namespace:SystemThemesDemo"
              x:Class="SystemThemesDemo.Views.UserSummaryPage"
              Title="User Summary"
-             BackgroundColor="{DynamicResource PageBackgroundColor}">
+             BackgroundColor="{AppThemeBinding Light={StaticResource LightPageBackgroundColor}, Dark={StaticResource DarkPageBackgroundColor}}">
     <ScrollView>
         <Grid>
             <Grid.RowDefinitions>
                 <RowDefinition Height="200" />
                 <RowDefinition Height="120" />
                 <RowDefinition Height="70" />
             </Grid.RowDefinitions>
-            <Grid BackgroundColor="{DynamicResource PrimaryColor}">
+            <Grid BackgroundColor="{AppThemeBinding Light={StaticResource LightPrimaryColor}, Dark={StaticResource DarkPrimaryColor}}">
                 <Label Text="Face-Palm Monkey"
                        VerticalOptions="Center"
                        Margin="15"

XAML/MarkupExtensions/MarkupExtensions/MarkupExtensions.Android/MarkupExtensions.Android.csproj

@@ -43,7 +43,7 @@
   </PropertyGroup>
   <ItemGroup>
     <PackageReference Include="Xamarin.Forms">
-      <Version>4.6.0.726</Version>
+      <Version>4.6.0.967</Version>
     </PackageReference>
   </ItemGroup>
   <ItemGroup>

XAML/MarkupExtensions/MarkupExtensions/MarkupExtensions.UWP/MarkupExtensions.UWP.csproj

@@ -90,7 +90,7 @@
   </PropertyGroup>
   <ItemGroup>
     <PackageReference Include="Microsoft.NETCore.UniversalWindowsPlatform" Version="6.0.12" />
-    <PackageReference Include="Xamarin.Forms" Version="4.6.0.726" />
+    <PackageReference Include="Xamarin.Forms" Version="4.6.0.967" />
   </ItemGroup>
   <ItemGroup />
   <ItemGroup>

XAML/MarkupExtensions/MarkupExtensions/MarkupExtensions.iOS/MarkupExtensions.iOS.csproj

@@ -134,7 +134,7 @@
   </ItemGroup>
   <ItemGroup>
     <PackageReference Include="Xamarin.Forms">
-      <Version>4.6.0.726</Version>
+      <Version>4.6.0.967</Version>
     </PackageReference>
   </ItemGroup>
   <Import Project="$(MSBuildExtensionsPath)\Xamarin\iOS\Xamarin.iOS.CSharp.targets" />

XAML/MarkupExtensions/MarkupExtensions/MarkupExtensions/OnAppThemeDemoPage.xaml renamed to XAML/MarkupExtensions/MarkupExtensions/MarkupExtensions/AppThemeBindingDemoPage.xaml

@@ -1,20 +1,20 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="MarkupExtensions.OnAppThemeDemoPage"
-             Title="OnAppTheme Demo">
+             x:Class="MarkupExtensions.AppThemeBindingDemoPage"
+             Title="AppThemeBinding Demo">
     <ContentPage.Resources>
 
         <Style x:Key="labelStyle"
                TargetType="Label">
             <Setter Property="TextColor"
-                    Value="{OnAppTheme Black, Light=Blue, Dark=Teal}" />
+                    Value="{AppThemeBinding Black, Light=Blue, Dark=Teal}" />
         </Style>
 
     </ContentPage.Resources>
     <StackLayout Margin="20">
         <Label Text="This text is green in light mode, and red in dark mode."
-               TextColor="{OnAppTheme Light=Green, Dark=Red}" />
+               TextColor="{AppThemeBinding Light=Green, Dark=Red}" />
         <Label Text="This text is black by default, blue in light mode, and teal in dark mode."
                Style="{DynamicResource labelStyle}" />
     </StackLayout>