如何在 xamarin C# 的 For 循环内的代码隐藏中创建 Expander

How to create Expander in codebehind inside For Loop in xamarin C#

这里contentItems[0]有Header的内容,contentItems[1]有Header的段落。我想在 Xamarin Expander.

中显示 header 内的段落

在 运行 此代码得到 System.NullReferenceException 之后:'Object reference not set to an instance of an object.'

 public partial class TermsAndConditionsPage : ContentPage
{
    private TermsAndConditionsViewModel _Model;     
    public TermsAndConditionsPage()
    {
        InitializeComponent();
      
        _Model = new TermsAndConditionsViewModel(Navigation);
        BindingContext = _Model;

        for (int i = 1; i < _Model.contentList.Length; i++)
        {
            string[] contentItems = _Model.contentList[i].Split("\n", 2);

            Console.WriteLine("Printing Header of Content... \n");
            Console.WriteLine(contentItems[0]);

            Console.WriteLine("Printing Paragraph of Header... \n");
            Console.WriteLine(contentItems[1]);

            Expander expander = new Expander
            {
                Header = new Label
                {
                    Text = contentItems[0],
                    FontAttributes = FontAttributes.Bold,
                    FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label))
                }
            };

            Grid grid = new Grid
            {
                Padding = new Thickness(10),
                ColumnDefinitions =
                {
                    new ColumnDefinition { Width = GridLength.Auto },
                    new ColumnDefinition { Width = GridLength.Auto }
                }
            };

            grid.Children.Add(new Label
            {
                Text = contentItems[1],
                FontAttributes = FontAttributes.Italic
            }, 1, 0);

            expander.Content = grid;

        }
    }     
}

像这张图片一样输出,但我需要多个扩展器,具体取决于数组。 Output like this image..

谢谢!

如果您在代码后面设置布局,请在您的页面结构末尾添加以下代码。

 Content = expander;

如果你想显示一个级别的扩展器,你可以查看下面的示例。 https://github.com/xamarin/xamarin-forms-samples/tree/main/UserInterface/ExpanderDemos

如果你想像下面这样显示多层次,你可以在 stacklayout 中使用多个扩展器。

 <ScrollView Margin="20">
    <StackLayout BindableLayout.ItemsSource="{Binding roots}">
        <BindableLayout.ItemTemplate>
            <DataTemplate>
                <xct:Expander>
                    <xct:Expander.Header>
                        <Label Text="{Binding Root}"
                           FontAttributes="Bold"
                           FontSize="Large" />
                    </xct:Expander.Header>

                    <StackLayout BindableLayout.ItemsSource="{Binding Node}">
                        <BindableLayout.ItemTemplate>
                            <DataTemplate>                                        
                                <xct:Expander Padding="10">
                                    <xct:Expander.Header>
                                        <Label Text="{Binding Key.Node}" FontSize="Medium" />
                                    </xct:Expander.Header>
                                    <StackLayout BindableLayout.ItemsSource="{Binding Value}">
                                        <BindableLayout.ItemTemplate>
                                            <DataTemplate>
                                                <Label Text="{Binding SubRoot}"  FontSize="Small" />
                                            </DataTemplate>
                                        </BindableLayout.ItemTemplate>
                                    </StackLayout>

                                </xct:Expander>
                            </DataTemplate>
                        </BindableLayout.ItemTemplate>
                    </StackLayout>
                </xct:Expander>
            </DataTemplate>
        </BindableLayout.ItemTemplate>
    </StackLayout>
</ScrollView>

有关视图模型的更多详细信息,您可以参考我之前完成的线程。