WrapPanel 将项目布置在一条长水平线（显示滚动条）中，而不是换行

发布于 2024-12-12 21:01:40 字数 1043 浏览 0 评论 0原文

<Grid.ColumnDefinitions>
  <ColumnDefinition Width="Auto"/>
  <ColumnDefinition />
</Grid.ColumnDefinitions>

<Grid.RowDefinitions>
  <RowDefinition Height="Auto"/>
  <RowDefinition/>
  <RowDefinition Height="40"/>
</Grid.RowDefinitions>

<c:SearchTextBox Grid.ColumnSpan="2" .../>

<ScrollViewer VerticalScrollBarVisibility="Auto" Grid.Row="1">
  <ListBox 
    ItemsSource="{Binding Categories}" 
    IsSynchronizedWithCurrentItem="True" 
    ... />
</ScrollViewer>

<!-- Here is what I'm talking about:-->
<ListBox ItemsSource="{Binding Products}"
  IsSynchronizedWithCurrentItem="True" Grid.Column="1" Grid.Row="1">
  <ListBox.ItemsPanel>
    <ItemsPanelTemplate>
      <WrapPanel />
    </ItemsPanelTemplate>
  </ListBox.ItemsPanel>
</ListBox>

我想要的是右列中的项目应该布局以填充窗口宽度，然后创建一个新行，这正是 WrapPanel 的用途。
问题是，WrapPanel 仅将项目布置在一行中，并在下方显示水平滚动条，而所有项目都“隐藏”在超出窗口大小的右侧。

我怎样才能防止这种情况发生？

原文

<Grid.ColumnDefinitions>
  <ColumnDefinition Width="Auto"/>
  <ColumnDefinition />
</Grid.ColumnDefinitions>

<Grid.RowDefinitions>
  <RowDefinition Height="Auto"/>
  <RowDefinition/>
  <RowDefinition Height="40"/>
</Grid.RowDefinitions>

<c:SearchTextBox Grid.ColumnSpan="2" .../>

<ScrollViewer VerticalScrollBarVisibility="Auto" Grid.Row="1">
  <ListBox 
    ItemsSource="{Binding Categories}" 
    IsSynchronizedWithCurrentItem="True" 
    ... />
</ScrollViewer>

<!-- Here is what I'm talking about:-->
<ListBox ItemsSource="{Binding Products}"
  IsSynchronizedWithCurrentItem="True" Grid.Column="1" Grid.Row="1">
  <ListBox.ItemsPanel>
    <ItemsPanelTemplate>
      <WrapPanel />
    </ItemsPanelTemplate>
  </ListBox.ItemsPanel>
</ListBox>

What I want is that the items in the right column should be laid out to fill window width, and then create a new line, that's exactly what WrapPanel is made for.
The problem is, that the WrapPanel lays out the items in just one line showing an horizontal scroll bar beneath whereas all the items are 'hidden' in the right side exceeding the window's size.

How can I prevent that?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

枫以 2024-12-19 21:01:41

您需要禁用第二个列表框的水平滚动条。

<ListBox ItemsSource="{Binding}" 
         ScrollViewer.HorizontalScrollBarVisibility="Disabled" ...>
....
</ListBox>

编辑

另外，您有理由将 ScrollViewer 用于第一个 ListBox 吗？为什么我问这个问题是因为ListBox内部已经有ScrollViewer，默认的Visibility是Auto。

You need to make the horizontal scrollbar of the second ListBox disable.

<ListBox ItemsSource="{Binding}" 
         ScrollViewer.HorizontalScrollBarVisibility="Disabled" ...>
....
</ListBox>

EDIT

Addtionally, there is reason that you use ScrollViewer for the first ListBox? Why I ask is that ListBox already has ScrollViewer internally, of which default Visibility is Auto.

回复收藏 0 原文

~没有更多了~