.NET MAUI中实现XAML CollectionView递归式自定义文件浏览器

问题现状 #

基于.NET 9 MAUI开发的自定义文件浏览器，已实现文件/文件夹的递归加载逻辑，支持无限层级嵌套，但当前XAML通过多层重复嵌套CollectionView展示层级，代码冗余且无法灵活适配任意深度的目录结构。

优化思路 #

利用MAUI的递归DataTemplate特性，将单个文件/文件夹的展示结构提取为可复用资源，在模板内部引用自身实现无限层级嵌套；结合Expander控件实现文件夹的折叠/展开功能，配合FileItem的IsExpanded属性控制子项的显示与隐藏。

修改后的XAML代码 #

<ContentPage.Resources>
    <!-- 递归数据模板：定义单个FileItem的展示结构 -->
    <DataTemplate x:Key="FileItemTemplate">
        <Expander IsExpanded="{Binding IsExpanded}"
                  Margin="0,2">
            <Expander.Header>
                <StackLayout Padding="10" 
                             BackgroundColor="{Binding IsSelected, Converter={StaticResource BooleanToColorConverter}}">
                    <StackLayout.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding TapCommand}" />
                    </StackLayout.GestureRecognizers>
                    <Grid ColumnDefinitions="*,Auto,Auto" Padding="0">
                        <Label Text="{Binding DisplayName}" 
                               FontSize="Medium" 
                               LineBreakMode="TailTruncation" 
                               VerticalOptions="Center" 
                               Grid.Column="0" />
                    </Grid>
                </StackLayout>
            </Expander.Header>
            <!-- 递归引用模板：子项CollectionView复用同一模板实现无限层级 -->
            <CollectionView ItemsSource="{Binding Items}" 
                            SelectionMode="None"
                            ItemTemplate="{StaticResource FileItemTemplate}">
                <CollectionView.Margin>
                    <OnPlatform x:TypeArguments="Thickness">
                        <On Platform="Android, iOS" Value="20,0,0,0" />
                        <On Platform="Windows" Value="20,0,0,0" />
                    </OnPlatform>
                </CollectionView.Margin>
            </CollectionView>
        </Expander>
    </DataTemplate>
</ContentPage.Resources>

<!-- 主CollectionView：展示根目录项 -->
<CollectionView x:Name="FileCollectionView" 
                ItemsSource="{Binding FileItems}" 
                SelectionMode="None"
                SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
                ItemTemplate="{StaticResource FileItemTemplate}" />

后台代码调整 #

在OpenPath回调中添加文件夹展开/折叠的逻辑，点击文件夹时切换IsExpanded状态：

private void OpenPath(FileItem item)
{
    if (item.IsFolder)
    {
        // 切换文件夹展开/折叠状态
        item.IsExpanded = !item.IsExpanded;
    }
    else
    {
        // 处理文件点击逻辑（如打开文件）
        // ...
    }
}

模型类说明 #

现有FileItem模型已具备适配递归模板的关键属性，无需额外修改：

• IsExpanded：绑定Expander控件的展开状态，控制子目录显示
• Items：存储当前文件夹的子项集合，用于递归绑定
• DisplayName：自动区分文件/文件夹图标及层级标识

内容的提问来源于stack exchange，提问作者voods