다른 스택 패널의 스택 패널 너비를 만드는 방법은 무엇입니까?
-
13-09-2019 - |
문제
나는 각각 왼쪽 스택 패널이있는 두 개의 도크 패널이 있습니다.
의 너비 맨 아래 StackPanel은 폭의 너비에 의해 결정됩니다 텍스트 그 안에 있습니다.
의 너비 맨 위 StackPanel은 같은 너비로 맨 아래 스택 패널.
elementName을 통해 상단 스택 패널의 너비를 하단 스택 패널의 너비에 바인딩하려고했지만 작동하지 않습니다.
상단 너비를 하단 너비와 동일하게 만드는 방법은 무엇입니까?
<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>
해결책
LeftMenuWrapper의 실제 전체에 바인딩하십시오.
<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>
이 작업을 수행하는 또 다른 방법으로 아스날에 추가하기 위해. 그리드의 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>
다른 팁
당신은 이것을 사용하여 할 수 있습니다 Grid
s와 함께 SharedSizeGroup
대신에 DockPanel
에스. 즉
<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"
공유 부모에게 Grid
S ( StackPanel
포함 Grid
이 예에서 s)
제휴하지 않습니다 StackOverflow