Unable to change the foreground color of Pivot different from Pivot Item in windows phone 8

Question

Purpose

I want to change my phone pivot and pivot item to be different foreground color from each other; I want pivot to be white and pivot item to be pink foreground color.

Problem

When I tried to change the pivot foreground color to white, the all the pivot items inside that pivot will take the same foreground color as their parent pivot no matter what foreground color I assigned to pivot items.

My code

Here are my design in xmal file:

<phone:Pivot Title="SKIN TEST" Foreground="#000000" Margin="-10,-30,0,0">
            <phone:PivotItem Header="product" Margin="10,37,14,-9">
                
                <Grid>
                    <!-- Title product detail -->
                    <ScrollViewer Height="Auto" Margin="32,-71,-22,91" Foreground="#000000">
                        <StackPanel>
                            <TextBlock FontSize="26" x:Name="txtbPro_Name" HorizontalAlignment="Left" Margin="10,10,0,0" TextWrapping="Wrap" Text="{Binding ItemDryName}" VerticalAlignment="Top" RenderTransformOrigin="0.254,-0.205" Height="auto" Width="414" MaxWidth="440" MaxHeight="240"/>
                            <!-- Image product detail -->
                            <Image x:Name="img_Product" HorizontalAlignment="Left" Height="220" Margin="10,10,0,0" VerticalAlignment="Top" Width="220" Source="{Binding ItemDryImage}"/>
                            <!-- Ingredient product detail -->
                            <TextBlock HorizontalAlignment="Left" Margin="10,30,0,0" TextWrapping="Wrap" Text="Ingredient"  Foreground="#000000" VerticalAlignment="Top" RenderTransformOrigin="-1.887,-1.756" Height="36" Width="412" FontSize="24"/>
                            <TextBlock x:Name="txtb_ingridient" HorizontalAlignment="Left" Margin="10,15,0,30" TextWrapping="Wrap"  Foreground="#000000" VerticalAlignment="Top" Height="auto" Width="412" FontSize="24"/>

                        </StackPanel>
                    </ScrollViewer>
                </Grid>

            </phone:PivotItem>

            <phone:PivotItem Header="description">
                <Grid>
                    <!-- Description of product detail -->
                    <ScrollViewer Height="Auto" Margin="10,0,0,-315" Foreground="#000000">
                        <StackPanel>
                            <TextBlock x:Name="txtb_description1" Text="" TextWrapping="Wrap" Width="auto"  FontSize="24"/>
                            <Line Width="100" Height="10"/>
                            <TextBlock x:Name="txtb_description2" Text="" TextWrapping="Wrap" Width="auto" FontSize="24"/>
                        </StackPanel>
                    </ScrollViewer>
                </Grid>
            </phone:PivotItem>

            <phone:PivotItem Header="how to use">
                <Grid>
                    <!-- How to use of product detail-->
                    <TextBlock x:Name="txtb_howToUse" HorizontalAlignment="Left" Margin="10,0,0,0" TextWrapping="Wrap" Foreground="#000000" FontSize="24" 
                               Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit.  " VerticalAlignment="Top" Height="593" Width="auto"/>
                </Grid>
            </phone:PivotItem>
        </phone:Pivot>

How can I make it different? Do I need to apply any static resource and style on each pivot??

Mulflar · Accepted Answer · 2014-09-09T13:49:06.493

0

I tried your code and I can't see what is what you want to do exactly or your problem. phone:Pivot foreground is for the Main title of the pivot if I set it to pink, only that title changes. The pivotItem foreground gives color to the content inside it (not the header!), but the you should remove the foregound color in the scrollviewer to si the changes. Is your problem with the header?

edited Sep 09 '14 at 13:49

answered Sep 09 '14 at 13:34

Mulflar

424
9
22

Yes, I also want them to be the same, but my pivot has a background of pink; therefore, I want its foreground to be white, and under neath it, the pivot items has the background of white; therefore, I want its foreground to be pink. Each pivot item I display it as panorama such as product, description, and how to use. What resources should I use? Could you give me a code snip hinting? Thanks – user2273145 Sep 09 '14 at 13:52
Yes, my problem is the pivot header and the pivot title. the pivot title is covered every pivot item header. I have followed your instruction and removed the scrollviewer foreground color but it's still the same. Here's my change ` ` however, the product still show the white foreground as Pivot Title. – user2273145 Sep 09 '14 at 14:11
Ok, then you should take a look here: http://stackoverflow.com/questions/17902064/how-to-change-pivot-header-template-in-windows-phone-8 or there http://stackoverflow.com/questions/11746411/pivotitem-control-windows-phone-7-set-color-of-disabled-header – Mulflar Sep 09 '14 at 15:13

Unable to change the foreground color of Pivot different from Pivot Item in windows phone 8

Purpose

Problem

My code

1 Answers1