Windows Phone应用程序中TextBox的类似笔记本的背景

时间:2014-11-12 18:02:17

标签: c# xaml windows-phone-8.1

我正在尝试创建一个应用程序来为Windows Phone 8.1记笔记 我想给用户一个笔记本类型的感觉。 为此我创建了笔记用户界面,XAML是:

<Grid Margin="0,12.333,0,-0.333">
    <Grid.Background>
        <ImageBrush ImageSource="Images/notebookpaper.jpg"/>
    </Grid.Background>
    <TextBox TextWrapping="Wrap" Background="{x:Null}" Text="" BorderBrush="{x:Null}" HorizontalAlignment="Left" Margin="60,96,0,0"  VerticalAlignment="Top" Height="480" Width="340" BorderThickness="0" GotFocus="TextBox_GotFocus" LostFocus="TextBox_LostFocus" FontFamily="Arial" TextChanged="TextBox_TextChanged" AcceptsReturn="True" FontSize="24.8"/>
    <TextBlock Text="Date : " HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="246,10,0,0" Height="20" Width="59"/>
</Grid>

图片notebookpaper.jpg看起来像这样: enter image description here

当用户在文本框中键入文本时,它看起来像: enter image description here

问题在于,有些字符会出现在线条上方,有些字符恰好在线条等上面看起来很奇怪。此外,当我尝试滚动时,UI显示为: enter image description here

文本显示为删除,因为只有文本滚动而不是背景图像。 此外,我希望能够为用户提供5-6种字体的列表,他们可以从中选择用于键入注释的字体。

我该怎么做,以便正确对齐文本并正确滚动文本。 还有其他办法吗?

1 个答案:

答案 0 :(得分:0)

看起来你有两个问题:

  1. 改变行高
  2. 滚动与行
  3. 不匹配

    要解决第一个问题,您可以使用TextBlock.TextLineBounds,在this MSDN blog postTextLineBounds enumeration documentation中讨论一下。这似乎只适用于TextBlocks,因此当用户编辑文本时,您可能必须在TextBlock和TextBox之间进行交换。

    要解决第二个问题,TextBox styles and templates page有很多有用的信息。看起来您可以通过覆盖TextBoxButtonBackgroundThemeBrush来使ImageBrush成为控件的背景。如果在聚焦时不起作用,您可能需要在链接页面上获取整个模板并对其进行编辑以将图像放在后台(有很多XAML,但您应该能够将图像放入BackgroundElement或就在它之前。)

    如果仍然无法滚动,您可以尝试设置ScrollViewer.Background;如果这不起作用,您将需要处理ScrollViewer.ViewChangingScrollViewer.ViewChanged事件(可能通过覆盖它),以便您可以通过scrollviewer移动的像素数量来转换背景图像

    您还可以使用VisualTreeHelper在代码隐藏中找到ScrollViewer(并跳过处理模板)。这将允许您设置ScrollViewer的背景和/或订阅其事件。然而,这比其他方法更脆弱,通常是最后的手段。