另一个ListView中的ListView没有组装正确的模板

问题描述

我在另一个列表视图中有一个列表视图，但是第二个列表视图不考虑自动高度，显然它是基于父列表视图的某些属性作为图像的。

Listview

-第一个列表视图，我使用的是Questoestemplates的templateselector

<ListView  x:Name="ListView_ListaPerguntas" 
                                   ItemsSource="{Binding Perguntas}"
                                   SeparatorColor="Black"
                                   HasUnevenRows="True"
                                   SeparatorVisibility="Default"
                                   ItemTapped="ListView_ListaPerguntas_ItemTapped"
                                   ItemTemplate="{StaticResource Questoestemplates}"
                                   IsEnabled="True">
                        </ListView>

-secont listView进入模板选择器

<DataTemplate x:Key="MultiplaTemplate">
            <ViewCell>
                <FlexLayout Direction="Column"  Margin="0,10" BackgroundColor="DarkOrchid">
                    <Label Text="{Binding Ds_DescricaoPergunta}"/>

                    <ListView x:Name="ListView_AlternativaSelecao"
                              HasUnevenRows="True"
                              ItemsSource="{Binding Path=Alternativas}"
                              BackgroundColor="Blue" Margin="20"
                              VerticalOptions="Fill">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <ViewCell>
                                    <FlexLayout Direction="Row">
                                        <Label Text="{Binding Ds_DescricaoPergunta}" Margin="10,0"/>
                                        <Label Text=" - "/>
                                        <CheckBox />
                                    </FlexLayout>

                                </ViewCell>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                        <ListView.Header>
                            <StackLayout VerticalOptions="EndAndExpand" Orientation="Horizontal">
                                <Label Text="Confirma as alternativas?" HorizontalOptions="StartAndExpand"/>
                                <Button Text="Confirmar" HorizontalOptions="EndAndExpand"/>
                            </StackLayout>
                        </ListView.Header>
                        <ListView.Footer>
                            <StackLayout VerticalOptions="EndAndExpand" Orientation="Horizontal">
                                <Label Text="Confirma as alternativas?" HorizontalOptions="StartAndExpand"/>
                                <Button Text="Confirmar" HorizontalOptions="EndAndExpand"/>
                            </StackLayout>
                        </ListView.Footer>
                    </ListView>
                    <StackLayout VerticalOptions="EndAndExpand" Orientation="Horizontal">
                        <Label Text="Confirma as alternativas?" HorizontalOptions="StartAndExpand"/>
                        <Button Text="Confirmar" HorizontalOptions="EndAndExpand"/>
                    </StackLayout>
                    <BoxView HeightRequest="2" BackgroundColor="Red"/>
                </FlexLayout>
            </ViewCell>
        </DataTemplate>

结果是图像，他占据了更高的高度。

解决方法

根据您想要的功能，我将把每个问题分解成几页，或者您可以使用水平滚动轮播视图。您甚至可以使用一个按钮来提交答案并转到下一个答案。

,

就像杰森说的那样，您可以使用Grouped ListView。我编写了一个简单的代码供您参考。

Xaml：

 <ListView IsGroupingEnabled="true" ItemsSource="{Binding ListOfAnswers}">
        <ListView.GroupHeaderTemplate>
            <DataTemplate>
                <ViewCell>
                    <Label Text="{Binding Questions}" BackgroundColor="Purple"/>
                </ViewCell>
            </DataTemplate>
        </ListView.GroupHeaderTemplate>

        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <Label Text="{Binding Ds_DescricaoPergunta}"/>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

后面的代码：

public partial class MainPage : ContentPage
{
    private List<AnswerList> _listOfAnswers;
    public List<AnswerList> ListOfAnswers { get { return _listOfAnswers; } set { _listOfAnswers = value; base.OnPropertyChanged(); } }

    public MainPage()
    {
        InitializeComponent();
        var Q1List = new AnswerList()
        {
            new Answer(){ Ds_DescricaoPergunta="Q1_Answer1"},new Answer(){ Ds_DescricaoPergunta="Q1_Answer2"},new Answer(){ Ds_DescricaoPergunta="Q1_Answer3"},};
        Q1List.Questions = "Q1";

        var Q2List = new AnswerList()
        {
            new Answer(){ Ds_DescricaoPergunta="Q2_Answer1"},new Answer(){ Ds_DescricaoPergunta="Q2_Answer2"},new Answer(){ Ds_DescricaoPergunta="Q2_Answer3"},};
        Q2List.Questions = "Q2";

        var Q3List = new AnswerList()
        {
            new Answer(){ Ds_DescricaoPergunta="Q3_Answer1"},new Answer(){ Ds_DescricaoPergunta="Q3_Answer2"},};
        Q3List.Questions = "Q3";

        var Q4List = new AnswerList()
        {
            new Answer(){ Ds_DescricaoPergunta="Q4_Answer1"},new Answer(){ Ds_DescricaoPergunta="Q4_Answer2"},new Answer(){ Ds_DescricaoPergunta="Q4_Answer3"},new Answer(){ Ds_DescricaoPergunta="Q4_Answer4"},};
        Q1List.Questions = "Q4";

        var list = new List<AnswerList> { Q1List,Q2List,Q3List,Q4List };
        ListOfAnswers = list;

        this.BindingContext = this;
    }
}
public class Answer
{
    public string Ds_DescricaoPergunta { get; set; }
}
public class AnswerList : List<Answer>
{
    public string Questions { get; set; }
    public List<Answer> Answers => this;
}

屏幕截图：