如何使网格单元格中的滚动查看器水平和垂直工作？

Question

我有一个包含一些数据的网格，其中一个单元格包含相当长的字符串（可能有很多）。 所以为了不使用太多可用的 window 空间，我希望这些字符串可以滚动。 垂直有效，但无论我尝试什么，我都无法获得水平滚动条。

这是我的 xaml：

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"           
        Title="MainWindow" Height="150" Width="250">
    <Grid>
        <Grid.ColumnDefinitions>  
            <ColumnDefinition Width="200"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>    
            <RowDefinition Height="100"/>
        </Grid.RowDefinitions>           
        <ScrollViewer Grid.Row="0" Grid.Column="0">
            <ItemsControl  ItemsSource="{Binding Path=BoundTexts}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=Text}"/>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Vertical"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </ScrollViewer>
    </Grid>
</Window>

这是要测试的代码。

using System.Collections.Generic;
using System.Windows; 

namespace WpfApp1

{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            List<BoundClass> temp = new List<BoundClass>();
            for (int i = 0; i < 10; i++)
            {
                string t = ""; // just to create some long strings.
                for (int j = 0; j < 10; j++) // I know it can be done better.
                {
                    t += $"{j*10:D2}********";
                }               
                temp.Add(new BoundClass(t));
            }
            BoundTexts = temp.ToArray();
            DataContext = this;
        }       

        public BoundClass[] BoundTexts { get; set; }
    } 

    public class BoundClass
    {
        public string Text { get; set;}
        public BoundClass(string text)
        {
            Text = text;
        }
    }
}

我知道这里有几个类似的问题，但据我所知，它们都笼罩在模板和其他复杂的主题中。 还有一些回答是“确保你周围有一个约束容器”，我想我是按网格做的。

Answer 1

将ScrollViewer.HorizontalScrollBarVisibility和ScrollViewer.VerticalScrollBarVisibility设置为"Auto"应该可以解决问题。

VerticalScrollBarVisibility的默认值为ScrollBarVisibility.Visible但Horizo HorizontalScrollBarVisibility的默认值为ScrollBarVisibility.Disabled 。 因此，仅设置HorizontalScrollBarVisibility = "Auto"就足够了

<ScrollViewer Grid.Row="0" Grid.Column="0" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">

Answer 2

将ScrollViewer添加到ItemsControl的正确方法是将其放入ControlTemplate以包装ItemsPresenter 。 这样ScrollViewer的行为就正确了。

如果您不这样做（而是包装ItemsControl ）， ScrollViewer将尝试滚动ItemsControl而不是项目！
但是您希望ScrollViewer检测ItemsControl的项目何时溢出。 自然地， ItemsControl本身会伸展以占据可用空间——它不会溢出并且会正确显示（完全可见）。 但是这些项目确实溢出了ItemsControl的空间。 这就是包装ItemsControl不会按预期工作的原因。

此外，您必须显式启用ScrollViewer.HorizontalScrollBarVisibility 。 重要的是要知道将其设置为Auto会影响性能。 建议将其设置为Hidden或Visible 。

<ItemsControl Height="200">
  <ItemsControl.Template>
    <ControlTemplate TargetType="ItemsControl">
      <ScrollViewer CanContentScroll="True"
                    HorizontalScrollBarVisibility="Visible"
                    VerticalScrollBarVisibility="Visible">
        <ItemsPresenter />
      </ScrollViewer>
    </ControlTemplate>
  </ItemsControl.Template>

  <!-- Consider to enable virtualization by adding a VirtualizingStackPanel as host Panel.
       Important: don't forget to set ScrollViewer.CanContentScroll to 'True' -->
  <ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
      <VirtualizingStackPanel />
    </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
</ItemsControl>