.NET MAUI中IDrawable数据绑定失效，刷新后Data仍为null

1. 确保GraphDrawable正确定义可绑定属性 #

作为继承BindableObject的IDrawable实现类，必须严格按照MAUI可绑定属性规范定义Data属性，否则绑定无法生效。以下是正确实现：

public class GraphDrawable : BindableObject, IDrawable
{
    // 静态注册可绑定属性，名称与CLR属性一致
    public static readonly BindableProperty DataProperty =
        BindableProperty.Create(
            nameof(Data),
            typeof(float[]),
            typeof(GraphDrawable),
            defaultValue: null,
            propertyChanged: OnDataChanged);

    // CLR属性必须调用GetValue/SetValue，不能自行存储字段
    public float[] Data
    {
        get => (float[])GetValue(DataProperty);
        set => SetValue(DataProperty, value);
    }

    // 属性变更回调：数据更新时可触发重绘逻辑
    private static void OnDataChanged(BindableObject bindable, object oldValue, object newValue)
    {
        // 若持有GraphicsView引用，可直接调用Invalidate，或由外部触发
    }

    public void Draw(ICanvas canvas, RectF dirtyRect)
    {
        if (Data == null || Data.Length == 0)
        {
            canvas.DrawString("无数据", dirtyRect, HorizontalAlignment.Center, VerticalAlignment.Center);
            return;
        }

        // 折线图绘制逻辑示例
        canvas.StrokeColor = Colors.DodgerBlue;
        canvas.StrokeSize = 2;
        var stepX = dirtyRect.Width / (Data.Length - 1);
        for (int i = 0; i < Data.Length - 1; i++)
        {
            var startX = dirtyRect.Left + stepX * i;
            var startY = dirtyRect.Bottom - (Data[i] / 100 * dirtyRect.Height);
            var endX = dirtyRect.Left + stepX * (i + 1);
            var endY = dirtyRect.Bottom - (Data[i + 1] / 100 * dirtyRect.Height);
            canvas.DrawLine(startX, startY, endX, endY);
        }
    }
}

2. ViewModel中正确定义可观察属性 #

使用CommunityToolkit.Mvvm的[ObservableProperty]标记属性，确保数据更新时自动触发PropertyChanged通知：

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;

public partial class MainViewModel : ObservableObject
{
    // 自动生成DataHolder属性及变更通知
    [ObservableProperty]
    private float[] _dataHolder;

    [RelayCommand]
    private void Refresh()
    {
        // 生成随机测试数据
        Random random = new Random();
        DataHolder = Enumerable.Range(0, 20).Select(_ => (float)random.Next(0, 100)).ToArray();
    }

    // 初始化时生成默认数据
    public MainViewModel()
    {
        Refresh();
    }
}

3. XAML中配置正确的绑定关系 #

确保GraphicsView的Drawable实例正确绑定到ViewModel的DataHolder，同时绑定上下文设置无误：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:YourAppNamespace"
             x:Class="YourAppNamespace.MainPage"
             BindingContext="{local:MainViewModel}">

    <VerticalStackLayout Padding="20">
        <Button Text="刷新数据" Command="{Binding RefreshCommand}" Margin="0,0,0,10"/>
        
        <GraphicsView HeightRequest="300">
            <GraphicsView.Drawable>
                <local:GraphDrawable Data="{Binding DataHolder}" />
            </GraphicsView.Drawable>
        </GraphicsView>
    </VerticalStackLayout>
</ContentPage>

4. 确保重绘触发逻辑正确 #

数据更新后，可通过两种方式触发重绘：

方式1：在GraphDrawable属性变更回调中触发（推荐） #

修改OnDataChanged方法，让Drawable自行处理重绘：

private static void OnDataChanged(BindableObject bindable, object oldValue, object newValue)
{
    if (bindable is GraphDrawable drawable && drawable.GraphView != null)
    {
        drawable.GraphView.Invalidate();
    }
}

// 在GraphDrawable中添加GraphicsView引用属性
public GraphicsView GraphView { get; set; }

然后在XAML中绑定引用：

<GraphicsView x:Name="GraphView" HeightRequest="300">
    <GraphicsView.Drawable>
        <local:GraphDrawable Data="{Binding DataHolder}" GraphView="{x:Reference GraphView}" />
    </GraphicsView.Drawable>
</GraphicsView>

方式2：在Refresh命令中直接调用Invalidate #

若页面中给GraphicsView命名，可在ViewModel中引用并触发：

[RelayCommand]
private void Refresh()
{
    // 生成数据逻辑...
    App.Current.MainPage.FindByName<GraphicsView>("GraphView")?.Invalidate();
}

常见错误排查 #

• 可绑定属性名称拼写错误：确保BindableProperty.Create的第一个参数与CLR属性名一致。
• ViewModel属性未触发通知：必须使用[ObservableProperty]或手动实现INotifyPropertyChanged，否则绑定无法感知数据变化。
• 绑定上下文错误：确认页面BindingContext已设为ViewModel实例，或通过RelativeSource指定GraphDrawable的绑定上下文。
• 启动时数据为空：确保ViewModel构造函数中调用Refresh()生成初始数据。

内容的提问来源于stack exchange，提问作者aardvark2012