2017-12-25 7 views
1

Ich habe erfolgreich eine Handlung mit Oxyplot in Xamarin.Forms generiert, aber ich kann nicht aufhören Oxyplot die gesamte Seite nehmen.Xamarin.Forms: Oxyplot nimmt ganze Seite

Ich verwende Stapellayout auf anderen Seiten in einem Karussell, und habe ein Banner als eingebettete Stacklayout auf jedem und möchte die Handlung in einem eingebetteten Stacklayout darunter erscheinen lassen.

Aber das Banner erscheint kurz und wird dann vom Oxyplot überschrieben.

Ich fand Hinweise auf die Tatsache, dass Grid anstelle von Stacklayout verwendet werden sollte, da es bekannte Probleme gibt, aber Gitter funktioniert auch nicht.

Jede Hilfe dankbar erhalten! Es kann ein bindendes Problem sein, zum Beispiel, wenn ich das Model = "{Binding Model}" entferne, funktioniert es immer noch! Und es ignoriert den HeighRequest = "100" und füllt nur die Seite. Ich vermisse hier offensichtlich etwas.

Dies ist der XAML-Code, ich habe den Raster Versuch Kommentar gesetzt, und die verschiedenen Optionen in dem „Oxy: PlotView“ sind die letzte habe ich versucht:

<?xml version="1.0" encoding="utf-8" ?> 
<ContentPage 
xmlns="http://xamarin.com/schemas/2014/forms" 
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
x:Class="RentGuru2.PieCosts" 
xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms" 
Padding="0, 20, 0, 0" 
BackgroundColor="#21b09c"> 

<StackLayout Orientation="Vertical"> 
    <StackLayout Orientation="Horizontal" BackgroundColor="#21b09c" HeightRequest="60"> 
     <Image Source = "BannerLogo.png" /> 
     <Label Text="Costs breakdown" FontSize="Large" TextColor="White" Margin="10" VerticalTextAlignment="Center"/> 
    </StackLayout> 
    <StackLayout HeightRequest="300"> 
     <oxy:PlotView Model="{Binding Model}" VerticalOptions="Center" HorizontalOptions="FillAndExpand" 
        HeightRequest="100" WidthRequest="100" /> 
    </StackLayout> 
</StackLayout> 

<!--<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*" /> 
     <ColumnDefinition Width="5*" /> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="60" /> 
     <RowDefinition Height="*" /> 
    </Grid.RowDefinitions> 

    <Image Grid.Row="0" Grid.Column ="0" Source = "BannerLogo.png" /> 
    <Label Grid.Row="0" Grid.Column ="1" Text="Costs breakdown" FontSize="Large" TextColor="White" Margin="10" VerticalTextAlignment="Center"/> 

    <oxy:PlotView Grid.Row="1" Grid.ColumnSpan ="2" Model="{Binding Model}" VerticalOptions="Center" HorizontalOptions="Center" /> 

</Grid>--> 

</ContentPage> 

Dies ist die relevante oxyplot xaml.cs Code:

namespace RentGuru2 
    { 
     [XamlCompilation(XamlCompilationOptions.Compile)] 
     public partial class PieCosts : ContentPage 
     { 
      public PieCosts() 
      { 
       InitializeComponent(); 
      } 

      protected override void OnAppearing() 
      { 
       Content = new PlotView 
       { 
        Model = CreatePieChart() 
       }; 
      } 

      private PlotModel CreatePieChart() 
      { 
       var model = new PlotModel 
       { 
        Title = "Costs breakdown", 
        Padding = new OxyThickness(50, 30, 50, 40), 
        TitleFontSize = 22, 
        TitleColor = OxyColors.White 
        //Title = "", 
        //Padding = new OxyThickness(50, 30, 50, 40), 
        //TitleFontSize = 1, 
        //TitleColor = OxyColors.White, 

       }; 

       var ps = new PieSeries 
       { 
        StrokeThickness = .25, 
        InsideLabelPosition = .8, 
        AngleSpan = 360, 
        StartAngle = 0, 
        LabelField = "{2:0.0}", 
        FontSize = 15, 
        TextColor = OxyColors.White 
       }; 
+0

'OnAppearing()' ersetzt den 'Inhalt' der gesamten Seite mit einem' PlotView' ... so bekommst du, was du verlangst ...: O) – jsanalytics

Antwort

3

Wie wir in den Kommentaren erwähnt, ist die gesamte Seite Content wird durch eine PlotView ersetzt. Außerdem ist deine Bindung kaputt. So, hier ist ein Beispielcode, wie man es tun:

enter image description here

XAML:

<?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:local="clr-namespace:App39" 
      xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms" 
      x:Class="App39.MainPage"> 

    <ContentPage.Content> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="*"/> 
       <RowDefinition Height="5*"/> 
       <RowDefinition Height="5*"/> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="2*"/> 
       <ColumnDefinition Width="4*"/> 
      </Grid.ColumnDefinitions> 

      <Label Grid.Row="0" 
        Grid.ColumnSpan="2" 
        Text="My Sample App" 
        FontAttributes="Bold" 
        FontSize="Large" 
        VerticalOptions="Center" 
        HorizontalOptions="Center" /> 
      <oxy:PlotView 
       Grid.Row="1" 
       Grid.Column="1" 
       Model="{Binding Model}"/> 
      <Image Grid.Row="2" 
        Grid.Column="0" 
        Source="pic111.jpg" 
        Aspect="Fill" /> 
      <BoxView Grid.Row="1" 
        Grid.Column="0" 
        HorizontalOptions="Fill" 
        VerticalOptions="Fill" 
        Color="LightBlue"/> 
      <BoxView Grid.Row="2" 
        Grid.Column="1" 
        HorizontalOptions="Fill" 
        VerticalOptions="Fill" 
        Color="LightSeaGreen"/> 
     </Grid> 
    </ContentPage.Content> 

CS:

public partial class MainPage : ContentPage 
{ 
    SampleViewModel vm; 

    public MainPage() 
    { 
     InitializeComponent(); 

     vm = new SampleViewModel(); 
     BindingContext = vm; 
    } 
} 

Ansicht Modell:

public class SampleViewModel 
{ 
    public PlotModel Model { get; set; } 

    public SampleViewModel() 
    { 
     Model = GetModel(); 
    } 

    private PlotModel GetModel() 
    { 
     var plotModel1 = new PlotModel(); 
     plotModel1.Title = "Sample Pie Chart"; 
     plotModel1.Background = OxyColors.LightGray; 

     var pieSeries1 = new PieSeries(); 
     pieSeries1.StartAngle = 90; 
     pieSeries1.FontSize = 18; 
     pieSeries1.FontWeight = FontWeights.Bold; 
     pieSeries1.TextColor = OxyColors.LightGray; 
     pieSeries1.Slices.Add(new PieSlice("A", 12)); 
     pieSeries1.Slices.Add(new PieSlice("B", 14)); 
     pieSeries1.Slices.Add(new PieSlice("C", 16)); 

     plotModel1.Series.Add(pieSeries1); 

     return plotModel1; 
    } 
} 
+1

Brilliant! Jetzt arbeiten Sie wie gewünscht dank Ihrer Bemühungen. Ich habe auch ein besseres Verständnis dafür, wie Xamarin funktioniert, nochmals vielen Dank. –

+0

@ Brian.S: Bitte denken Sie daran, meinen Beitrag als ** akzeptiert ** zu markieren, indem Sie auf das Häkchen daneben klicken, um es von ausgegraut zu ** grün ** zu schalten. Lesen Sie hier mehr darüber: [Was soll ich tun, wenn jemand meine Frage beantwortet?] (Https://stackoverflow.com/help/someone-answers). Vielen Dank. – jsanalytics