Question

在我的xamarin表单页面中，我想在同一页面上显示图表（同步融合）和列表视图。有可能吗？

<ScrollView>
    <StackLayout>

        <chart:SfChart x:Name="Chart" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
    <chart:SfChart.BindingContext>
      <local:ReportPageViewModel/>
    </chart:SfChart.BindingContext>

    <chart:SfChart.Legend>
      <chart:ChartLegend />
    </chart:SfChart.Legend>

    <chart:SfChart.Title>
      <chart:ChartTitle Text="Chart"/>
    </chart:SfChart.Title>

   <chart:SfChart.PrimaryAxis>
      <chart:CategoryAxis LabelRotationAngle="-45" >
        <chart:CategoryAxis.Title>
          <chart:ChartAxisTitle Text="Name"/>
        </chart:CategoryAxis.Title>
      </chart:CategoryAxis>
    </chart:SfChart.PrimaryAxis>

     <chart:SfChart.SecondaryAxis>
      <chart:NumericalAxis>
        <chart:NumericalAxis.Title>
          <chart:ChartAxisTitle Text="Height (in cm)"/>
        </chart:NumericalAxis.Title>
      </chart:NumericalAxis>
    </chart:SfChart.SecondaryAxis>

   <chart:SfChart.Series>
      <chart:ColumnSeries ItemsSource="{Binding Data}" Label="Heights" XBindingPath="Name" YBindingPath="Height" EnableTooltip="True">
        <chart:ColumnSeries.DataMarker>
          <chart:ChartDataMarker/>
        </chart:ColumnSeries.DataMarker>
      </chart:ColumnSeries>
    </chart:SfChart.Series>
  </chart:SfChart>
    <ListView>
    <ListView.ItemsSource>
        <x:Array Type="{x:Type Cell}">
            <EntryCell Text="{Binding Phone}" />
            <EntryCell Text="{Binding Code}" />
            <TextCell Text="LOGIN" Command="{Binding Login}"/>
        </x:Array>
    </ListView.ItemsSource>
  </ListView>
            </StackLayout>
    </ScrollView>

这导致仅显示列表视图而不显示图表。是否可以容纳列表视图以及其他视图？

Answer 1

正如Jason所说，在ListView周围使用ScrollView并不是最好的方法，因为它可能导致许多滚动问题，因为ListView有自己的滚动机制。

执行此操作的一种方法是将图表放在ListView标题中。

// Add this to your page
x:Name="this"

// Use the HeaderTemplate
<ListView x:Name="listView" Header="{Binding this.BindingContext}">
   <ListView.HeaderTemplate>
     <DataTemplate>
        ...
     </DataTemplate>
  </ListView.HeaderTemplate>     
  <ListView.ItemTemplate>
    <DataTemplate>
     ...
    </DataTemplate>
  </ListView.ItemTemplate>
</ListView>

Answer 2

我今天遇到了同样的问题，我正在寻找一种解决方案。

我想在我的图表上方添加一个Picker并将元素放入Grid中，这是下一个解决方案：

 <ScrollView>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Picker x:Name="Picker" Grid.Row="0"/>

             <chart:SfChart Grid.Row="1" >
               My chart...
             </chart:SfChart>
       </Grid>
 </ScrollView>

它看起来像下一个图像 Picker above the chart

使用选择器

Using the picker

xamarin表单：同一页面中的视图和列表视图

2 个答案: