底部定位的額外空間定位TextBlock（Windows Phone 8）

Question

我有一個TextBlock元素定位在新聞源矩形底部的問題。 我附上了問題的圖片（紅色箭頭指向它）。 「timeago」TextBlock底部有太多額外空間。

您可以看到，問題只發生在電影標題足夠短以適合第一行時。 我猜想這會使StackPanel縮小，因此移動TextBlock的時間會稍長一些。

我試着將父母的StackPanel的MinHeight更改爲更低的值甚至刪除屬性，但它似乎並沒有工作。 我猜測，這個問題是與 「內部」 的StackPanel包含內容，星（不可見）和 「TIMEAGO」

這是我LongListSelector

的DataTemplate中

<DataTemplate> 
    <Grid Margin="12,2,5,4" > 
     <Grid.RowDefinitions> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 

     <Rectangle Fill="{StaticResource PhoneAccentBrush}" 
          Opacity="0.75" 
          Margin="0,0" 
          HorizontalAlignment="Stretch" 
          VerticalAlignment="Stretch"/> 

     <StackPanel Grid.Row="0" Orientation="Horizontal" 
         Background="Transparent" 
         Height="auto" 
         MinHeight="99" 
         Width="auto"> 

      <Grid HorizontalAlignment="Center" 
          Background="#FFFFC700" 
          Height="auto" 
          Width="99"> 
       <Image Source="{Binding ImageUrl}" 
         Height="auto" 
         Width="auto" 
         Stretch="UniformToFill" 
         Margin="0" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Stretch"> 
       </Image> 
      </Grid> 


      <StackPanel Width="311" Margin="8,-7,0,0"> 
        <TextBlock Margin="10,15,15,0" Text="{Binding Content}" Style="{StaticResource NewsFeedHighlitedContent}" FontSize="24" /> 

       <Grid Margin="10,5,0,15" Visibility="{Binding StarsVisibility}"> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="30" /> 
         <ColumnDefinition Width="30" /> 
         <ColumnDefinition Width="30" /> 
         <ColumnDefinition Width="30" /> 
         <ColumnDefinition Width="30" /> 
        </Grid.ColumnDefinitions> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="auto" /> 
        </Grid.RowDefinitions> 

        <Image Source="{Binding StarOne}" Height="30" Margin="0,0" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="0" /> 
        <Image Source="{Binding StarTwo}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="1" /> 
        <Image Source="{Binding StarThree}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="2" /> 
        <Image Source="{Binding StarFour}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="3" /> 
        <Image Source="{Binding StarFive}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="4" /> 

       </Grid> 

       <TextBlock Text="{Binding Time}" Margin="8,14,25,7" VerticalAlignment="Bottom" Style="{StaticResource NewsTimeAgoStyle}" /> 
      </StackPanel> 
     </StackPanel> 
    </Grid> 
</DataTemplate> 

而對於 「NewsTimeAgoStyle」

風格

<Style x:Key="NewsTimeAgoStyle" TargetType="TextBlock"> 
    <Setter Property="Foreground" Value="White" /> 
    <Setter Property="FontSize" Value="20"/> 
    <Setter Property="FontFamily" Value="Segoe WP Light" /> 
    <Setter Property="Margin" Value="0,14,20,0" /> 
    <Setter Property="Opacity" Value="0.8" /> 
    <Setter Property="TextWrapping" Value="Wrap" /> 
    <Setter Property="HorizontalAlignment" Value="Right" /> 
</Style> 

有沒有人有任何線索如何解決這個問題？

Answer 1

我不確定，但問題可能是因爲您使用StackPanel來顯示標題和時間前的文本。我已將您的DataTemplate一點點更改爲使用Grid面板。試試看看這有什麼區別

<DataTemplate> 
<Grid Margin="12,2,5,4" > 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*" /> 
    </Grid.RowDefinitions> 

    <Rectangle Fill="{StaticResource PhoneAccentBrush}" 
         Opacity="0.75" 
         Margin="0,0" 
         HorizontalAlignment="Stretch" 
         VerticalAlignment="Stretch"/> 

     <Grid Grid.Row="0" 
      Background="Transparent" 
      Height="auto" 
      MinHeight="99"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="99"/> 
      <ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 

     <Grid HorizontalAlignment="Center" 
         Background="#FFFFC700"> 
      <Image Source="{Binding ImageUrl}" 
        Height="auto" 
        Width="auto" 
        Stretch="UniformToFill" 
        Margin="0" 
        HorizontalAlignment="Center" 
        VerticalAlignment="Stretch"> 
      </Image> 
     </Grid> 


     <Grid Width="311" Margin="8,-7,0,0" Grid.Column="1"> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto"/> 
       <RowDefinition Height="Auto"/> 
       <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 
      <TextBlock Margin="10,15,15,0" Text="{Binding Content}" Style="{StaticResource NewsFeedHighlitedContent}" FontSize="24" /> 

      <Grid Margin="10,5,0,15" Visibility="{Binding StarsVisibility}" Grid.Row="1"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="30" /> 
        <ColumnDefinition Width="30" /> 
        <ColumnDefinition Width="30" /> 
        <ColumnDefinition Width="30" /> 
        <ColumnDefinition Width="30" /> 
       </Grid.ColumnDefinitions> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="auto" /> 
       </Grid.RowDefinitions> 

       <Image Source="{Binding StarOne}" Height="30" Margin="0,0" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="0" /> 
       <Image Source="{Binding StarTwo}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="1" /> 
       <Image Source="{Binding StarThree}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="2" /> 
       <Image Source="{Binding StarFour}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="3" /> 
       <Image Source="{Binding StarFive}" Height="30" Width="30" Stretch="UniformToFill" Grid.Row="0" Grid.Column="4" /> 

      </Grid> 

      <TextBlock Text="{Binding Time}" Margin="8,14,25,7" Grid.Row="2" VerticalAlignment="Bottom" Style="{StaticResource NewsTimeAgoStyle}" /> 
     </Grid> 
    </Grid> 
</Grid> 
</DataTemplate>