温馨提示:本文翻译自stackoverflow.com,查看原文请点击:c# - Why the Scroll-viewer inside user UserControl in UWP is not working ....any advice?
c# user-controls uwp uwp-xaml scrollviewer

c# - 为什么UWP中的UserControl中的Scroll-viewer无法正常工作....任何建议?

发布于 2020-04-19 15:07:54

我正在使用https://docs.microsoft.com/zh-cn/uwp/api/windows.ui.xaml.controls.scrollviewer中提供的示例代码在UWP UserControl中创建滚动查看器,如下所示, UserControl不会不工作

 <UserControl
    x:Class="Controls.Custom"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:converters="using:Microsoft.Toolkit.Uwp.UI.Converters"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400"
    DataContext="{Binding ViewModel, Source={StaticResource ViewModelLoc}}">

        <Grid>
        <StackPanel Height="300" Width="300">
            <!-- A large TextBlock. -->
            <TextBlock Width="300" TextWrapping="Wrap" Margin="0,0,0,30" 
                       Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac mi ipsum. Phasellus vel malesuada mauris. Donec pharetra, enim sit amet mattis tincidunt, felis nisi semper lectus, vel porta diam nisi in augue. Pellentesque lacus tortor, aliquam et faucibus id, rhoncus ut justo. Sed id lectus odio, eget pulvinar diam. Suspendisse eleifend ornare libero, in luctus purus aliquet non. Sed interdum, sem vitae rutrum rhoncus, felis ligula ultrices sem, in eleifend eros ante id neque." />

            <!-- The same large TextBlock, wrapped in a ScrollViewer. -->
            <ScrollViewer Height="200" Width="200" 
                          HorizontalScrollBarVisibility="Auto" 
                          VerticalScrollBarVisibility="Auto">
                <TextBlock Width="300" TextWrapping="Wrap"
                           Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac mi ipsum. Phasellus vel malesuada mauris. Donec pharetra, enim sit amet mattis tincidunt, felis nisi semper lectus, vel porta diam nisi in augue. Pellentesque lacus tortor, aliquam et faucibus id, rhoncus ut justo. Sed id lectus odio, eget pulvinar diam. Suspendisse eleifend ornare libero, in luctus purus aliquet non. Sed interdum, sem vitae rutrum rhoncus, felis ligula ultrices sem, in eleifend eros ante id neque." />
            </ScrollViewer>
        </StackPanel>
    </Grid>
</UserControl>

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid>
        <StackPanel>
            <!-- A large TextBlock. -->
            <TextBlock Width="300" TextWrapping="Wrap" Margin="0,0,0,30" 
                       Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac mi ipsum. Phasellus vel malesuada mauris. Donec pharetra, enim sit amet mattis tincidunt, felis nisi semper lectus, vel porta diam nisi in augue. Pellentesque lacus tortor, aliquam et faucibus id, rhoncus ut justo. Sed id lectus odio, eget pulvinar diam. Suspendisse eleifend ornare libero, in luctus purus aliquet non. Sed interdum, sem vitae rutrum rhoncus, felis ligula ultrices sem, in eleifend eros ante id neque." />

            <!-- The same large TextBlock, wrapped in a ScrollViewer. -->
            <ScrollViewer Height="200" Width="200" 
                          HorizontalScrollBarVisibility="Auto" 
                          VerticalScrollBarVisibility="Auto">
                <TextBlock Width="300" TextWrapping="Wrap"
                           Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac mi ipsum. Phasellus vel malesuada mauris. Donec pharetra, enim sit amet mattis tincidunt, felis nisi semper lectus, vel porta diam nisi in augue. Pellentesque lacus tortor, aliquam et faucibus id, rhoncus ut justo. Sed id lectus odio, eget pulvinar diam. Suspendisse eleifend ornare libero, in luctus purus aliquet non. Sed interdum, sem vitae rutrum rhoncus, felis ligula ultrices sem, in eleifend eros ante id neque." />
            </ScrollViewer>
        </StackPanel>
    </Grid>
</Page>

作品!有什么建议如何使UserControl中的滚动查看器工作?

查看更多

提问者
EvilInside
被浏览
17
Faywang - MSFT 2020-02-05 15:42

UserControl不起作用的原因是您将StackPanel的Height设置为300,但是子内容需要超过300的高度,然后子内容被可视地裁剪。因此,您可以删除StackPanel中的高度限制,或将子内容的总高度控制为不超过300。

<UserControl ...>
    <Grid>
        <StackPanel Width="300">
            <!-- A large TextBlock. -->
            <TextBlock Width="300" TextWrapping="Wrap" Margin="0,0,0,30"
                       Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac mi ipsum. Phasellus vel malesuada mauris. Donec pharetra, enim sit amet mattis tincidunt, felis nisi semper lectus, vel porta diam nisi in augue. Pellentesque lacus tortor, aliquam et faucibus id, rhoncus ut justo. Sed id lectus odio, eget pulvinar diam. Suspendisse eleifend ornare libero, in luctus purus aliquet non. Sed interdum, sem vitae rutrum rhoncus, felis ligula ultrices sem, in eleifend eros ante id neque." />

            <!-- The same large TextBlock, wrapped in a ScrollViewer. -->
            <ScrollViewer Height="200" Width="200" 
                          HorizontalScrollBarVisibility="Auto" 
                          VerticalScrollBarVisibility="Auto">
                <TextBlock Width="300" TextWrapping="Wrap"
                           Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac mi ipsum. Phasellus vel malesuada mauris. Donec pharetra, enim sit amet mattis tincidunt, felis nisi semper lectus, vel porta diam nisi in augue. Pellentesque lacus tortor, aliquam et faucibus id, rhoncus ut justo. Sed id lectus odio, eget pulvinar diam. Suspendisse eleifend ornare libero, in luctus purus aliquet non. Sed interdum, sem vitae rutrum rhoncus, felis ligula ultrices sem, in eleifend eros ante id neque." />
            </ScrollViewer>
        </StackPanel>
    </Grid>
</UserControl>