根據大小動態顯示對象WPF

Question

我必須顯示對象的ListView。這些對象被構造爲具有兩列的網格。第一列包含元素的視圖，第二列包含一組箭頭（以垂直方式）。

我創建一個控制「箭」在類似於下列圖像的第二列，以顯示它：

我的問題是：如何可以把動態箭頭右側數第二列中，根據放在第一列的對象的高度。

要使用哪種結構來確保第二列的靈活性？ Grid，StackPanel還是別的？

請認爲箭頭的大小是固定的。

Answer 1

您真正需要做的是根據您需要填充的空間生成一個列表，每個箭頭一個項目。讓我們開始一個轉換器

public void MakeArrowListConverter : IValueConverter 
{ 
    public double ArrowHeight {get;set;} 

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
    var verticalSpace = (double) value; 
    int numberOfArrows = (int)(verticalSpace/ArrowHeight); 
    return Enumerable.Range(0, numberOfArrows); 
    } 
} 

這需要轉換sopmething我們有高度，在這種情況下，我只使用一個ContentPresenter和綁定，爲您的觀點。

<ContentPresenter x:Name="content" Content="{Binding}"/> 

那麼接下來我們只需要採取的高度，並將其轉換成你的列表

<xxx.Resources> 
    <convertors:MakeArrowListConverter x:Key="makeArrowListConverter" /> 
</xxx.Resources> 

<ListBox ItemsSource="{Binding ElementName=content, Path=ActualHeight, Converter={StaticResource makeArrowListConverter}}"> 
    <ItemTemplate> 
    <DataTemplate> 
     <!-- Image or Shape, this is your red arrow--> 
     <YourArrow/> 
    </DataTemplate> 
    </ItemTemplate> 
</ListBox> 

事實上，我們可以將這兩種元素融入另一個進入一個DataTemplate你的每項數據轉換成它在列表中使用時的顯示形式

<DataTemplate DataType="{x:Type MyView}"> 
    <!--This is your blue box--> 
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch"> 
    <ContentPresenter x:Name="content" Content="{Binding}"/> 
    <ListBox ItemsSource="{Binding ElementName=content, Path=ActualHeight, Converter={StaticResource makeArrowListConverter}}"> 
     <ItemTemplate> 
     <DataTemplate> 
      <!-- Image or Shape, this is your red arrow--> 
      <YourArrow/> 
     </DataTemplate> 
     </ItemTemplate> 
    </ListBox> 
    </StackPanel> 
</DataTemplate> 

<!-- And this is your orange box--> 
<ListBox ItemsSource="{Binding YourListOfViews}"/>