为 WPF 中的自定义实时图表绑定标签属性

Question

我正在通过为 SeriesCollection、轴标签、x 轴和 y 轴的标题创建依赖项属性来创建自定义 LiveChart 控件。在我的主项目中使用该控件时，绑定适用于除 Axis 标签 (xLables) 之外的所有属性。下面是 liveChart 自定义控件的代码。感谢您的帮助。

XAML代码

UserControl x:Class="SalesDashboard.Controls.LiveChartUserControl"
             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:SalesDashboard.Controls"
             xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <Grid DataContext="{Binding RelativeSource={RelativeSource AncestorType={x:Type local:LiveChartUserControl}}}">
        
        <lvc:CartesianChart  Series="{Binding cSeries}"  LegendLocation="Bottom">
            <lvc:CartesianChart.AxisX>
                <lvc:Axis Title="{Binding xTitle}" Labels="{Binding xLabels}"  FontSize="15">
                    <lvc:Axis.Separator>
                        <lvc:Separator Stroke="Transparent"/>
                    </lvc:Axis.Separator>

                </lvc:Axis>

            </lvc:CartesianChart.AxisX>

            <lvc:CartesianChart.AxisY>
                <lvc:Axis Title="{Binding yTitle}" LabelFormatter="{Binding Formatter}" FontSize="15">
                    <lvc:Axis.Separator>
                        <lvc:Separator Stroke="Transparent"/>
                    </lvc:Axis.Separator>
                </lvc:Axis>
            </lvc:CartesianChart.AxisY>

        </lvc:CartesianChart>
    </Grid>
</UserControl>

背后的代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using LiveCharts;
using LiveCharts.Wpf;

namespace SalesDashboard.Controls
{
    /// <summary>
    /// Interaction logic for LiveChartUserControl.xaml
    /// </summary>
    public partial class LiveChartUserControl : UserControl
    {

        public Func<double, string> Formatter { get; set; }

        public SeriesCollection cSeries
        {
            get { return (SeriesCollection)GetValue(SeriesProperty); }
            set { SetValue(SeriesProperty, value); }
        }

        public string[] xLables
        {
            get { return (string[])GetValue(xLabelsProperty); }
            set { SetValue(xLabelsProperty, value); }
        }
       
        public string xTitle
        {
            get { return GetValue(xTitleProperty).ToString(); }
            set { SetValue(xTitleProperty, value); }
        }
       
        public string yTitle
        {
            get { return GetValue(yTitleProperty).ToString(); }
            set { SetValue(yTitleProperty, value ); }
        }

           public static readonly DependencyProperty SeriesProperty =
           DependencyProperty.Register(nameof(cSeries), typeof(SeriesCollection), typeof(LiveChartUserControl));
       
            public static readonly DependencyProperty xLabelsProperty =
            DependencyProperty.Register("xLables", typeof(string[]), typeof(LiveChartUserControl), 
            new PropertyMetadata
            (null));

            public static readonly DependencyProperty xTitleProperty =
            DependencyProperty.Register(nameof(xTitle), typeof(string), typeof(LiveChartUserControl));

            public static readonly DependencyProperty yTitleProperty =
            DependencyProperty.Register(nameof(yTitle), typeof(string), typeof(LiveChartUserControl));


        public LiveChartUserControl()
        {
            InitializeComponent();
            Formatter = value => value.ToString("N"); 

        }
    }
}

实施

 <controls:LiveChartUserControl x:Name="Livchart1" Grid.Row="1" Grid.Column="0" cSeries="{Binding SeriesCollection}" xLables="{Binding Labels}"  xTitle="{Binding xAxixTitle}" yTitle="{Binding yAxixTitle}"/>

Answer 1

这是因为打字错误。您已将依赖项属性注册为 xLables 但在绑定中您使用的是 xLabels

public static readonly DependencyProperty xLabelsProperty =
        DependencyProperty.Register("xLables", typeof(string[]), typeof(LiveChartUserControl), 
        new PropertyMetadata
        (null));

Labels="{Binding xLabels}"

将 xLables 重命名为 xLabels 应该可以解决问题。

为 WPF 中的自定义实时图表绑定标签属性

Binding the labels property for custom livechart in WPF

wpf

xaml

binding

为 WPF 中的自定义实时图表绑定标签 属性

Binding the labels property for custom livechart in WPF

wpf

xaml

binding

为 WPF 中的自定义实时图表绑定标签属性