ScrollView 在动态创建的元素内不起作用答案

【问题标题】：ScrollView does not work inside a dynamically created elementScrollView 在动态创建的元素内不起作用
【发布时间】：2017-01-21 19:33:37
【问题描述】：

我需要动态地创建一些 FrameworkElements。我有一个 StackPanel，我在其中创建了一个 Pivot，一个 PivotItem，一个带有 StackPanel 和按钮的 ScrollViewer，如下所示：

Pivot pivot = new Pivot();
PivotItem pivotItem = new PivotItem();

pivot.Items.Add(pivotItem);

ScrollViewer scrollViewer = new ScrollViewer();
StackPanel stackContent = new StackPanel();

scrollViewer.Content = stackContent;

pivotItem.Content = scrollViewer;

stackContent.Children.Add(new Button() { Content = "button 1" });
stackContent.Children.Add(new Button() { Content = "button 2" });
stackContent.Children.Add(new Button() { Content = "button 3" });
stackContent.Children.Add(new Button() { Content = "button 4" });
stackContent.Children.Add(new Button() { Content = "button 5" });
stackContent.Children.Add(new Button() { Content = "button 6" });
stackContent.Children.Add(new Button() { Content = "button 7" });
stackContent.Children.Add(new Button() { Content = "button 8" });
stackContent.Children.Add(new Button() { Content = "button 9" });
stackContent.Children.Add(new Button() { Content = "button 10" });
stackContent.Children.Add(new Button() { Content = "button 11" });

stkPanel.Children.Add(pivot);

这是 C# XAML 代码：

<StackPanel x:Name="stkPanel">
</StackPanel>

如果我尝试在 XAML 中创建所有元素，ScrollViewer 会按预期工作，但我需要在页面中发生某些事件时动态创建它们。

在调试中检查页面，PivotItem 有“ActualHeight == 0”，所以我想它里面的 ScrollViewer 因为这个原因不起作用，但我不知道如何修复它，也许对 ScrollViewer 有某种说法“给自己充电”以使卷轴正常工作。

【问题讨论】：

在 XAML 中创建所有内容时可以添加工作代码吗？但基本上 StackPanel 会使用所需的空间，所以如果我没记错的话，StackPanel 中的 ScrollViewer 永远不会工作......
这就是问题所在，该死的 StackPanel ...如果我通过 Grid 更改它，一切正常！

标签： c# uwp win-universal-app windows-10-universal frameworkelement

【解决方案1】：

问题在于 StackPanel。正如 Schumi1331 所说，堆栈面板根据需要使用尽可能多的空间，儿子从来没有定义宽度或高度，并且 scrollViewer 无法按预期工作。如果我按网格更改，则可以正常工作。

另一种解决方案是，在插入 dinnamics 元素后，计算该元素使用了多少空间，并将高度设置为 StackPanel。

【讨论】：

将 Pivot 放入 StackPanel 而不是 Grid 有什么好处？
在我的例子中，元素是根据 webService 的响应动态创建的，并且有许多类型，如枢轴、文本框等。所以我需要一个容器（Stackpanel 或 Grid 或任何其他容器）来放置元素一个在另一个之下，因此将它们放入 Stackpanel 比 Grid 更容易（您需要在其中设置每个元素的行号）。无论如何，我已经重新编码了使用网格的函数，并且工作正常！
我明白了。也许下次可以选择使用 RelativePanel 和以下属性？

【解决方案2】：

您需要将 IsVerticalScrollEnabled 设置为 true，为您的元素提供 MaxHeight 但更好的解决方案是 ListView 或 GridView 为它们提供 Max Height 属性，之后您希望滚动条出现。

    <StackPanel x:Name="stkPanel" isVerticalScrollEnabled = "true" MaxHeight="300"> 
</StackPanel>

【讨论】：

【解决方案3】：

Pivot pivot = new Pivot();
        PivotItem pivotItem = new PivotItem();

        pivot.Items.Add(pivotItem);

        ScrollViewer scrollViewer = new ScrollViewer();
        StackPanel stackContent = new StackPanel();

        scrollViewer.Content = stackContent;
        Window.Current.Activate();
        var bounds = ApplicationView.GetForCurrentView().VisibleBounds;
        scrollViewer.Height = bounds.Height;
        pivotItem.Content = scrollViewer;

        stackContent.Children.Add(new Button() { Content = "button 1" });
        stackContent.Children.Add(new Button() { Content = "button 2" });
        stackContent.Children.Add(new Button() { Content = "button 3" });
        stackContent.Children.Add(new Button() { Content = "button 4" });
        stackContent.Children.Add(new Button() { Content = "button 5" });
        stackContent.Children.Add(new Button() { Content = "button 6" });
        stackContent.Children.Add(new Button() { Content = "button 7" });
        stackContent.Children.Add(new Button() { Content = "button 8" });
        stackContent.Children.Add(new Button() { Content = "button 9" });
        stackContent.Children.Add(new Button() { Content = "button 10" });
        stackContent.Children.Add(new Button() { Content = "button 11" });

        stkPanel.Children.Add(pivot);

【讨论】：

您测试过这个解决方案吗？我做了，但似乎不起作用:(正如我在之前的评论中所说，它似乎与堆栈面板有关