WPF - 如何优先考虑DockPanel的第二个元素

Question

如果有一个带有两个Border元素的DockPanel ，第一个是 Horizo​​ntalAlignment HorizontalAlignment="Left" ，第二个是 Horizo​​ntalAlignment HorizontalAlignment="Right" 。 整个DockPanel的宽度是固定的，但Border的宽度应根据其内容进行更改。 两个边框都有TextBlocks 。 第一个TextBlock启用了自动换行，第二个只是一个单词。 我首先希望绘制第二个Border ，它应该占用所有需要的空间，剩余空间将被第一个Border占用，它应该使用自动换行来绘制内容。 这是我的代码不起作用，因为它首先绘制第一个Border ，因此第二个边框没有填充。 你能提示如何优先考虑DockPanel的第二个（右）元素吗？

   <DockPanel>
   
        <Border Background="#FFFFFF" HorizontalAlignment="Left" CornerRadius="4 0 0 4" Height="48" MaxWidth="183">
            <ContentControl VerticalAlignment="Center">
                <ContentControl.Style>
                    <Style TargetType="ContentControl">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding Mode}" Value="trial">
                                <Setter Property="Content">
                                    <Setter.Value>
                                        <WrapPanel Orientation="Horizontal" MaxWidth="190" VerticalAlignment="Center" HorizontalAlignment="Center">

                                            <TextBlock FontSize="12" TextWrapping="Wrap" Padding="11, 0, 11, 0">

                                            <Run Text="{Binding TrialText1, Mode=OneWay}"/>                                                   

                                            </TextBlock>

                                        </WrapPanel>
                                    </Setter.Value>
                                </Setter>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </ContentControl.Style>
            </ContentControl>
        </Border>

        <Border CornerRadius="0 4 4 0" HorizontalAlignment="Right" MaxWidth="104" MinWidth="83">
            <Border.Background>
                <SolidColorBrush Color="#FFFFFF" Opacity="0.4"/>
            </Border.Background>

            <ContentControl VerticalAlignment="Center">
                <ContentControl.Style>
                    <Style TargetType="ContentControl">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding Mode}" Value="trial">
                                <Setter Property="Content">
                                    <Setter.Value>
                                        <WrapPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Center">
                                            <TextBlock Text="{Binding PlanTitleText1}" FontSize="12" HorizontalAlignment="Center" 
                                        </WrapPanel>
                                    </Setter.Value>
                                </Setter>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </ContentControl.Style>
            </ContentControl>
        </Border>

    </DockPanel>

Answer 1

您可以改用网格。 定义 2 列。 让第二个自动调整它需要多少空间，并让第一个占据所有剩余空间。

<Grid>
   <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="auto"/>
   </Grid.ColumnDefinitions>
   <Border Grid.Column="0" (...)>
      (...)
   </Border>
   <Border Grid.Column="1" (...)>
      (...)
   </Border>
</Grid>