Xamarin中的绑定微图表

oogrdqng  于 2023-02-06  发布在  其他
关注(0)|答案(1)|浏览(136)

我试着用MicroChart制作一个图表,通过LearnTechnologies youtube教程(https://www.youtube.com/watch?v=O6xhZkJa7H4&t=1s),但对我来说它不工作。我试着完全基于视频,但它仍然不工作。在模拟器中的图表不显示。我认为问题是与绑定,MainPage xaml指示{绑定LineChart} "没有为绑定'LineChart'找到DataContext。我的代码:

namespace MicroChartBinding.ViewModels
{

    public class ViewModelBase : BindableBase, IInitialize, INavigationAware, IDestructible
    {
        protected INavigationService NavigationService { get; private set; }

        private string _title;
        public string Title
        {
            get { return _title; }
            set { SetProperty(ref _title, value); }
        }

        public ViewModelBase(INavigationService navigationService)
        {
            NavigationService = navigationService;
        }

        public virtual void Initialize(INavigationParameters parameters)
        {
        }

        public virtual void OnNavigatedFrom(INavigationParameters parameters)
        {
        }

        public virtual void OnNavigatedTo(INavigationParameters parameters)
        {
        }

        public virtual void Destroy()
        {
        }
    }
}
namespace MicroChartBinding.ViewModels
{
    class MainPageViewModel : ViewModelBase
    {
        private LineChart lineChart;
        public LineChart LineChart
        {
            get => lineChart;
            set => SetProperty(ref lineChart, value);
        }

        private string[] months = new string[] { "JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC" };

        private float[] turnoverData = new float[] { 6010, 1000, 2524, 3245, 1245, 5767, 5544, 5242, 500, 1555, 400, 100 };

        private SKColor blueColor = SKColor.Parse("#09C");

        public MainPageViewModel(INavigationService navigationService)
          : base(navigationService)
        {
            Title = "Main Page";
        }

        public override void Initialize(INavigationParameters parameters)
        {
            base.Initialize(parameters);
            InitData();
        }

        private void InitData()
        {
            var turnoverEntries = new List<ChartEntry>();

            foreach (var data in turnoverData)
            {
                turnoverEntries.Add(new ChartEntry(data)
                {
                    Color = blueColor,
                    ValueLabel = $"{data / 1000} k",
                    Label = "trnover"
                });
            }
            LineChart = new LineChart { Entries = turnoverEntries, LabelTextSize = 30f, LabelOrientation = Orientation.Horizontal };
        }
    }
}
<?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:Charts="clr-namespace:Microcharts.Forms;assembly=Microcharts.Forms"
             x:Class="MicroChartBinding.MainPage"
             Title="{Binding Title}">

    <Grid RowDefinitions="300,300,300">
        <Charts:ChartView Chart ="{Binding LineChart}"
                          HeightRequest="300"
                          VerticalOptions="Start"
                          HorizontalOptions="Fill"/>
    </Grid>  
    
</ContentPage>
5lhxktic

5lhxktic1#

您共享的教程使用了nuget Prism.Unity.Forms,因此您需要如下修改代码App.xaml.csApp.xaml,它们实现了ViewModel和页面的绑定。

    • 应用程序xaml. cs**
public partial class App 
{

    public App(IPlatformInitializer initializer): base(initializer)
    {
    }

    protected override async void OnInitialized()
    {
        InitializeComponent();

        await NavigationService.NavigateAsync("NavigationPage/MainPage");
    }

    protected override void RegisterTypes(IContainerRegistry containerRegistry)
    {
        containerRegistry.RegisterSingleton<IAppInfo, AppInfoImplementation>();

        containerRegistry.RegisterForNavigation<NavigationPage>();
        containerRegistry.RegisterForNavigation<MainPage, MainPageViewModel>();
    }
}
    • 应用程序xaml**
<?xml version="1.0" encoding="utf-8" ?> 
<prism:PrismApplication xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:prism="http://prismlibrary.com"
             x:Class="ChartAppForm.App">
    <Application.Resources>

    </Application.Resources>
</prism:PrismApplication>

并在Android平台中修改代码,如下所示:

[Activity(Label = "ChartAppForm", Icon = "@mipmap/icon", Theme = "@style/MainTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize )] 
public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
{
    protected override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        Xamarin.Essentials.Platform.Init(this, savedInstanceState);
        global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
        //LoadApplication(new App());

        LoadApplication(new App(new AndroidInitializer()));
    }
    public override void OnRequestPermissionsResult(int requestCode, string[] permissions, [GeneratedEnum] Android.Content.PM.Permission[] grantResults)
    {
        Xamarin.Essentials.Platform.OnRequestPermissionsResult(requestCode, permissions, grantResults);

        base.OnRequestPermissionsResult(requestCode, permissions, grantResults);
    }

}

public class AndroidInitializer : IPlatformInitializer
{
    public void RegisterTypes(IContainerRegistry containerRegistry)
    {
        // Register any platform specific implementations
    }
}
    • 注:**

您可以获得上面教程here的示例。

相关问题