如何添加靜態標題和XAML的win8滾動內容

Question

我想添加一個靜態的標題或標題在XAML頁面，用戶可以滾動一些內容，但沒有標題

<Page 
x:Class="Advanced8weeks.day1" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:Advanced8weeks" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d"> 

<!--- I want this block to remain static on the top of the page --> 

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
    <TextBlock HorizontalAlignment="Left" Margin="80,100,0,0" TextWrapping="Wrap" Text="Day 1 " VerticalAlignment="Top" FontWeight="Bold" FontSize="24" RenderTransformOrigin="0.483,1.826"/> 
    <TextBlock HorizontalAlignment="Left" Margin="80,192,0,0" TextWrapping="Wrap" Text="Legs + cardio (1 min rest between sets) " VerticalAlignment="Top" FontWeight="Bold" FontSize="18"/> 

     <!--- From here I want to add a lot of Images and Button where user can scroll down --> 

     <TextBlock HorizontalAlignment="Left" Margin="80,287,0,0" TextWrapping="Wrap" Text="leg extentions 5 x 15 reps " VerticalAlignment="Top" Height="47" FontSize="16"/> 
    <Image HorizontalAlignment="Left" Height="100" Margin="80,334,0,0" VerticalAlignment="Top" Width="100" Source="pictures/imag1.png"/> 
    <TextBox HorizontalAlignment="Left" Margin="80,439,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="27" Height="17"/> 
    <TextBlock HorizontalAlignment="Left" Margin="80,417,0,0" TextWrapping="Wrap" Text="Set 1 " VerticalAlignment="Top" RenderTransformOrigin="-0.022,0.231" Width="47" FontSize="14"/> 
    <Button Content="OK" HorizontalAlignment="Left" Margin="158,439,0,0" VerticalAlignment="Top" FontSize="14" Click="Button_Click" Height="37"/> 

    <TextBlock HorizontalAlignment="Left" Margin="752,192,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" x:Name="timer" Height="22" Width="59" /> 
    <ScrollBar HorizontalAlignment="Left" Margin="472,317,0,0" VerticalAlignment="Top"/> 
    <TextBlock HorizontalAlignment="Left" Margin="80,506,0,0" TextWrapping="Wrap" Text="Squats 5 x 15 reps " VerticalAlignment="Top" Height="21" Width="148" FontSize="16"/> 
    <Image HorizontalAlignment="Left" Height="100" Margin="111,555,0,0" VerticalAlignment="Top" Width="100"/> 
    <Image HorizontalAlignment="Left" Height="68" Margin="80,541,0,0" VerticalAlignment="Top" Width="65" Source="pictures/imag2.png"/> 
    <TextBox HorizontalAlignment="Left" Margin="80,623,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" RenderTransformOrigin="0.203,0.344" Width="64" Height="23"/> 
    <Button Content="OK" HorizontalAlignment="Left" Margin="158,617,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.225,-0.342" Width="54"/> 


</Grid> 

所以我的第一次嘗試是添加一個ScrollViewer中，所以我做了這個

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
    <TextBlock HorizontalAlignment="Left" Margin="80,100,0,0" TextWrapping="Wrap" Text="Day 1 " VerticalAlignment="Top" FontWeight="Bold" FontSize="24" RenderTransformOrigin="0.483,1.826"/> 
    <TextBlock HorizontalAlignment="Left" Margin="80,192,0,0" TextWrapping="Wrap" Text="Legs + cardio (1 min rest between sets) " VerticalAlignment="Top" FontWeight="Bold" FontSize="18"/> 

     <!--- From here I want to add a lot of Images and Button where user can scroll down --> 

    <ScrollViewer > 

    <TextBlock HorizontalAlignment="Left" Margin="80,287,0,0" TextWrapping="Wrap" Text="leg extentions 5 x 15 reps " VerticalAlignment="Top" Height="47" FontSize="16"/> 
    <Image HorizontalAlignment="Left" Height="100" Margin="80,334,0,0" VerticalAlignment="Top" Width="100" Source="pictures/imag1.png"/> 
    <TextBox HorizontalAlignment="Left" Margin="80,439,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="27" Height="17"/> 
    <TextBlock HorizontalAlignment="Left" Margin="80,417,0,0" TextWrapping="Wrap" Text="Set 1 " VerticalAlignment="Top" RenderTransformOrigin="-0.022,0.231" Width="47" FontSize="14"/> 
    <Button Content="OK" HorizontalAlignment="Left" Margin="158,439,0,0" VerticalAlignment="Top" FontSize="14" Click="Button_Click" Height="37"/> 

    <TextBlock HorizontalAlignment="Left" Margin="752,192,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" x:Name="timer" Height="22" Width="59" /> 
    <ScrollBar HorizontalAlignment="Left" Margin="472,317,0,0" VerticalAlignment="Top"/> 
    <TextBlock HorizontalAlignment="Left" Margin="80,506,0,0" TextWrapping="Wrap" Text="Squats 5 x 15 reps " VerticalAlignment="Top" Height="21" Width="148" FontSize="16"/> 
    <Image HorizontalAlignment="Left" Height="100" Margin="111,555,0,0" VerticalAlignment="Top" Width="100"/> 
    <Image HorizontalAlignment="Left" Height="68" Margin="80,541,0,0" VerticalAlignment="Top" Width="65" Source="pictures/imag2.png"/> 
    <TextBox HorizontalAlignment="Left" Margin="80,623,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" RenderTransformOrigin="0.203,0.344" Width="64" Height="23"/> 
    <Button Content="OK" HorizontalAlignment="Left" Margin="158,617,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.225,-0.342" Width="54"/> 

    </ScrollViewer> 

</Grid> 

不過VS Express是給我這個錯誤：

內容屬性設置多次

我將不勝感激，如果有人可以解釋我什麼，我做錯了，爲什麼

大加讚賞，

低音

Answer 1

你不能將多個項目添加到ScrollViewer，因爲它是ContentControl，並且只能存儲一個元素。你應該把任何Panel您ScrollViewer（Grid，StackPanel，DockPanel等），其中將包含所有的元素中：

<ScrollViewer> 
    <Grid> 
    ... 
    </Grid> 
</ScrollViewer>