自定义控件绑定不更新模型

【问题标题】：Custom control binding doesn't update the model自定义控件绑定不更新模型
【发布时间】：2023-03-31 15:40:01
【问题描述】：

我正在使用自定义WindowsFormsHost 控件将FastColoredTextbox winforms 控件包装在一个选项卡控件中，当用户通过DataTemplate 点击新文档按钮时，该控件的选项卡会动态创建。

由于此SO question 中解释的选项卡控件的限制，我的撤消/重做逻辑保留了每个选项卡的所有选项卡的历史记录，这导致显示错误的文本。

所以我决定修改 FastColoredTextbox 控件以公开历史记录和重做堆栈，并将它们作为依赖属性添加到我的自定义 WindowsFormsHost 包装控件中，该属性以两种方式绑定到我的 DocumentModel。

XAML：

<TabControl TabStripPlacement="Top" Margin="5" ItemsSource="{Binding Documents}" SelectedItem="{Binding CurrentDocument, Mode=TwoWay}" x:Name="TabDocuments">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="10" MaxWidth="10" MinWidth="10"/>
                    <ColumnDefinition Width="10" MaxWidth="10" MinWidth="10"/>
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0" Text="{Binding Metadata.FileName}"/>
                <TextBlock Grid.Column="1" Text="*" Visibility="{Binding IsSaved, Converter={StaticResource VisibilityConverter}}"/>
                <Button Grid.Column="2" Width="10" Height="10" MaxWidth="10" MaxHeight="10" MinWidth="10" MinHeight="10" VerticalAlignment="Center" HorizontalAlignment="Right" Command="{Binding CloseDocumentButtonCommand}">
                    <TextBlock Text="X" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="8" FontWeight="Bold"/>
                </Button>
            </Grid>
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate x:Name="TabDocumentsDataTemplate">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Border BorderBrush="Black" BorderThickness="1" Grid.Column="0" Margin="5">
                    <customControls:CodeTextboxHost Text="{Binding Markdown, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" History="{Binding History, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" RedoStack="{Binding RedoStack, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" WordWrap="True" x:Name="CodeTextboxHost"/>
                </Border>
                <Border BorderBrush="Black" BorderThickness="1" Grid.Column="1" Margin="5">
                    <wpf:ChromiumWebBrowser Address="{Binding Html, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" x:Name="ChromiumWebBrowser"/>    
                </Border>
            </Grid>
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

模型的相关部分：

public ObservableCollection<UndoableCommand> History
{
    get { return _history; }
    set
    {
        _history = value;
        OnPropertyChanged();
    }
}

public ObservableCollection<UndoableCommand> RedoStack
{
    get { return _redoStack; }
    set
    {
        _redoStack = value;
        OnPropertyChanged();
    }
}

自定义控件代码的相关部分：

public static readonly DependencyProperty TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(CodeTextboxHost), new PropertyMetadata("", new PropertyChangedCallback(
(d, e) =>
{
    var textBoxHost = d as CodeTextboxHost;
    if (textBoxHost != null && textBoxHost._innerTextbox != null)
    {
        textBoxHost._innerTextbox.Text = textBoxHost.GetValue(e.Property) as string;
    }
}), null));

public static readonly DependencyProperty HistoryProperty = DependencyProperty.Register("History", typeof(LimitedStack<UndoableCommand>), typeof(CodeTextboxHost), new PropertyMetadata(new LimitedStack<UndoableCommand>(200), new PropertyChangedCallback(
    (d, e) =>
    {
        var textBoxHost = d as CodeTextboxHost;
        if (textBoxHost != null && textBoxHost._innerTextbox != null)
        {
            var history = textBoxHost.GetValue(e.Property) as LimitedStack<UndoableCommand>;
            if (history != null)
            {
                textBoxHost._innerTextbox.TextSource.Manager.History = history;
                textBoxHost._innerTextbox.OnUndoRedoStateChanged();
            }
            else
            {
                textBoxHost._innerTextbox.ClearUndo();
            }
        }
    }), null));

public static readonly DependencyProperty RedoStackProperty = DependencyProperty.Register("RedoStack", typeof(Stack<UndoableCommand>), typeof(CodeTextboxHost), new PropertyMetadata(new Stack<UndoableCommand>(), new PropertyChangedCallback(
    (d, e) =>
    {
        var textBoxHost = d as CodeTextboxHost;
        if (textBoxHost != null && textBoxHost._innerTextbox != null)
        {
            var redoStack = textBoxHost.GetValue(e.Property) as Stack<UndoableCommand>;
            if (redoStack != null)
            {
                textBoxHost._innerTextbox.TextSource.Manager.RedoStack = redoStack;
                textBoxHost._innerTextbox.OnUndoRedoStateChanged();
            }
            else
            {
                textBoxHost._innerTextbox.ClearUndo();
            }
        }
    }), null));

public LimitedStack<UndoableCommand> History
{
    get { return (LimitedStack<UndoableCommand>) GetValue(HistoryProperty);}
    set { SetValue(HistoryProperty, value);}
}

public Stack<UndoableCommand> RedoStack
{
    get { return (Stack<UndoableCommand>) GetValue(RedoStackProperty); }
    set { SetValue(RedoStackProperty, value);}
}

public CodeTextboxHost()
{
    Child = _innerTextbox;
    _innerTextbox.Language = FastColoredTextBoxNS.Language.Custom;
    _innerTextbox.DescriptionFile = AppDomain.CurrentDomain.BaseDirectory + "SyntaxConfig\\MarkdownSyntaxHighlighting.xml";
    _innerTextbox.HighlightingRangeType = HighlightingRangeType.AllTextRange;
    _innerTextbox.TextChanged += _innerTextbox_TextChanged;
}

private void _innerTextbox_TextChanged(object sender, TextChangedEventArgs e)
{
    Text = _innerTextbox.Text;
    History = _innerTextbox.TextSource.Manager.History;
    RedoStack = _innerTextbox.TextSource.Manager.RedoStack; 
}

我的问题是当TextChanged 事件被触发时，History 或RedoStack 不会在模型上更新，而Text 会完美更新。

我尝试按照SO question 的建议添加RelativeSource，但没有奏效。

任何帮助/想法将不胜感激。谢谢。

编辑 1：

按照建议，我创建了所有集合 ObservableCollection，但它没有做任何更改，因为模型再次没有更新。

public static readonly DependencyProperty TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(CodeTextboxHost), new PropertyMetadata("", new PropertyChangedCallback(
    (d, e) =>
    {
        var textBoxHost = d as CodeTextboxHost;
        if (textBoxHost != null && textBoxHost._innerTextbox != null)
        {
            textBoxHost._innerTextbox.Text = textBoxHost.GetValue(e.Property) as string;
        }
    }), null));

public static readonly DependencyProperty HistoryProperty = DependencyProperty.Register("History", typeof(ObservableCollection<UndoableCommand>), typeof(CodeTextboxHost), new PropertyMetadata(new ObservableCollection<UndoableCommand>(), new PropertyChangedCallback(
    (d, e) =>
    {
        var textBoxHost = d as CodeTextboxHost;
        if (textBoxHost != null && textBoxHost._innerTextbox != null)
        {
            var history = textBoxHost.GetValue(e.Property) as ObservableCollection<UndoableCommand>;
            if (history != null)
            {
                textBoxHost._innerTextbox.TextSource.Manager.History = history.ToLimitedStack(200);
                textBoxHost._innerTextbox.OnUndoRedoStateChanged();
            }
            else
            {
                textBoxHost._innerTextbox.ClearUndo();
            }
        }
    }), null));

public static readonly DependencyProperty RedoStackProperty = DependencyProperty.Register("RedoStack", typeof(ObservableCollection<UndoableCommand>), typeof(CodeTextboxHost), new PropertyMetadata(new ObservableCollection<UndoableCommand>(), new PropertyChangedCallback(
    (d, e) =>
    {
        var textBoxHost = d as CodeTextboxHost;
        if (textBoxHost != null && textBoxHost._innerTextbox != null)
        {
            var redoStack = textBoxHost.GetValue(e.Property) as ObservableCollection<UndoableCommand>;
            if (redoStack != null)
            {
                textBoxHost._innerTextbox.TextSource.Manager.RedoStack = redoStack.ToStack();
                textBoxHost._innerTextbox.OnUndoRedoStateChanged();
            }
            else
            {
                textBoxHost._innerTextbox.ClearUndo();
            }
        }
    }), null));

public ObservableCollection<UndoableCommand> History
{
    get { return (ObservableCollection<UndoableCommand>) GetValue(HistoryProperty);}
    set { SetValue(HistoryProperty, value);}
}

public ObservableCollection<UndoableCommand> RedoStack
{
    get { return (ObservableCollection<UndoableCommand>) GetValue(RedoStackProperty); }
    set { SetValue(RedoStackProperty, value);}
}

public string Text
{
    get { return (string)GetValue(TextProperty); }
    set { SetValue(TextProperty, value); }
}

public bool WordWrap
{
    get { return (bool)GetValue(WordWrapProperty); }
    set { SetValue(WordWrapProperty, value); }
}

public CodeTextboxHost()
{
    Child = _innerTextbox;
    _innerTextbox.Language = FastColoredTextBoxNS.Language.Custom;
    _innerTextbox.DescriptionFile = AppDomain.CurrentDomain.BaseDirectory + "SyntaxConfig\\MarkdownSyntaxHighlighting.xml";
    _innerTextbox.HighlightingRangeType = HighlightingRangeType.AllTextRange;
    _innerTextbox.TextChanged += _innerTextbox_TextChanged;
}

private void _innerTextbox_TextChanged(object sender, TextChangedEventArgs e)
{
    Text = _innerTextbox.Text;
    History = _innerTextbox.TextSource.Manager.History.ToOveObservableCollection();
    RedoStack = _innerTextbox.TextSource.Manager.RedoStack.ToObservableCollection();
}

【问题讨论】：

  • 如果我不得不猜测，我会说问题始于您在模型中使用ObservableCollection，在依赖属性中使用Stack 和LimitedStack。当这些匹配时，我只有在绑定集合方面才有好运。我一共使用ObservableCollection。
  • 我无法找出完整的代码，但如果您想显式调用更新，有一些变通方法。在 TextBox Text Changed 上尝试 Interaction Trigger 它将调用带有参数的命令，然后您可以在 DS 中记录更改
  • @Ramankingdom 我实际上使用它，唯一的区别是文本框本身是一个winforms控件，我用WindowsFormsHost包装它。我使用内部文本框的TextChanged 事件来更新文本、历史记录和重做堆栈（可以在_innerTextbox_TextChanged 方法中看到）。但是问题只是文本更新，其余的不会更新并存储回模型中。
  • @maykanat 调用是否没有传播到堆栈更新的代码？
  • @Ramankingdom 例如，我在DocumentModel 中放置了一个断点，DocumentText 属性更新。当TextChanged 被触发时，CodeTextboxHost 的Text 属性会更新，在DocumentModel 中达到断点，DocumentText 属性实际上会在DocumentModel 中更新。但是当我对RedoStack 和 History，当 TextChanged 被触发时，Model 端没有任何反应，就好像 UI 没有通知 DocumentModel。所以绑定从模型到 UI 有效，但对于 ObservableCollections 则不然。

标签： c# wpf data-binding dependency-properties


【解决方案1】：

我可以通过修改自定义控件代码使 UI 更改模型，如下所示：

public static readonly DependencyProperty HistoryProperty = DependencyProperty.Register("History", typeof(IEnumerable<UndoableCommand>), typeof(CodeTextboxHost), new FrameworkPropertyMetadata(new ObservableCollection<UndoableCommand>(), FrameworkPropertyMetadataOptions.BindsTwoWayByDefault, new PropertyChangedCallback(
    (d, e) =>
    {
        var textBoxHost = d as CodeTextboxHost;
        if (textBoxHost != null && textBoxHost._innerTextbox != null)
        {
            var history = textBoxHost.GetValue(e.Property) as ObservableCollection<UndoableCommand>;
            if (history != null)
            {
                textBoxHost._innerTextbox.TextSource.Manager.History = history.ToLimitedStack(200);
                textBoxHost._innerTextbox.OnUndoRedoStateChanged();
            }
            else
            {
                textBoxHost._innerTextbox.ClearUndo();
            }
        }
    }), null));

public static readonly DependencyProperty RedoStackProperty = DependencyProperty.Register("RedoStack", typeof(IEnumerable<UndoableCommand>), typeof(CodeTextboxHost), new FrameworkPropertyMetadata(new ObservableCollection<UndoableCommand>(), FrameworkPropertyMetadataOptions.BindsTwoWayByDefault, new PropertyChangedCallback(
    (d, e) =>
    {
        var textBoxHost = d as CodeTextboxHost;
        if (textBoxHost != null && textBoxHost._innerTextbox != null)
        {
            var redoStack = textBoxHost.GetValue(e.Property) as ObservableCollection<UndoableCommand>;
            if (redoStack != null)
            {
                textBoxHost._innerTextbox.TextSource.Manager.RedoStack = redoStack.ToStack();
                textBoxHost._innerTextbox.OnUndoRedoStateChanged();
            }
            else
            {
                textBoxHost._innerTextbox.ClearUndo();
            }
        }
    }), null));

public ObservableCollection<UndoableCommand> History
{
    get { return (ObservableCollection<UndoableCommand>) GetValue(HistoryProperty);}
    set { SetCurrentValue(HistoryProperty, new ObservableCollection<UndoableCommand>(value));}
}

public ObservableCollection<UndoableCommand> RedoStack
{
    get { return (ObservableCollection<UndoableCommand>) GetValue(RedoStackProperty); }
    set { SetCurrentValue(RedoStackProperty, new ObservableCollection<UndoableCommand>(value));}
}

因此，我在 History 和 RedoStack 上使用了 SetCurrentValue 而不是 SetValue，以使 UI 正确更新模型。

【讨论】：

    【解决方案2】：

    使用INotifyPropertyChanged 接口并实现OnPropertyChanged 方法并将该方法放在您要更新接口的位置

    【讨论】：

    • 也许链接到更好的答案会有所帮助：stackoverflow.com/questions/7934236/…
    • 我不想更新 UI，当前的数据绑定可以从模型到 UI 正常工作。问题是，当我在可观察集合中的 UI 中进行更新时，它不会更新模型的可观察集合。
    • 在您的 xaml 模式上使用两种方式绑定。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-11-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-09-25
    • 1970-01-01
    相关资源
    最近更新 更多
    热门标签
    Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode