Question

I am developing an application where i want to browse images like native WindowsPhone form.

I have used Pivot control. Everything works, but there is one unwanted thing. The image does not fill all display area. There is a gap on the top of page. I have set margin and padding everywhere where it is possible. And the result is still the same. 🙁

Here is my XAML code:

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid 
    x:Name="LayoutRoot" 
    Background="Transparent" 
    Margin="0">
    <toolkit:PerformanceProgressBar 
        VerticalAlignment="Top"
        HorizontalAlignment="Left"
        IsIndeterminate="{Binding IsBusy}"
        Visibility="{Binding IsBusy, Converter={StaticResource BoolToVisibilityConverter}}"            
        />

    <controls:Pivot
        x:Name="PhotoPivot"
        ScrollViewer.HorizontalScrollBarVisibility="Auto"
        IsHitTestVisible="True"
        ItemsSource="{Binding Photos}"
        Margin="0"
        Padding="0"                 
        >
        <controls:Pivot.HeaderTemplate>             
            <DataTemplate/>
        </controls:Pivot.HeaderTemplate>

        <controls:Pivot.ItemTemplate>
            <DataTemplate >
                <controls:PivotItem
                    x:Name="PhotoPivotItem"
                    Margin="0"                        
                    >
                    <Image
                        x:Name="PhotoPicture"
                        Source="{Binding}"
                        Stretch="Uniform"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Stretch" 
                        Margin="0"
                        />
                </controls:PivotItem>
            </DataTemplate>
        </controls:Pivot.ItemTemplate>

    </controls:Pivot>
</Grid>

Answer 1

Are you talking about the system tray?
To remove the system tray use the following code:

shell:SystemTray.IsVisible="False"

Update:

I’m not real sure why that extra space is there.
I created a simplified version of your example and the only thing I could think of is to use negative margins. There is probably a better solution that I am just overlooking, but for now you can just use the following:

<controls:PivotItem x:Name="PhotoPivotItem" Margin="0,-10,0,0">

Although, from your posted image, it looks as if you have a bigger gap than I did, so you might need to decrease the margin.