CODEWITHSUNDEEP
xamlwindows-phone-8windows-phonetoolkit
robertk
robertk

Reputation: 2461

Listpicker fullmode background Windows Phone 8

I'm trying to set the background in fullmode of my listpicker. I've seen this: http://www.geekchamp.com/tips/listpicker-fullscreen-mode-background-problem-workaround but it doesn't seem to work with Windows Phone 8 ListPicker since the templates are different?

Here is my template:

    <ControlTemplate x:Key="ListPickerControlTemplate" TargetType="toolkit:ListPicker">
    <StackPanel>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="PickerStates">
                <VisualState x:Name="Normal">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="Header"
                            Storyboard.TargetProperty="Foreground"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource AppDefaultBlueColor}"
                                KeyTime="0"/>
                            </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                    </VisualState>
                <VisualState x:Name="Highlighted">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="UserControl"
                            Storyboard.TargetProperty="Foreground"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource PhoneTextBoxForegroundBrush}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="Border"
                            Storyboard.TargetProperty="Background"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource PhoneTextBoxEditBackgroundColor}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="Border"
                            Storyboard.TargetProperty="BorderBrush"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource PhoneTextBoxEditBorderBrush}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="Header"
                            Storyboard.TargetProperty="Foreground"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource AppDefaultBlueColor}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState x:Name="Disabled">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="Border"
                            Storyboard.TargetProperty="Background"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource TransparentBrush}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="Border"
                            Storyboard.TargetProperty="BorderBrush"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource PhoneDisabledBrush}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="UserControl"
                            Storyboard.TargetProperty="Foreground"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource PhoneDisabledBrush}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                            Storyboard.TargetName="Header"
                            Storyboard.TargetProperty="Foreground"
                            Duration="0">
                            <DiscreteObjectKeyFrame
                                Value="{StaticResource PhoneDisabledBrush}"
                                KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <ContentControl
        x:Name="Header"
            Content="{TemplateBinding Header}"
            ContentTemplate="{TemplateBinding HeaderTemplate}"
            Foreground="{StaticResource AppDefaultBlueColor}"
            FontSize="{StaticResource PhoneFontSizeNormal}"
            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
            Margin="0 0 0 8"/>
        <Grid >
            <Border x:Name="Border"
                Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}">
                <UserControl x:Name="UserControl" Foreground="{TemplateBinding Foreground}">
                    <StackPanel>
                        <TextBlock x:Name="MultipleSelectionModeSummary" Margin="8 8 0 8" />
                        <Canvas x:Name="ItemsPresenterHost" MinHeight="46">
                            <ItemsPresenter x:Name="ItemsPresenter">
                                <ItemsPresenter.RenderTransform>
                                    <TranslateTransform x:Name="ItemsPresenterTranslateTransform"/>
                                </ItemsPresenter.RenderTransform>
                            </ItemsPresenter>
                        </Canvas>
                    </StackPanel>
                </UserControl>
            </Border>
        </Grid>
    </StackPanel>
</ControlTemplate>

Upvotes: 1

Views: 1001

Answers (2)

atomaras
atomaras

Reputation: 2568

You can clone the ListPickerPage.xaml found in the Toolkit source, change anything you like and set the ListPicker::PickerPageUri to point to your own ListPickerPage copy.

Upvotes: 0

Jaihind
Jaihind

Reputation: 2778

Hope this helps you. Just add the following line in your App.xaml.cs file constructor:

((SolidColorBrush)App.Current.Resources["PhoneChromeBrush"]).Color = GetColorFromHexa("#1589FF").Color;

///Conert hexa decimal color value to solidcolorBrush
SolidColorBrush GetColorFromHexa(string hexaColor) 
{
    byte r = Convert.ToByte(hexaColor.Substring(1, 2), 16);
    byte g = Convert.ToByte(hexaColor.Substring(3, 2), 16);
    byte b = Convert.ToByte(hexaColor.Substring(5, 2), 16);
    SolidColorBrush soliColorBrush = new SolidColorBrush(Color.FromArgb(0xFF, r, g, b));
    return soliColorBrush;
}

Upvotes: 1

Related Questions