Windows Store App - Black Screen Transition for a

Question

i have a problem while navigating between pages of my app. Going from page "a" to page "b", i see a black screen just a second before seeing the page "b". It also happens in the opposite navigation. I know this issue is quite common, also here, but i don't understand how to solve it...and it's very ugly to view...

EDIT: just an important information: i've set a custom image as background of both the pages(a,b)...as you can see in the code "Assets/Page.jpg"

Here is my basic page "a" XAML:

<Page
x:Class="BlankApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:BlankApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Page.Resources>
    <Style x:Key="ButtonStyle2" TargetType="Button">
        <Setter Property="Background" Value="{StaticResource ButtonBackgroundThemeBrush}"/>
        <Setter Property="Foreground" Value="{StaticResource ButtonForegroundThemeBrush}"/>
        <Setter Property="BorderBrush" Value="{StaticResource ButtonBorderThemeBrush}"/>
        <Setter Property="BorderThickness" Value="{StaticResource ButtonBorderThemeThickness}"/>
        <Setter Property="Padding" Value="12,4,12,4"/>
        <Setter Property="HorizontalAlignment" Value="Left"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}"/>
        <Setter Property="FontWeight" Value="SemiBold"/>
        <Setter Property="FontSize" Value="{StaticResource ControlContentThemeFontSize}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="PointerOver" />
                                <VisualState x:Name="Pressed" >
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverBackgroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonDisabledBackgroundThemeBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Border">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonDisabledBorderThemeBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonDisabledForegroundThemeBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualState x:Name="Focused" />                                        
                                <VisualState x:Name="Unfocused"/>
                                <VisualState x:Name="PointerFocused"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="3">
                            <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Border>
                        <Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashArray="1,1"/>
                        <Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" StrokeDashArray="1,1"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>             
</Page.Resources>

<Grid Style="{StaticResource LayoutRootStyle}">
    <Grid.Background>
        <ImageBrush ImageSource="Assets/Page.jpg"/>
    </Grid.Background>
    <Button Margin="299,0,0,92" Width="160" Height="141" Click="Insert_Click" BorderBrush="White" Background="#00170C0C" Style="{StaticResource ButtonStyle2}" HorizontalAlignment="Left" BorderThickness="0" VerticalAlignment="Bottom" />
    <Button Margin="129,0,0,92" Width="160" Height="141" Click="Search_Click" Background="#00170C0C" BorderBrush="White" Style="{StaticResource ButtonStyle2}" HorizontalAlignment="Left" BorderThickness="0" VerticalAlignment="Bottom"/> 
</Grid>

Answer 1

You could use RequestedTheme property in app.xaml to change the default theme. Options are Dark and Light theme. Choosing one over the other will change text color and default transitions too.

Answer 2

Finally I've applied a workaround, in the App.xaml.cs in the OnLaunched method just put this lines in order to have a WHITE screen transition(not black!):

rootFrame = new Frame();
SolidColorBrush scb = new SolidColorBrush();
scb.Color = Colors.White;
rootFrame.Background = scb;