You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

.NET MAUI应用菜单条目无法正常显示,寻求技术排查支持

.NET MAUI 侧边栏菜单条目无法显示问题排查求助

我开发的.NET MAUI应用中,侧边栏的菜单条目无法正常显示,尝试多种调试方法后仍未找到问题根源,以下是界面截图、C#逻辑代码与XAML布局代码,恳请协助排查。

应用界面截图

C# 逻辑代码

using System.Collections.Generic;
using Microsoft.Maui.Controls;

namespace SideManagementTool
{
    public class MenuItem
    {
        public string Icon { get; set; }
        public string Title { get; set; }
        public string Description { get; set; }
    }

    public partial class MainPage : ContentPage
    {
        public List<MenuItem> MenuItems { get; set; }

        public MainPage()
        {
            InitializeComponent();

            // 定义菜单项(使用本地图片)
            MenuItems = new List<MenuItem>
            {
                new MenuItem { Icon = "icon_dashboard.png", Title = "Dashboard", Description = "Overview of activities" },
                new MenuItem { Icon = "icon_projects.png", Title = "Projects", Description = "Manage your projects" },
                new MenuItem { Icon = "icon_notifications.png", Title = "Notifications", Description = "Check notifications" },
                new MenuItem { Icon = "icon_analytics.png", Title = "Analytics", Description = "View analytics data" },
                new MenuItem { Icon = "icon_items.png", Title = "Items", Description = "Manage items" },
                new MenuItem { Icon = "icon_settings.png", Title = "Settings", Description = "Configure settings" }
            };

            // 设置BindingContext为自身,让XAML可以访问属性
            BindingContext = this;
        }

        // 处理菜单项点击的命令
        public Command<MenuItem> OnMenuItemClicked => new Command<MenuItem>((item) =>
        {
            DisplayAlert("Menu Clicked", $"You clicked on {item.Title}", "OK");
        });
    }
}

XAML 布局代码

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="SideManagementTool.MainPage"
             BackgroundColor="#5AA1D7"
             Shell.NavBarIsVisible="False">

    <Grid RowDefinitions="*" ColumnDefinitions="Auto,*">

        <!-- 侧边栏 -->
        <Frame Grid.Row="0" Grid.Column="0" 
               BackgroundColor="LightGray" 
               WidthRequest="250" 
               VerticalOptions="FillAndExpand"
               CornerRadius="0">

            <VerticalStackLayout Padding="10">
                <!-- 头部 -->
                <Label Text="CodingLab" FontSize="24" FontAttributes="Bold" HorizontalOptions="Center" />

                <!-- 菜单项列表 -->
                <CollectionView ItemsSource="{Binding MenuItems}" SelectionMode="None">
                    <CollectionView.ItemTemplate>
                        <DataTemplate>
                            <Grid Padding="10" ColumnDefinitions="Auto,*">
                                <!-- 图标 -->
                                <Image Source="{Binding Icon}" WidthRequest="20" HeightRequest="20" VerticalOptions="Center" />

                                <!-- 文本 -->
                                <VerticalStackLayout Grid.Column="1" Spacing="2" Padding="10,0,0,0">
                                    <Label Text="{Binding Title}" FontSize="16" TextColor="Black" />
                                    <Label Text="{Binding Description}" FontSize="12" TextColor="Gray" />
                                </VerticalStackLayout>

                                <!-- 悬停与点击动画 -->
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Normal" />
                                        <VisualState x:Name="PointerOver">
                                            <VisualState.Setters>
                                                <Setter TargetName="Grid" Property="BackgroundColor" Value="#E0E0E0" />
                                            </VisualState.Setters>
                                        </VisualState>
                                        <VisualState x:Name="Pressed">
                                            <VisualState.Setters>
                                                <Setter TargetName="Grid" Property="BackgroundColor" Value="#B0B0B0" />
                                            </VisualState.Setters>
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>

                                <!-- 点击手势识别 -->
                                <Grid.GestureRecognizers>
                                    <TapGestureRecognizer Command="{Binding Source={x:Reference Name=MainPage}, Path=OnMenuItemClicked}" />
                                </Grid.GestureRecognizers>
                            </Grid>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>
            </VerticalStackLayout>
        </Frame>

        <!-- 主内容区域 -->
        <ContentView Grid.Row="0" Grid.Column="1" 
                     BackgroundColor="White" 
                     Padding="20"
                     VerticalOptions="FillAndExpand"
                     HorizontalOptions="FillAndExpand">
            <Label Text="Content goes here" FontSize="24" 
                   HorizontalOptions="Center" 
                   VerticalOptions="Center" 
                   TextColor="Black" />
        </ContentView>

    </Grid>
</ContentPage>

我已尽可能简化问题与代码,希望能找到问题根源。

内容的提问来源于stack exchange,提问作者wolei

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.16 22:14:58