如何在WindowsPhone8.1上实现大的可滚动文本视图

本文关键字:滚动 文本 视图 实现 WindowsPhone8 | 更新日期: 2023-09-27 18:28:47

我实现了一个用于大字符串的可滚动文本视图,但它不滚动。

这是XAML:

<UserControl  x:Class="WP81.Controls.LongTextControl"
    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"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="480" d:DesignWidth="480">
    <Grid x:Name="LayoutRoot" Background="{StaticResource PhoneBackgroundBrush}">
        <ScrollViewer VerticalScrollBarVisibility="Visible" >
            <StackPanel x:Name="sp" Orientation="Vertical">
            </StackPanel>
        </ScrollViewer>
    </Grid>
</UserControl>

下面是代码:

public partial class LongTextControl : UserControl
{
    public string Text
    {
        get { return (string)GetValue(TextProperty); }
        set { SetValue(TextProperty, value); }
    }
    public static readonly DependencyProperty TextProperty =
        DependencyProperty.Register("Text", typeof(string), typeof(LongTextControl), new PropertyMetadata(null, PropertyChangedCallback));
    private static void PropertyChangedCallback(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs dependencyPropertyChangedEventArgs)
    {
        var d = dependencyObject as LongTextControl;
        d.OnTextChanged((string) dependencyPropertyChangedEventArgs.OldValue, (string) dependencyPropertyChangedEventArgs.NewValue);
    }
    private void OnTextChanged(string oldValue, string newValue)
    {
        sp.Children.Clear();
        var items = ((newValue.Replace("'r", "").Split(''n')).Select(s => new TextBlock{ Text = s, TextWrapping = TextWrapping.Wrap})).ToList();
        sp.Height = 0;
        sp.ClearValue(StackPanel.HeightProperty);
        foreach (var item in items)
        {
            sp.Children.Add(item);
        }
    }
    public LongTextControl()
    {
        InitializeComponent();
    }
}

预期的行为是所有文本都可以在StackPanel中使用,可以通过ScrollViewer滚动。

实际行为是ScrollViewer给StackPanel一种"弹性"效果,但实际上并没有滚动。我已经通过调试器确认,所有的文本都已被分解,放入TextBlock控件中,并且所有的TextBlock控件都已成功添加到ScrollViewer中。由于ScrollViewer无法滚动,最后几个TextBlock控件无法进入视图。

这可能是巧合,但StackPanel的实际高度与显示器的高度非常匹配,尽管它应该更高才能容纳所有内容。

需要什么来确保StackPanel获得其内容的全部高度并正确滚动?

如何在WindowsPhone8.1上实现大的可滚动文本视图

因此有两种解决问题的方法

一种是,您可以将用户控件放置在高度为"Auto"的行中。这将自动解决滚动问题。

其他解决方法是根据文本的大小在用户控件上设置maxheight属性。虽然这不是一个优雅的解决方案,但应该有效。

这个问题的根本原因是,在您的情况下,父控件scrollviewer没有高度限制,因此它不会滚动。希望这能有所帮助!