帶有項目寬度的列表框控制寬度

我正在構建一個WPF用戶控件，其中包含一個列表，其項目顯示爲圖標和文本。但是，文本有不同的長度，我希望它們水平滾動。相反，我希望項目具有與用戶控件相同的寬度，並且文本將被包裝（因此使用垂直滾動）。帶有項目寬度的列表框控制寬度

這是我的XAML

<UserControl x:Class="Demo.NotificationsWidget" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Border CornerRadius="2" 
      BorderThickness="1" BorderBrush="LightGray" 
      Background="White"> 
     <DockPanel LastChildFill="True"> 
     <TextBlock Text="Alerts" DockPanel.Dock="Top" Margin="5" FontSize="15"/> 

     <ListBox Name="alertsList" DockPanel.Dock="Bottom" Margin="5" 
       Grid.IsSharedSizeScope="True" 
       HorizontalContentAlignment="Stretch" 
       BorderThickness="0" 
       ItemsSource="{Binding}"> 
      <ListBox.ItemTemplate> 
       <DataTemplate> 
        <Border BorderThickness="0,1,0,0" BorderBrush="Gray" Margin="5,0,5,5"> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition SharedSizeGroup="col1" Width="40" /> 
          <ColumnDefinition SharedSizeGroup="col2" Width="*" /> 
         </Grid.ColumnDefinitions> 

         <Image Grid.Column="0" Source="{Binding Image}" Width="24" Height="24" Margin="5" /> 
         <StackPanel Grid.Column="1" Orientation="Vertical" Margin="5"> 
          <TextBlock Text="{Binding Title}" TextWrapping="Wrap" FontWeight="Bold" /> 
          <TextBlock Text="{Binding Text}" TextWrapping="Wrap" /> 
         </StackPanel> 
        </Grid> 
        </Border> 
       </DataTemplate> 
      </ListBox.ItemTemplate> 
     </ListBox> 
     </DockPanel> 
    </Border> 
</UserControl>

這裏是用含該用戶控制的窗口的圖像。請注意，控制寬度隨窗口寬度而變化。

enter image description here

我要的是比當物品的寬度將超過列表寬度，文本被包裹（我得到的名單垂直滾動）。

我已經嘗試爲列表框添加ScrollViewer.HorizontalScrollBarVisibility="Disabled"，但唯一的結果是滾動隱藏。列表項目仍具有相同的寬度（比控件的寬度更長）。

如果我還不夠清楚，只要看看twitter如何在列表中顯示推文，這就是我想要做的。謝謝。

UPDATE：這基本上是我想達到什麼：

enter image description here

我能夠明確地設置每列的寬度數據模板網格做到這一點。

<Grid.ColumnDefinitions> 
    <ColumnDefinition SharedSizeGroup="col1" Width="40" /> 
    <ColumnDefinition SharedSizeGroup="col2" Width="200" /> 
</Grid.ColumnDefinitions>

但是，當窗口調整大小時，重要的是列表和它的項目自動調整大小。

來源

2012-11-22 Marius Bancila

我能夠通過更換，以達到預期的效果Grid與DockPanel。

 <ListBox.ItemTemplate> 
      <DataTemplate> 
       <Border BorderThickness="0,1,0,0" BorderBrush="Black" Margin="0,0,0,5"> 
       <DockPanel LastChildFill="True"> 
        <Image DockPanel.Dock="Left" Source="{Binding Image}" Width="24" Height="24" Margin="0,5,0,5" 
          VerticalAlignment="Top"/> 

        <StackPanel DockPanel.Dock="Right" Orientation="Vertical" 
           Margin="5,2,0,0" 
           VerticalAlignment="Top"> 
         <TextBlock Text="{Binding Title}" TextWrapping="Wrap" FontWeight="Bold" /> 
         <TextBlock Text="{Binding Text}" TextWrapping="Wrap" FontSize="12" Margin="0,2,0,0" /> 
        </StackPanel> 
       </DockPanel> 
       </Border> 
      </DataTemplate> 
     </ListBox.ItemTemplate>

來源

2012-11-23 07:45:58

在TextBlock的嘗試：

Width="{Binding ElementName=alertsList, Path=ActualWidth}">

如果你需要採取一些關閉，然後看到我的回答這個問題

GridViewColumn Width Adjustment

來源

2012-11-22 14:48:27 Paparazzi

帶有項目寬度的列表框控制寬度

回答

相關問題