×
Namespaces

Variants
Actions

Windows Phone监测TextBlock大文本滚动位置

From Nokia Developer Wiki
Jump to: navigation, search
WP Metro Icon UI.png
SignpostIcon XAML 40.png
SignpostIcon WP7 70px.png
Article Metadata

代码示例
兼容于
文章
Hazel Xie 在 08 Nov 2012 创建
最后由 hamishwillee 在 18 Jul 2013 编辑

本文介绍了怎样在Windows Phone中监测大文本的滚动位置。

介绍

使用TexBlock展示文本内容时,有时候需要知道上次阅读到哪里了或者想要知道滚动条是否滚动了,但是Windows Phone中没有现成的事件可以监听滚动条位置的变化,不过可以找到VerticalScrollBar和HorizontalScrollBar通过它们来监听。添加一个Loaded事件,利用VisualTreeHelper找到横轴和纵轴的ScrollBar。

            ScrollBar vBar = ((FrameworkElement)VisualTreeHelper.GetChild(myScrollViewer, 0)).FindName("VerticalScrollBar") as ScrollBar;
ScrollBar hBar = ((FrameworkElement)VisualTreeHelper.GetChild(myScrollViewer, 0)).FindName("HorizontalScrollBar") as ScrollBar;

但是出现了一个问题,当我们用TextBlock展示一个大文本时,文本的一部分被截断了,显示的是空白空间。这是由于TextBlock有一个上限。例如我们将TextBlock放到ScrollViewer中,如下面的代码所示。

<ScrollViewer x:Name="myScrollViewer" >
<TextBlock TextWrapping="Wrap"
Text="In this unit you will understand real world examples of connecting to and consuming information stored
in SharePoint with custom applications that you write with Visual Studio on
Windows Phone 7. With the introduction of Windows Phone 7, .Net developers have
the tools and resources available to create, test, deploy and sell stunning applications
using the same familiar tools that you have been using for years. You don't need to
learn a new language, you just need to learn how the platform works and start building
applications in Silverlight or XNA Framework. We have a lot to teach you in this course,
you will start by building the familiar 'Hello World' application and then dive into
connecting to SharePoint and building applications that can improve your business.
You will begin by creating a simple Windows Phone Silverlight application and deploy
it to the Windows Phone Emulator. You will use controls to add interactions with
buttons and text. The lab will also walk through basic Silverlight development
concepts required to use XAML, the Silverlight user interface definition language,
using Microsoft Expression Blend to apply Windows Phone style resources and behaviors.
篇幅原因省略一部分文本
This is the end!" />

</ScrollViewer>

当我们将滚动条滚动到最后,我们发现文本的一部分被截断了,文本的最后“This is the end ! ”没有显示出来。如图:

  • 1.JPG

这里 有一篇博客详细地说明了这个问题。解决办法是自定义一个控件,首先测量文本的长度,如果它大于TextBlock展示文本的上限就给它放到一个单独的块中。只要还有文本没显示完全就创建一个新的TextBlock来放超出范围的文本,创建后添加到StackPanel中。下面是代码片断。

//给文本分段,放到多个textblock中
private void ParseLine(string line)
{
int lineCount = 0;
int maxLineCount = GetMaxLineCount();
string tempLine = line;
StringBuilder sbLine = new StringBuilder();
 
while (lineCount < maxLineCount)
{
int charactersFitted = MeasureString(tempLine, (int)this.Width);
string leftSide = tempLine.Substring(0, charactersFitted);
sbLine.Append(leftSide);
tempLine = tempLine.Substring(charactersFitted, tempLine.Length - (charactersFitted));
lineCount++;
}
 
TextBlock textBlock = this.GetTextBlock();
textBlock.Text = sbLine.ToString();
this.stackPanel.Children.Add(textBlock);
 
if (tempLine.Length > 0)
{
ParseLine(tempLine);
}
}

下面的问题是,我们如何获取到定义在generic.xaml中Style里所定义的ScrollViewer。这里我们可以在自定义的控件类中将ScrollViewer控件暴露出来。

  public class CustomTextblock : Control
{
private StackPanel stackPanel;
public ScrollViewer scrollViewer;
//省略代码
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
this.stackPanel = this.GetTemplateChild("StackPanel") as StackPanel;
//暴露ScrollViewer
 
this.scrollViewer = this.GetTemplateChild("scrollViewer") as ScrollViewer;
this.ParseText(this.Text);
}
}

说到这我们就已经实现了检测大文本的ScrollViewer的滚动位置。

实现过程总结及项目调试

首先自定义一个控件,本文引用了上面所提到的博客中自定义控件的例子,记得创建一个generic.xaml文件放在所创建的Themes文件夹下,该文件包含了自定义控件的Style。 定义完控件后,生成项目,将Toolbox中生成的自定义控件拖拽到程序主界面上,然后加一个Button来监测有没有滚动到最底部。生成代码:

 <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,58">
<my:CustomTextblock HorizontalAlignment="Left" Margin="44,44,0,0" x:Name="CustomTextblock1" VerticalAlignment="Top" Height="494" Width="360" />
</Grid>
<Button Content="到底了" Height="72" HorizontalAlignment="Left" Visibility="Collapsed" Margin="114,535,0,0" Name="button1" VerticalAlignment="Top" Width="246" Grid.Row="1" Click="button1_Click" IsEnabled="True" />

在MainPage.xaml 中,添加Loaded事件,在该事件中监测ScrollViewer的位置。

public MainPage()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
 
string text = @"In this unit you will understand real world examples of connecting to and consuming information stored in SharePoint with custom applications that you write with Visual Studio on Windows Phone 7. With the introduction of Windows Phone 7, .Net developers have the tools and resources available to create, test, deploy and sell stunning applications using the same familiar tools that you have been using for years. 省略..." + "\r\n";
text += " In this unit you will understand real world examples of connecting to and consuming information stored in SharePoint with custom applications that you write with Visual Studio on Windows Phone 7. With the introduction of Windows Phone 7, .Net developers have the tools and resources available to create, test, deploy and sell stunning applications using the same familiar tools that you have been using for years.省略...";
text += @"In this unit you will understand real world examples of connecting to and consuming information stored in SharePoint with custom applications that you write with Visual Studio on Windows Phone 7. With the introduction of Windows Phone 7, .Net developers have the tools and resources available to create, test, deploy and sell stunning applications using the same familiar tools that you have been using for years. 省略...";
text += " This is the end!";
CustomTextblock1.Text = text;
}
 
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
ScrollBar vBar = ((FrameworkElement)VisualTreeHelper.GetChild(CustomTextblock1.scrollViewer, 0)).FindName("VerticalScrollBar") as ScrollBar;
ScrollBar hBar = ((FrameworkElement)VisualTreeHelper.GetChild(CustomTextblock1.scrollViewer, 0)).FindName("HorizontalScrollBar") as ScrollBar;
vBar.ValueChanged += (s, ev) =>
{
System.Diagnostics.Debug.WriteLine("vBar滚动到:" + ev.NewValue);
if (ev.NewValue == 7409)
{
button1.Visibility = Visibility.Visible;
}
else
{
button1.Visibility = Visibility.Collapsed;
}
};
hBar.ValueChanged += (s, ev) =>
System.Diagnostics.Debug.WriteLine("hBar滚动到:" + ev.NewValue);
CustomTextblock1.UpdateLayout();
}

截图:

  • 2.JPG
  • 3.JPG
  • 4.JPG

下载

源代码:* File:DetectScrollViewerPosiChanged.zip

This page was last modified on 18 July 2013, at 06:39.
82 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×