Question

I am building an MVVM Panorama Windows Phone 7 application.

At some point of Panorama Item’s layout I get a bottom margin of a panorama header box, that moves my content too far down. Is there a way I can set a bottom margin of a ContentPresenter, that is generated to hold the controls, defined in the Panorama.HeaderTemplate?

Here is my layout list in Silverlight Spy:

In case the screen shot is not readable, here is a large version:
http://bit.ly/rBvNp8

Something generates a 26 points bottom margin for a header box (probably the control’s code, that handles a layout). How can I control this value? I need it to be set to 0.

Answer 1

In order to control a ContentPresenter‘s properties one needs to redefine the default template (within a style setter) for the PanoramaItem. In my particular case it is PanoramaItem‘s style.

<Style TargetType="controls:PanoramaItem">
            <Setter Property="CacheMode" Value="BitmapCache"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="controls:PanoramaItem">
                        <Grid Background="{TemplateBinding Background}" Margin="12,0,0,0">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="auto"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <ContentControl x:Name="header" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" FontSize="{StaticResource PhoneFontSizeExtraExtraLarge}" FontFamily="{StaticResource PhoneFontFamilySemiLight}" HorizontalAlignment="Left" Margin="10,-2,0,0">
                                <ContentControl.RenderTransform>
                                    <TranslateTransform x:Name="headerTransform"/>
                                </ContentControl.RenderTransform>
                            </ContentControl>
                            <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Grid.Row="1" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

Setting Margin=”10,-2,0,0″ does the trick.