none
请问FlowDocument可否通过数据绑定来赋值? RRS feed

  • 问题

  • 问题:我做了一个ListBoxItem的模版,大致如下:

    就是左边一个头像,右边是聊天信息。头像我知道可以通过数据绑定来赋值,但是右边的FlowDocument,是一个对象,请问应该如何用数据绑定呢?

    我能够直接将一串xaml代码(例如:<Paragraph>聊天信息</Paragraph>)绑定给这个FlowDocument吗?



    da jia hao!

    2017年8月9日 9:26

答案

  • Hi,

    你可以将Run或者textBlock元素插入到Paragraph,然后将绑定Run元素的Text的属性。

      <Paragraph>
        <Run Text="{Binding MyChatText}" Background="{Binding RelativeSource= {RelativeSource TemplatedParent}, Path=Background}" />
      </Paragraph>
    你可以参考下面的UserControl的写法.
    <UserControl x:Class="wpfAppDemo.wpfControlTemplate.ChatPopup"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
                 xmlns:local="clr-namespace:wpfAppDemo.wpfControlTemplate"
                 mc:Ignorable="d" 
                 DataContext="{Binding RelativeSource={RelativeSource Self}}"
                 d:DesignHeight="100" d:DesignWidth="300">
        <UserControl.Resources>
            <ControlTemplate x:Key="LeftChatPop" TargetType="{x:Type ContentControl}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="30"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Canvas Grid.Column="0">
                        <Image Canvas.Top="1" Canvas.Left="1" Height="30" Source="http://sipi.usc.edu/database/misc/4.1.01.tiff"/>
                    </Canvas>
                    <Grid Grid.Column="1">
                        <!--border-->
                        <Border CornerRadius="5" BorderBrush="Black" BorderThickness="1" VerticalAlignment="Top"  Background="Yellow" HorizontalAlignment="Left" Margin="8.9,0,0,0" Padding="5">
                            <ContentPresenter />
                        </Border>
                        <Canvas Width="10" Height="10" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,8.5,0,0" Background="Transparent">
                            <Path Stroke="Black" StrokeThickness="0.5" Fill="Yellow">
                                <Path.Data>
                                    <PathGeometry Figures="M 10,0
                                      L 10,0,0,5
                                      L 0,5,10,10"/>
                                </Path.Data>
                            </Path>
                        </Canvas>
                    </Grid>
                </Grid>
            </ControlTemplate>
        </UserControl.Resources>
        <Grid x:Name="ChatControl">
            <ContentControl  Template="{StaticResource LeftChatPop}"  Margin="10">
                <FlowDocumentScrollViewer Name="MessageBody" ScrollViewer.VerticalScrollBarVisibility="Disabled">
                    <FlowDocument PagePadding="0" FontSize="14pt">
                        <Paragraph>
                            <Run Text="{Binding MyChatText}" Background="{Binding RelativeSource= {RelativeSource TemplatedParent}, Path=Background}" />
                        </Paragraph>
                    </FlowDocument>
                </FlowDocumentScrollViewer>
                <!--<TextBox Text="{Binding MyChatText}" Background="{Binding RelativeSource= {RelativeSource TemplatedParent}, Path=Background}" TextWrapping="Wrap" VerticalAlignment="Center" FontSize="13" HorizontalAlignment="Center"/>-->
            </ContentControl>
        </Grid>
    </UserControl>
    
    
    public partial class ChatPopup : UserControl
        {
            public string MyChatText
            {
                get { return (string)GetValue(MyChatTextProperty); }
                set { SetValue(MyChatTextProperty, value); }
            }
    
            // Using a DependencyProperty as the backing store for MyChatText.  This enables animation, styling, binding, etc...
            public static readonly DependencyProperty MyChatTextProperty =
                DependencyProperty.Register("MyChatText", typeof(string), typeof(ChatPopup), new PropertyMetadata(""));
    
            public ChatPopup()
            {
                InitializeComponent();
    
                // this.DataContext = this;
                //不能使用上面一句,因为ChatControl的DataContext从其父代继承。 这意味着我们添加到ChatControl任何绑定都将父代的DataContext作为其源。
                //正确的绑定方式如下:
                // 1.  ChatControl.DataContext = this;
                // 2.  UserControl: DataContext="{Binding RelativeSource={RelativeSource Self}}"
                // 3.  ChatControl: DataContext="{Binding ElementName=parent}"
            }
        }

    希望有帮助。

    Best Regards,

    Bob



    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.




    2017年8月10日 7:35
    版主

全部回复

  • Hi,

    你可以将Run或者textBlock元素插入到Paragraph,然后将绑定Run元素的Text的属性。

      <Paragraph>
        <Run Text="{Binding MyChatText}" Background="{Binding RelativeSource= {RelativeSource TemplatedParent}, Path=Background}" />
      </Paragraph>
    你可以参考下面的UserControl的写法.
    <UserControl x:Class="wpfAppDemo.wpfControlTemplate.ChatPopup"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
                 xmlns:local="clr-namespace:wpfAppDemo.wpfControlTemplate"
                 mc:Ignorable="d" 
                 DataContext="{Binding RelativeSource={RelativeSource Self}}"
                 d:DesignHeight="100" d:DesignWidth="300">
        <UserControl.Resources>
            <ControlTemplate x:Key="LeftChatPop" TargetType="{x:Type ContentControl}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="30"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Canvas Grid.Column="0">
                        <Image Canvas.Top="1" Canvas.Left="1" Height="30" Source="http://sipi.usc.edu/database/misc/4.1.01.tiff"/>
                    </Canvas>
                    <Grid Grid.Column="1">
                        <!--border-->
                        <Border CornerRadius="5" BorderBrush="Black" BorderThickness="1" VerticalAlignment="Top"  Background="Yellow" HorizontalAlignment="Left" Margin="8.9,0,0,0" Padding="5">
                            <ContentPresenter />
                        </Border>
                        <Canvas Width="10" Height="10" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,8.5,0,0" Background="Transparent">
                            <Path Stroke="Black" StrokeThickness="0.5" Fill="Yellow">
                                <Path.Data>
                                    <PathGeometry Figures="M 10,0
                                      L 10,0,0,5
                                      L 0,5,10,10"/>
                                </Path.Data>
                            </Path>
                        </Canvas>
                    </Grid>
                </Grid>
            </ControlTemplate>
        </UserControl.Resources>
        <Grid x:Name="ChatControl">
            <ContentControl  Template="{StaticResource LeftChatPop}"  Margin="10">
                <FlowDocumentScrollViewer Name="MessageBody" ScrollViewer.VerticalScrollBarVisibility="Disabled">
                    <FlowDocument PagePadding="0" FontSize="14pt">
                        <Paragraph>
                            <Run Text="{Binding MyChatText}" Background="{Binding RelativeSource= {RelativeSource TemplatedParent}, Path=Background}" />
                        </Paragraph>
                    </FlowDocument>
                </FlowDocumentScrollViewer>
                <!--<TextBox Text="{Binding MyChatText}" Background="{Binding RelativeSource= {RelativeSource TemplatedParent}, Path=Background}" TextWrapping="Wrap" VerticalAlignment="Center" FontSize="13" HorizontalAlignment="Center"/>-->
            </ContentControl>
        </Grid>
    </UserControl>
    
    
    public partial class ChatPopup : UserControl
        {
            public string MyChatText
            {
                get { return (string)GetValue(MyChatTextProperty); }
                set { SetValue(MyChatTextProperty, value); }
            }
    
            // Using a DependencyProperty as the backing store for MyChatText.  This enables animation, styling, binding, etc...
            public static readonly DependencyProperty MyChatTextProperty =
                DependencyProperty.Register("MyChatText", typeof(string), typeof(ChatPopup), new PropertyMetadata(""));
    
            public ChatPopup()
            {
                InitializeComponent();
    
                // this.DataContext = this;
                //不能使用上面一句,因为ChatControl的DataContext从其父代继承。 这意味着我们添加到ChatControl任何绑定都将父代的DataContext作为其源。
                //正确的绑定方式如下:
                // 1.  ChatControl.DataContext = this;
                // 2.  UserControl: DataContext="{Binding RelativeSource={RelativeSource Self}}"
                // 3.  ChatControl: DataContext="{Binding ElementName=parent}"
            }
        }

    希望有帮助。

    Best Regards,

    Bob



    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.




    2017年8月10日 7:35
    版主
  • 谢谢!有效果。

    da jia hao!

    2017年8月11日 6:29