Wie wird die Zeilenhöhe im Raster richtig eingestellt?

Question

Kürzlich habe ich meiner Vorlage neue Zeilen hinzugefügt und alles schien mir gut zu sein, aber aus irgendeinem Grund begann sich mein verstecktes Panel unbeholfen zu benehmen. Das Panel sollte in der Mitte sein. Es erscheint nach der Animation. Ich bemerkte, Probleme starten nach dem Hinzufügen von RowDefinition Height = "40" />, aber ich verstehe nicht genau, was falsch ist und wie es stattdessen sein sollte. Bitte hilf mir.

<Grid Margin="0,80,0,0" ShowGridLines="True"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="40"/> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*"/> 
      <RowDefinition Height="Auto"/> 
    </Grid.RowDefinitions> 

    <TextBlock Grid.Row="0" x:Name="textBlock" HorizontalAlignment="Center" VerticalAlignment="Center" Height="40" Margin="0,10,0,10" TextWrapping="Wrap" Text="{Binding Path=Controller.LegViewModel.Title}" FontSize="28"/> 
     <ContentControl Grid.Row="1" Content="{Binding Controller.LegViewModel}" VerticalAlignment="Center" Margin="0,10,0,10" ContentTemplateSelector="{StaticResource LegTemplateSelector}" Background="#FFF7F7F7"/> 
     <ListView Grid.Row="2" ItemsSource="{Binding Path=Controller.LegViewModel.LegSections}" Margin="5,10,5,10" ScrollViewer.VerticalScrollBarVisibility="Visible"> 
      <ListView.ItemContainerStyle> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="ListViewItem"> 
           <!--<ContentControl Content="{Binding}" ContentTemplateSelector="{StaticResource LegTemplateSelector}" Background="#FFF7F7F7" Grid.ColumnSpan="2"/>--> 
           <ContentPresenter ContentTemplate="{StaticResource StandartPartTemplate}" Grid.ColumnSpan="2"/> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </ListView.ItemContainerStyle> 
      <!--<ContentControl ContentTemplateSelector="{StaticResource LegTemplateSelector}" Background="#FFF7F7F7" Grid.ColumnSpan="2"/>--> 
     </ListView> 
     <!--<ContentControl Content="{Binding Controller.LegViewModel}" ContentTemplateSelector="{StaticResource LegTemplateSelector}" Background="#FFF7F7F7" Grid.ColumnSpan="2"/>--> 

     <StackPanel Orientation="Horizontal" Grid.Row="3" VerticalAlignment="Center"> 
      <Button x:Name="AddButton" Command="{Binding RevertCommand}" Content="Вернуться к ноге" HorizontalAlignment="Left" VerticalAlignment="Top" Width="408" Background="#FFDBEDF7" FontSize="16" Grid.ColumnSpan="2"/> 
      <Button x:Name="AddButton_Copy" Command="{Binding SaveCommand}" Content="Сохранить" HorizontalAlignment="Right" VerticalAlignment="Top" Width="408" Background="#FFDBEDF7" FontSize="16" Grid.ColumnSpan="2"/> 
      <Button x:Name="AddButton2" Content="Сохранить" HorizontalAlignment="Right" VerticalAlignment="Top" Width="408" Background="#FFDBEDF7" FontSize="16" Grid.ColumnSpan="2"/> 
     </StackPanel> 

     <Border Visibility="{Binding PanelOpened, Converter={StaticResource BoolToVis}}" x:Name="ShadowOverlay"> 
      <Border.Background> 
       <SolidColorBrush Color="Black" Opacity="0.78"/> 
      </Border.Background> 
     </Border> 

     <Border x:Name="panelControl" Margin="0,0,-450,0" VerticalAlignment="Stretch" HorizontalAlignment="Right" RenderTransformOrigin="0.5,0.5" Width="450" Height="275" DataContext="{Binding CurrentPanelViewModel}" > 
      <Border.RenderTransform> 
       <TransformGroup> 
        <ScaleTransform/> 
        <SkewTransform/> 
        <RotateTransform/> 
        <TranslateTransform/> 
       </TransformGroup> 
      </Border.RenderTransform> 

      <Grid> 
       <Canvas Background="#FFC6E8E6"> 
        <TextBlock x:Name="textBlock7" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Canvas.Left="135" FontSize="14" Canvas.Top="4"><Run Text="Добавить сво"/><Run Text="ё описание"/><Run Text=" "/><Run Text=" "/></TextBlock> 
        <TextBox x:Name="textBox1" HorizontalAlignment="Left" Height="43" TextWrapping="Wrap" Text="{Binding Path=Text1}" VerticalAlignment="Top" Width="422" Canvas.Left="10" Canvas.Top="61" /> 
        <TextBox x:Name="textBox2" HorizontalAlignment="Left" Height="43" TextWrapping="Wrap" Text="{Binding Path=Text2}" VerticalAlignment="Top" Width="422" Canvas.Left="10" Canvas.Top="173"/> 
        <CheckBox x:Name="checkBox" Content="есть поле для размерности" HorizontalAlignment="Left" IsChecked="{Binding Path=HasSize}" VerticalAlignment="Top" Canvas.Left="10" Canvas.Top="109"/> 
        <ComboBox x:Name="comboBox" HorizontalAlignment="Left" VerticalAlignment="Top" Width="233" ItemsSource="{Binding Path=Dimentions}" Visibility="{Binding Path=HasSize, Converter={StaticResource BoolToVis}}" SelectedItem="{Binding SelectedItem}" Canvas.Left="199" Canvas.Top="113" Height="23"/> 
        <Button x:Name="button" Content="Отмена" HorizontalAlignment="Left" VerticalAlignment="Top" Width="150" Canvas.Left="53" Canvas.Top="232"/> 
        <Button x:Name="button_Copy" Content="Добавить" HorizontalAlignment="Left" VerticalAlignment="Top" Width="150" Command="{Binding AddCommand}" Canvas.Left="249" Canvas.Top="232"/> 
        <Separator Height="18" Margin="0" Canvas.Top="19" Width="442"/> 
        <TextBlock x:Name="textBlock_Copy" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Canvas.Top="37" Canvas.Left="10" Text="Первая часть:"/> 
        <TextBlock x:Name="textBlock_Copy1" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Canvas.Top="152" Canvas.Left="10"><Run Text="Вторая часть "/><Run Text="(не обязательно к заполнению):"/></TextBlock> 
        <CheckBox x:Name="checkBox_Copy" Content="двойная размерность (х*х)" Visibility="{Binding Path=DoubleSizeAvailable, Converter={StaticResource BoolToVis}}" HorizontalAlignment="Left" IsChecked="{Binding HasSize}" VerticalAlignment="Top" Canvas.Left="10" Canvas.Top="132"/> 
       </Canvas> 
      </Grid> 
     </Border> 

     <Grid.Triggers> 
      <EventTrigger RoutedEvent="Button.Click" SourceName="AddButton2"> 
       <BeginStoryboard Name="MyBeginStoryboard"> 
        <Storyboard TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" local1:StoryboardHelper.CompletedCommand="{Binding Path=OpenPanelCommand}"> 
         <DoubleAnimation 
          Storyboard.TargetName="panelControl" 
          Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" 
          Duration="0:0:005" From="0" To="-700" /> 

        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
     </Grid.Triggers> 

Before animation

After animation, before I added new rows

After animation, with added rows 0 and 1

Answer 1

Ihre "Panel" (die Grenze genannt panelControl) ist ein Kind des Grid für die Sie neue Zeilen erstellen.

Wenn Sie ein Kind eines Grid nicht sagen, in welcher Zeile ist, die Standardzeile das Kind in sein wird, ist die erste Zeile (Index 0). Das Gleiche gilt, wenn wir über eine Grid-Spalte sprechen. In Ihrem Fall ist Ihre erste Zeile die mit der Höhe 40. Der Rand des untergeordneten Steuerelements wird relativ zu dieser Zelle sein (Spalte 0, Zeile 0)

Wenn Sie möchten, dass Ihr Kind den gesamten verfügbaren Speicherplatz belegt, stellen Sie einfach die seine RowSpan, etwa so:

<Border x:Name="panelControl" Grid.RowSpan="4" Margin="0,0,-450,0" VerticalAlignment="Stretch" HorizontalAlignment="Right" RenderTransformOrigin="0.5,0.5" Width="450" Height="275" DataContext="{Binding CurrentPanelViewModel}" > 

Alternativ könnten Sie beide nur Ihre Grid und Ihre Grenze mit 1 Zeile und Spalte 1 in einem anderen Grid setzen. Auf diese Weise sind sowohl Ihr ursprüngliches Gitter als auch Ihr Rand namens "panelControl" übereinander angeordnet.

<Grid> //This is your new Grid 
    <Grid> //This is your original grid 
    .... 
    </Grid> 
    <Border x:Name="panelControl" .../> //This is your Border 
</Grid>