Windows Phone 8.1: How to change the background color and foreground color of ListPickerFlyout within a Button Flyout

Question

I have a Windows Phone 8.1 Application.

I have a button with a ListPickerFlyout.

<Button x:Name="myButton"
        Foreground="Red" Background="Green">
    <Button.Flyout>
        <ListPickerFlyout x:Name="myListPicker">
        </ListPickerFlyout>
    </Button.Flyout>
</Button>

I need to change the background and foreground color of the ListPickerFlyout.

I would be very glad if someone can help me. Thanks in Advance.

HelpMatters HelpMatters · Accepted Answer · 2015-02-10T06:29:03

To change the background I got the answer from this StackOverflow link

<Application.Resources>
<ResourceDictionary>
    <ResourceDictionary.ThemeDictionaries>
        <ResourceDictionary x:Key="Light">
            <SolidColorBrush x:Key="FlyoutBackgroundThemeBrush" Color="Green" />
        </ResourceDictionary>
    </ResourceDictionary.ThemeDictionaries>
</ResourceDictionary>

To change the Foreground:

The below example shows making the foreground as Red.

<ListPickerFlyout ItemsSource="{Binding Items}"
                  SelectedValue="{Binding SelectedItem, Mode=TwoWay}">
                  <ListPickerFlyout.ItemTemplate>
                      <DataTemplate>
                          <TextBlock Foreground="Red"
                                     Text="{Binding name}" />
                      </DataTemplate>
                  </ListPickerFlyout.ItemTemplate>
</ListPickerFlyout>

If you want it to adapt to light and dark themes with White and Black Foregrounds, use a ThemeBrush like AppBarToggleButtonCheckedBorderThemeBrush.

Windows Phone 8.1: How to change the background color and foreground color of ListPickerFlyout within a Button Flyout

1 Answers