我正在使用一个Expander
用于显示一本书的单元和章节。我能够将单位显示为Expander.Header
,但单元下的章节又是一个列表。我尝试如下,但章节无法在用户界面上查看。
XAML
<StackLayout BindableLayout.ItemsSource="{Binding AllItems,Mode=TwoWay}">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Expander
ExpandAnimationEasing="{x:Static Easing.CubicIn}"
ExpandAnimationLength="500"
CollapseAnimationEasing="{x:Static Easing.CubicOut}"
CollapseAnimationLength="500">
<Expander.Header>
<StackLayout
Orientation="Horizontal">
<Label
Text="{Binding unit.title}"
TextColor="Black"
HorizontalOptions="Start"
HorizontalTextAlignment="Start"
FontSize="18"
VerticalTextAlignment="Center"
VerticalOptions="CenterAndExpand">
</Label>
</StackLayout>
</Expander.Header>
<Expander.ContentTemplate>
<DataTemplate>
<StackLayout
Orientation="Horizontal">
<Label
HorizontalOptions="Start"
Text="{Binding contentList.title}"
VerticalOptions="CenterAndExpand"
FontSize="16"
TextColor="Black">
</Label>
</StackLayout>
</DataTemplate>
</Expander.ContentTemplate>
</Expander>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
我的 JSON 数据格式:
"bookContentList": [
{
"unit": {
"title": "Unit 1: Revelation"
},
"contentList": [
{
"title": "Unit 1: Preview",
"embedCode": "c1"
},
{
"title": "Chapter 1: God's Plan for all creation",
"embedCode": "c2"
},
{
"title": "Chapter 2: Made to be with god",
"embedCode": "c3"
},
{
"title": "Chapter 3: Signs of gods presence",
"embedCode": "c4"
}
]
},
{
"unit": {
"title": "Unit 2: Trinity"
},
"contentList": [
{
"title": "Unit 2: Preview",
"embedCode": "c5"
},
{
"title": "Chapter 4: The mystery of the trinity",
"embedCode": "c6"
},
{
"title": "Chapter 5: Prayer and Worship",
"embedCode": "c7"
},
{
"title": "Chapter 6: Life of Virtue",
"embedCode": "c8"
}
]
}
]
视图模型
private List<BookContentList> _allItems;
public List<BookContentList> AllItems
{
get
{ return _allItems; }
set
{
_allItems = value;
OnPropertyChanged("AllItems");
}
}
//setting data
AllItems = bookDetails.bookContentList;
我的问题是每个单元下的章节没有显示在用户界面上。我已经上传了一个示例项目here以便于参考。
我还需要知道如何获取所选章节的完整详细信息?