3

2つのドックパネルがあり、それぞれに左側のStackPanelがあります。

下部のStackPanelの幅は、その中にあるテキストの幅によって決まります。

上部のStackPanelの幅は、下部のStackPanelの幅と同じである必要があります。

ElementNameを介して上部のStackPanelの幅を下部のStackPanelの幅にバインドしようとしましたが、これは機能しません。

上部の幅を下部の幅と同じにするにはどうすればよいですか？

代替テキスト 

<StackPanel>
    <DockPanel LastChildFill="True" Height="100" >
        <StackPanel Width="{Binding ElementName=LeftMenuText, Path=Width}" 
                    DockPanel.Dock="Left"
                    Background="Yellow">
            <TextBlock
                Text="This is some text."/>
        </StackPanel>
        <StackPanel DockPanel.Dock="Right"
                    Background="Orange">
        </StackPanel>
    </DockPanel>

    <DockPanel 
        Height="3"
        Background="Black"></DockPanel>

    <DockPanel LastChildFill="True" Height="100">
        <StackPanel Name="LeftMenuWrapper"
                    DockPanel.Dock="Left"
                    Background="Yellow">
            <TextBlock 
                    Text="This is some text that is longer."/>
        </StackPanel>
        <StackPanel DockPanel.Dock="Right"
                    Background="Blue">
        </StackPanel>
    </DockPanel>
</StackPanel>
4

2 に答える 2

8

LeftMenuWrapper の ActualWidth にバインドします。

 <StackPanel>
    <DockPanel LastChildFill="True" Height="100" >
        <StackPanel Width="{Binding ElementName=LeftMenuWrapper, Path=ActualWidth}" 
                    DockPanel.Dock="Left"
                    Background="Yellow">
            <TextBlock
                Text="This is some text."/>
        </StackPanel>
        <StackPanel DockPanel.Dock="Right"
                    Background="Orange">
        </StackPanel>
    </DockPanel>

    <DockPanel 
        Height="3"
        Background="Black"></DockPanel>

    <DockPanel LastChildFill="True" Height="100">
        <StackPanel Name="LeftMenuWrapper"
                    DockPanel.Dock="Left"
                    Background="Yellow">
            <TextBlock 
                    Text="This is some text that is longer."/>
        </StackPanel>
        <StackPanel DockPanel.Dock="Right"
                    Background="Blue">
        </StackPanel>
    </DockPanel>
</StackPanel>

これを行う別の方法を武器庫に追加するだけです。Grid の IsSharedScope プロパティを使用することもできます。

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <StackPanel Grid.IsSharedSizeScope="True">
      <Grid Height="100">
         <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="TextHolder"/>
            <ColumnDefinition Width="*"/>
         </Grid.ColumnDefinitions>
         <Border Background="Yellow">
            <TextBlock Text="This is some text."/>
         </Border>
         <Border Grid.Column="1" Background="Orange"/>
      </Grid>
      <Border Height="3" Background="Black"/>
      <Grid Height="100">
         <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="TextHolder"/>
            <ColumnDefinition Width="*"/>
         </Grid.ColumnDefinitions>
         <Border Background="Yellow">
            <TextBlock Text="This is some text that is longer."/>
         </Border>
         <Border Grid.Column="1" Background="Blue"/>
      </Grid>
   </StackPanel>
</Page>
于 2009-09-23T15:56:41.943 に答える
4

これは、s の代わりにGridaを使用して行うことができます。いえSharedSizeGroupDockPanel

<StackPanel Grid.IsSharedSizeScope="True">
    <Grid Height="100" >

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <StackPanel Grid.Column="0" Width="{Binding ElementName=LeftMenuText, Path=Width}"
                                DockPanel.Dock="Left"
                                Background="Yellow">
            <TextBlock
                    Text="This is some text."/>
        </StackPanel>
        <StackPanel Grid.Column="1" DockPanel.Dock="Right"
                                Background="Orange">
        </StackPanel>
    </Grid>

    <DockPanel
      Height="3"
      Background="Black"></DockPanel>

    <Grid Height="100">

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <StackPanel Grid.Column="0" Name="LeftMenuWrapper"
                                DockPanel.Dock="Left"
                                Background="Yellow">
            <TextBlock
                            Text="This is some text that is longer."/>
        </StackPanel>
        <StackPanel Grid.Column="1" DockPanel.Dock="Right"
                                Background="Blue">
        </StackPanel>
    </Grid>
</StackPanel>

覚えておくべき重要なことは、グリッド内の各列にSharedSizeGroup同じ名前 (この例では「A」)を付けGrid.IsSharedSizeScope="True"、s の共有親Grid(この例でStackPanelは s を含む) に追加することです。Grid

于 2009-09-23T15:52:44.373 に答える