question

ScottUphus-3823 avatar image
0 Votes"
ScottUphus-3823 asked KyleWang-MSFT answered

Dark mode with frames and entries are blank

I'm making a form to enter a bunch of information. I use frames to keep things separate and readable. But in dark mode, nothing shows. It seems like everything is set to white including the text color.
108303-darkmode-bug.png


![108341-screenshot-20210622-151911.jpg108266-screenshot-20210622-152003.jpg


dotnet-xamarin
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

KyleWang-MSFT avatar image
0 Votes"
KyleWang-MSFT answered

Hi ScottUphus-3823,

Welcome to our Microsoft Q&A platform!

In the xaml you provided, I did not find any code for AppThemeBinding. To respond to the theme change of the frame, you should set the corresponding AppTheme for it.

You can define custom style for the frame in App.xaml

 <Color x:Key="CardBackgroundLight">White</Color>
 <Color x:Key="CardBackgroundDark">Gray</Color>

 <Color x:Key="TextColorLight">Black</Color>
 <Color x:Key="TextColorDark">White</Color>

 <Style x:Key="CustomFrame" TargetType="Frame">
     <Setter Property="HasShadow" Value="True"/>
     <Setter Property="CornerRadius" Value="20"/>
     <Setter Property="BackgroundColor" Value="{AppThemeBinding 
                                                     Dark={StaticResource CardBackgroundDark},
                                                     Light={StaticResource CardBackgroundLight}}"/>
 </Style>

 <Style x:Key="ShowLabel" TargetType="Label">
     <Setter Property="TextColor" Value="{AppThemeBinding
                                             Dark={StaticResource TextColorDark},
                                             Light={StaticResource TextColorLight}}"/>
 </Style>

Then apply as follows,

 <Frame Style="{StaticResource CustomFrame}">
     <!--...-->
 </Frame>

Similarly, you can create styles for each control.

For more info about "respond to system theme changes", you can refer to this document.

Regards,
Kyle


If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.