具有由模型属性填充的进度条的ListView

时间:2019-02-17 20:51:06

标签: listview mvvm xamarin.forms progress-bar inotifypropertychanged

亲爱的

我想使用INotifyPropertyChanged实时填充和更新我的信息,以创建包含模型信息的列表视图。但是当我尝试在我的Progress函数中使用绑定时,它没有用。

我的看法是:

   <?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:skia="clr-namespace:SkiaSharp.Views.Forms;assembly=SkiaSharp.Views.Forms"
             x:Class="H2XA.View.PatientView"
             Title="Pacientes">

        <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

            <Label x:Name="Paciente1" Text="Paciente"
                   HorizontalOptions="Center"
                   VerticalOptions="Center"
                    />  
              <ListView x:Name="Patients" 
                          ItemSelected="OnSelection"
                          IsPullToRefreshEnabled="True">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <ViewCell.ContextActions>
                                    <MenuItem Text="Renomear" CommandParameter="{Binding .}"
                                         Clicked="Renomear_Clicked" />
                                </ViewCell.ContextActions>
                                <StackLayout Padding="5,0,5,0">
                                    <Label Text="{Binding Name}" Font="16"/>
                                    <Label Text="{Binding Medidas}" Font="14" />
                                    <ProgressBar ProgressColor="{Binding Bar_Color}" 
                                     Progress="{Binding CurrentProgress}" 
                                     PropertyChanged="ProgressBar_PropertyChanged"/>
                                </StackLayout>
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
            </StackLayout>

</ContentPage>

 public partial class PatientView : ContentPage
    {
        public PatientView()
        {
            InitializeComponent();

            BindingContext = App.PVM;
            Patients.ItemsSource = App.PVM.AllPatient;
        }
        private async void OnSelection(object sender, SelectedItemChangedEventArgs e)
        {
            if (e.SelectedItem == null)
            {
                return;
            }
            await DisplayAlert("Selecionado", e.SelectedItem.ToString(), "Ok");
            string a = e.SelectedItem.ToString().Substring(0, 12);

        }

        private void Renomear_Clicked(object sender, EventArgs e)
        {
            //replace name
            var item = (MenuItem)sender;
            (item.CommandParameter as Patient).Name = "new name";

        }


        private void ProgressBar_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
        {
        //This is the way that i found.
        var item = (sender as ProgressBar) ;

        if(item.Progress==0)
        item.ProgressTo(1, 15000, Easing.Linear);

        if (item.Progress == 1)
        item.ProgressColor = Color.Green;

        }
    }

这是我发现将ProgressBars列表填充到Objects中的方法。但这不是实现此解决方案的好方法,因为我无法控制ProgressBar的时间,并且无法“线性化”它的线性关系,它对大数而言并不是真正的线性化。

ProgressTo的第一个参数是Progress,我想在我将其与secound参数一起设置的时间上显示。

我想作为我的对象的参数实现到模型中。

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Text;
using H2XA.ViewModel;
using Xamarin.Forms;

namespace H2XA.Model
{
    public class Patient:INotifyPropertyChanged
    {
        public Guid Id { get; set; }
        public DateTime examdate;
        public int cronometro;
        public decimal barCronometro;
        public Color Bar_Color;
        private string name;
        private string medidas;

        public Patient()
        {
            cronometro = 0;

            Device.StartTimer(TimeSpan.FromSeconds(15),  () =>
            {
                if (cronometro < 6)
                {
                    Bar_Color = Color.Blue;
                    cronometro++;
                }
                else
                {

                    if (cronometro == 60)
                    {
                        Bar_Color = Color.Red;
                    }
                }


                CurrentProgress = (cronometro / 60);


                return true;
            });

        }

        private decimal _currentProgress;
        public decimal CurrentProgress
        {
            get { return _currentProgress; }
            private set
            {
                _currentProgress = value;
                OnPropertyChanged();
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void OnPropertyChanged([CallerMemberName] String propertyName = "")
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        public string Name
        {
            get { return name; }
            set
            {
                name = value;
                OnPropertyChanged();//Esse comando faz a tela ser atualizada quando algo é inserido.

            }
        }
        public string Medidas
        {
            get { return medidas; }
            set
            {
                medidas = value;
               OnPropertyChanged();//Esse comando faz a tela ser atualizada quando algo é inserido.

            }
        }

    }
}

但是,当我以这种方式执行操作时,就没有动画,也不会更新图中的时间,只有在确定工作和我的栏看起来充满的时候才更新。我不知道绑定是否有效,对我来说我做了一些有意义的事情。

我正在检查代码,并注意到每次都会调用我的ProgressBar_PropertyChanged,这也不利于我提高应用程序的效率。谁能帮助我改善代码并组织功能来更好地组织MVVM项目。

预先感谢

Guilherme商标

1 个答案:

答案 0 :(得分:1)

  1. ProgressBar 不在 ListView 中时。 您应该 Overriding the Binding Mode ,目标属性上的默认绑定模式为OneWay。当模型数据更改时,已在此处设置进度条的进度。它不会触发此操作ProgressTo的方法。

在这里您应该使用的绑定模式是TwoWay,它将正确显示。

示例代码如下:

Xaml:

 <ProgressBar x:Name="progressBar" 
                     Progress="{Binding CurrentProgress,Mode=TwoWay}" 
                     PropertyChanged="ProgressBar_PropertyChanged"/>

ContentPage::更改模型数据后,它将起作用。

private void ProgressBar_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
        {
            //This is the way that i found.
            var item = (sender as ProgressBar);

            //if (item.Progress == 0)
                item.ProgressTo(1, 15000, Easing.Linear);

            //if (item.Progress == 1)
                //item.ProgressColor = Color.Green;

        }

您可以删除ProgressBar_PropertyChanged方法。更改数据后,请执行以下操作:

   dataModel.CurrentProgress = 0.8;
   ...
   progressBar.ProgressTo(dataModel.CurrentProgress, 3000, Easing.Linear);
  1. ProgressBar MVVM 绑定在 ListView 中时,无法发生Animation。这里是article供参考。

解决方案:

这里是一种使用Timer安排任务以更改进度数据的方法。

Timer timer; // create a timer
DataModel dataModel; // data model
private double ApiProgressData = 0; // Simulate data from Api

初始化计时器及其事件处理程序:

 timer = new Timer();
 timer.Interval = 100;
 timer.Elapsed += Timer_Elapsed;

  private void Timer_Elapsed(object sender, ElapsedEventArgs e)
    {   
        if (ApiProgressData > dataModel.CurrentProgress)
        {
            dataModel.CurrentProgress = dataModel.CurrentProgress + 0.01;
            if ((ApiProgressData - dataModel.CurrentProgress) < 0.00001)
            {
                Device.BeginInvokeOnMainThread(() =>
                {
                    timer.Stop();
                });

            }
        }
        else if (ApiProgressData < dataModel.CurrentProgress)
        {
            dataModel.CurrentProgress = dataModel.CurrentProgress - 0.01;
            if (( dataModel.CurrentProgress - ApiProgressData ) < 0.00001)
            {
                Device.BeginInvokeOnMainThread(() =>
                {
                    timer.Stop();
                });

            }
        }else{
            Device.BeginInvokeOnMainThread(() =>
                {
                    timer.Stop();
                });
        }
    }

更改Api数据后,使用计时器更改Model的数据:

 ApiProgressData = 0.8; //  Simulate data is 0.8 to test
 timer.Start();

或者您可以尝试使用第三方库,如上文中所述。