Xamarin.Forms: несколько оксиплотов на одном ScrollView - PullRequest
0 голосов
/ 31 марта 2020

Я пытаюсь выяснить это около 3 дней.

TL; DR: Как я могу поместить несколько OxyPlots (разных видов) в прокручиваемую страницу прокрутки (на ContentPage)? Может кто-нибудь объяснить мне, в каких отношениях находится элемент XAML и кодовая база CS?


Вопрос кажется простым, но я изо всех сил пытаюсь добиться этого. На каждой странице показаны одни и те же примеры или недостаточно указано c для моей проблемы, только отдельные проблемы. По сути, я хочу сделать это:

enter image description here

Так что теперь я сталкиваюсь с несколькими проблемами, такими как график заполняет весь сайт, график не отображается, я по какой-то причине не могу использовать MultiView и т.д. c. et c.

Большинство учебных пособий основаны на настройке всего содержимого страницы в виде диаграммы. Некоторые другие могут обойти это, но только с crypti c XAML или XAML, которые не будут работать (MultiView, я использую ScrollPage вместо ContentPage, поэтому я не могу установить атрибут <ContentPage.BindingContext/> или overrides void OnAppearing(). Также установить BindingContext через код в CS не поможет, потому что кажется, что это применимо только к страницам с одной диаграммой.

(Я инициализировал рендерер. У меня уже были графики, отображаемые в моем приложении.)

Вот как я это понимаю:

<?xml version="1.0" encoding="UTF-8"?>
<ScrollView xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms"
             mc:Ignorable="d"
             x:Class="PieCharter.Test">
    <ScrollView.Content>
        <oxy:PlotView Model="{Binding Model}" IsVisible="True"/>
    </ScrollView.Content>
</ScrollView>

Я могу установить одну (или более) из этих диаграмм здесь, в XAML, и они должны отображаться как содержимое страницы с этой кодовой базой:

using System;
using System.Text;

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

using OxyPlot;
using OxyPlot.Series;
using OxyPlot.Xamarin;
using OxyPlot.Xamarin.Forms;

namespace PieCharter
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class Test : ScrollView
    {

        public Test()
        {
            InitializeComponent();

            Content = new PlotView
            {
                Model = CreatePieChart()
            };
        }

        private PlotModel CreatePieChart()
        {
            var model = new PlotModel { Title = "PieChart" };

            var ps = new PieSeries
            {
                StrokeThickness = 0.25,
                InsideLabelPosition = 0.25,
                AngleSpan = 360,
                StartAngle = 0
            };

            ps.Slices.Add(new PieSlice("Slice 1, 50");
            ps.Slices.Add(new PieSlice("Slice 2, 50");
            ps.Slices.Add(new PieSlice("Slice 3, 50");

            model.Series.Add(ps);

            return model;
        }
    }
}

Но это доставляет мне проблемы, потому что устанавливает целую страницу на диаграмму, и я не могу разделить их, например, на сетку (также при использовании контейнера Layout и нескольких PlotView s это не помогло).

Почему я не могу просто создать несколько private PlotView PiePlotView, дать им Model = CreateXChart() в качестве аргумента и установить содержимое моей страницы в файлах XAML как PlotView s?

Это действительно смущает меня, и документация не совсем полезно, к сожалению.

Что на самом деле означает Model="{Binding Model}"? Является ли Model членом PlotView? (Должно быть, но я видел людей, использующих другие переменные.) И если да, то как мой XAML узнает, какой Model использовать при помещении нескольких OxyPlots в один файл? Я полагаю, это связано с BindingContext / <ContentPage.BindingContext/> или чем-то еще.

Может кто-нибудь объяснить мне, пожалуйста, более подробно, как это сделать sh, и если вы не предоставите Решение, пожалуйста, помогите мне хотя бы понять, что происходит вообще. Это раздражает, и я, честно говоря, почему-то думаю, что XAML кажется довольно неумелым и грязным решением (по крайней мере, мне так кажется).

Я знаю основы XAML, я ничего не знаю. Но это просто взаимодействие между этими двумя частями, я не могу обернуть голову вокруг ...


То, что я уже пробовал (и еще много, но, вероятно, неправильно понял различные вещи):

1 , 2 , 3 , 4 , 5 , ...

1 Ответ

0 голосов
/ 01 апреля 2020

ScrollView может иметь только одного дочернего элемента, поэтому вы можете добавить дочерних элементов, которые, в свою очередь, могут иметь несколько дочерних элементов, таких как StackLayout или Grid

Модель относится к текущей модели для график / диаграмму, вы должны установить его, если вы используете Binding, страница должна иметь тот же BindingContext, сопоставленный с viewmodel, имеющим свойство с тем же именем, и Viewmodel должен реализовать INotifyPropertyChanged

в коде позади контента страница

public TestPage()
{
    BindingContext = new TestViewModel();
}

TestViewModel

public class TestViewModel : INotifyPropertyChanged 
{
    public TestViewModel () 
    {
        //initialize Model 1..4
    }

    public Model Model1 
    {
        get => _Model1;

        set 
        {
            _Model1 = value;
            //set value
            NotifyPropertyChanged (); // implemented method for INotifyPropertyChanged
        }
    }

}
<?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:d="http://xamarin.com/schemas/2014/forms/design" 
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms" 
             mc:Ignorable="d" 
             x:Class="PieCharter.Test">
    <ContentPage.Content>
        <ScrollView>
            <StackLayout>
                <Label Text="Some label1 " />
                <Label Text="And some stuff" />
                <PlotView x:Name="plotview1" 
                    Model="{Binding Model1}" 
                    IsVisible="True" 
                    HeightRequest="300" />
                <PlotView x:Name="plotview2" 
                    Model="{Binding Model2}" 
                    IsVisible="True" 
                    HeightRequest="300" />
                <PlotView x:Name="plotview3" 
                    Model="{Binding Model3}" 
                    IsVisible="True" 
                    HeightRequest="300" />
                <PlotView x:Name="plotview4" 
                    Model="{Binding Model4}" 
                    IsVisible="True" 
                    HeightRequest="300" />
            </StackLayout>
        </ScrollView>
    </ContentPage.Content>
</ContentPage>

...