dotnet / maui

.NET MAUI is the .NET Multi-platform App UI, a framework for building native device applications spanning mobile, tablet, and desktop.
https://dot.net/maui
MIT License
22.19k stars 1.74k forks source link

Problem doing a data binding in GraphicView #16671

Closed vsfeedback closed 1 year ago

vsfeedback commented 1 year ago

This issue has been moved from a ticket on Developer Community.


I need to do a data binding, using BindableProperty in a GraphicView using MVVM but it does not work. I'm working NET MAUI also I'm using the Nuget CommunityToolkit.Mvvm. My drawable class is :

 public class DibujarArcoGreenwich : GraphicsView, IDrawable
 {
        public float AnguloFin
        {
            get => (float)GetValue(AnguloFinProperty);
            set => SetValue(AnguloFinProperty, value);
        }
        public static readonly BindableProperty AnguloFinProperty =
            BindableProperty.Create(nameof(AnguloFin), typeof(float), typeof(DibujarArcoGreenwich));

            public void Draw(ICanvas canvas, RectF dirtyRect)
        {
            //dibujo arco
            float finalgrados = 360 - AnguloFin;
            canvas.StrokeColor = Color.Red;
            canvas.StrokeSize = 6;
            int xposicion = XPosicionCentro - Radio;
            int yposicion = YPosicionCentro - Radio;
            canvas.DrawArc(10, 10,90,90, 0, finalgrados, true, false);
           }

}

My viewmodel is :

public partial class AriesViewModel : ObservableObject, INotifyPropertyChanged
   {
       [ObservableProperty]
       float _anguloFin;
        public AriesViewModel()
       {
           AnguloFin = 0;
       }
       [RelayCommand]
       private void CalcularAries()
       {
           AnguloFin = HacerCalculos(); // always return a value
       }
    }
My page XAML is :
    <?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:local="clr-namespace:NautorStar.MisControles"
            xmlns:viewModels="clr-namespace:NautorStar.ViewModels"
            xmlns:drawables="clr-namespace:NautorStar.ClasesDibujo"
            x:Class="NautorStar.AriesPage"
            Title="Aries">
   <ContentPage.BindingContext>
       <viewModels:AriesViewModel />
   </ContentPage.BindingContext>
    <StackLayout>
                 <GraphicsView 
                           HorizontalOptions="Center"
                           VerticalOptions="Center"
                           HeightRequest="250"
                           WidthRequest="400">
                <GraphicsView.Drawable>
                    <drawables:DibujarArcoGreenwich           
                           AnguloFin="{Binding AnguloFin, Mode=TwoWay}"/>
                  </GraphicsView.Drawable>
            </GraphicsView>
             <Button Text="Calcular"
                   Command="{Binding CalcularAriesCommand}" />
       </StackLayout>
</ContentPage>

But always AnguFin in my class DibujarArcoGreenwich is 0, the binding does not work. if I change the xaml


                    <drawables:DibujarArcoGreenwich           
                           AnguloFin="{Binding AnguloFin, Mode=TwoWay}"/>
                  </GraphicsView.Drawable>

for :


                      <drawables:DibujarArcoGreenwich           
                           AnguloFin="156"/>
                  </GraphicsView.Drawable>

the arc is drawn correctly. It is as if the Binding did not work correctly How can I solve this problem ?? Have I forgotten to do something? Thanks


Original Comments

Feedback Bot on 8/9/2023, 08:20 PM:

(private comment, text removed)


Original Solutions

(no solutions)

mattleibow commented 1 year ago

To update you also need to call GraphicsView.Invalidate(). Updating a property on the object does not automatically trigger a refresh.

Let me know if this works.

ghost commented 1 year ago

Hi @vsfeedback. We have added the "s/needs-info" label to this issue, which indicates that we have an open question for you before we can take further action. This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.

ghost commented 1 year ago

This issue has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment. If it is closed, feel free to comment when you are able to provide the additional information and we will re-investigate.