locked
How to Keep the Hub Header in Place RRS feed

  • Question

  • In the following simple code sample the hub header looks fine when I view the solution through  the Windows 8 phone emulator in Visual Studio 2013. However, when I scroll to the next hub section the hub header gets cut off. It is even further cut off after I scroll to the third section. Is there a way to keep the hub header locked in place? I would have thought that a fixed hub header would have been the default functionality.

    <Grid>
            <Hub Header="Hub">
                <HubSection Header="HubSection 0">
                    <DataTemplate>
                        <Grid/>
                    </DataTemplate>
                </HubSection>
                <HubSection Header="HubSection 1">
                    <DataTemplate>
                        <Grid/>
                    </DataTemplate>
                </HubSection>
                <HubSection Header="HubSection 2">
                    <DataTemplate>
                        <Grid/>
                    </DataTemplate>
                </HubSection>
            </Hub>
        </Grid>


    • Edited by IMOsiris Tuesday, May 27, 2014 9:55 PM Typo
    Tuesday, May 27, 2014 9:02 PM

Answers

  • If you want a fixed title Put a TextBlock above the sections and it will not move.

    Jeff Sanders (MSFT)

    @jsandersrocks - Windows Store Developer Solutions @WSDevSol
    Getting Started With Windows Azure Mobile Services development? Click here
    Getting Started With Windows Phone or Store app development? Click here
    My Team Blog: Windows Store & Phone Developer Solutions
    My Blog: Http Client Protocol Issues (and other fun stuff I support)

    • Marked as answer by IMOsiris Wednesday, May 28, 2014 8:12 PM
    Wednesday, May 28, 2014 6:54 PM
  • In light of your thoughts, I created a two-row grid as follows:

    <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
    
            <TextBlock x:Uid="HubHeader" Grid.Row="0" Style="{StaticResource CustomHubHeaderStyle}" />
            <Hub Grid.Row="1">
                <HubSection Header="HubSection0">                
                    <DataTemplate>
                        <Grid/>
                    </DataTemplate>
                </HubSection>

    • Marked as answer by IMOsiris Wednesday, May 28, 2014 8:12 PM
    Wednesday, May 28, 2014 8:11 PM

All replies

  • If you want a fixed title Put a TextBlock above the sections and it will not move.

    Jeff Sanders (MSFT)

    @jsandersrocks - Windows Store Developer Solutions @WSDevSol
    Getting Started With Windows Azure Mobile Services development? Click here
    Getting Started With Windows Phone or Store app development? Click here
    My Team Blog: Windows Store & Phone Developer Solutions
    My Blog: Http Client Protocol Issues (and other fun stuff I support)

    • Marked as answer by IMOsiris Wednesday, May 28, 2014 8:12 PM
    Wednesday, May 28, 2014 6:54 PM
  • In light of your thoughts, I created a two-row grid as follows:

    <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
    
            <TextBlock x:Uid="HubHeader" Grid.Row="0" Style="{StaticResource CustomHubHeaderStyle}" />
            <Hub Grid.Row="1">
                <HubSection Header="HubSection0">                
                    <DataTemplate>
                        <Grid/>
                    </DataTemplate>
                </HubSection>

    • Marked as answer by IMOsiris Wednesday, May 28, 2014 8:12 PM
    Wednesday, May 28, 2014 8:11 PM