Вопрос или проблема
Я просто попытался добавить изображение и показать его в боковой навигации, что привело к тому, что изображение не отобразилось, а вместо него появилось изображение-заполнитель. Поэтому я продолжил исследовать и выяснил, что проблема все еще существует в чистом проекте с использованием его стандартных изображений, таких как “favicon.png” или “dotnet_bot.svg”.
Итак, вот моя конфигурация:
- Версия VS22 17.12.0 Preview 1.0
- Microsoft Windows 11 10.0.22631 Build 22631
- Пробовал проекты .NET 8 и .NET 9, все с одной и той же проблемой
- Обновил .NET 8/9 SDK (dotnet-sdk-9.0.100-rc.1.24452.12-win-x64/dotnet-sdk-8.0.401-win-x64)
Я использую свой проект с целевыми платформами для Windows Desktop, Android (API 33/34), Web.
Шаблоны проектов, которые я использовал для создания своих проектов, также имеют аналогичные проблемы:
- .NET MAUI Blazor Hybrid и Web App
- .NET MAUI Blazor-App
Как я уже упоминал в начале, я использовал практически чистый шаблон проекта. Единственные изменения: я добавил тег <img> на странице home.razor следующим образом:
@page "/"
<h1>Привет, мир!</h1>
<img src="../../wwwroot/favicon.png" />
Добро пожаловать в ваше новое приложение.
<img src="../../Resources/Images/dotnet_bot.svg" />
Изображения добавлены по умолчанию в проект, без пользовательских ресурсов. Пути были составлены исходя из авто предложения в VS, при наведении на пути в VS отображается маленький миниатюра, что подтверждает корректность пути. Действия сборки для первого – Content, а для второго – MauiImage. Запуск этих приложений дает следующие результаты:
Я попробовал множество вещей, единственная очевидная попытка – другой ноутбук… но, возможно, кто-то имеет идею, что я упускаю… это всего лишь картинка, не так ли…?! Спасибо!
Ответ или решение
Проблема с рендерингом изображений в .NET MAUI Blazor Hybrid может быть связана с несколькими факторами, даже если вы используете шаблонный проект с минимальными изменениями. Давайте разберёмся, как вы можете решить эту проблему.
1. Проверка путей к изображениям
В зависимости от структуры вашего проекта, доступ к изображениям может отличаться. Обычно в приложениях MAUI вам нужно использовать относительные пути, начиная с wwwroot. Попробуйте изменить ваши пути, например, так:
<img src="favicon.png" />
<img src="Resources/Images/dotnet_bot.svg" />Для проекта MAUI доступ к статическим ресурсам в wwwroot не требует указания относительных путей. В случае с Resources, он должен быть такой: /Resources/Images/dotnet_bot.svg.
2. Настройка Build Action
Убедитесь, что действия сборки для изображений установлены правильно. Для файлов в wwwroot это должно быть Content, как вы уже упомянули. Для файлов в Resources действием сборки должно быть MauiImage. Проверьте это в свойствах файлов.
3. Кэширование браузера (для веб-целей)
Если вы тестируете в веб-браузере, возможно, браузер кэширует старые версии файлов. Вы можете попробовать очистить кэш браузера или открыть имперсональную (инкогнито) вкладку.
4. Отключение Microsoft Visual Studio
Иногда проблемы, связанные с рендерингом изображений, могут возникать из-за кэша в Visual Studio. Попробуйте перезапустить Visual Studio или очистить проект (Clean), а затем выполнить сборку заново.
5. Проверка наличия изображений
Убедитесь, что файлы изображений действительно существуют по указанным путям. Вы можете это сделать, открыть файловый менеджер и перейти по указанным вами путям. Это поможет исключить вероятность того, что изображения случайно были удалены или перемещены.
6. Использование других форматов изображений
Если вы по-прежнему не видите изображений, попробуйте использовать другие форматы (например, .jpg или .png вместо .svg), для диагностики проблем с конкретными форматами.
7. Отладка
Попробуйте включить отладочную информацию, чтобы выяснить, есть ли какие-то ошибки при загрузке изображений. Если вы используете браузер, откройте инструменты разработчика (обычно это F12) и проверьте вкладку "Сеть" (Network), чтобы увидеть попытки загрузки изображений и их статус.
8. Обновление пакетов
Так как вы используете предварительную версию Visual Studio, убедитесь, что у вас установлены все последние обновления SDK и инструменты, относящиеся к .NET MAUI. Иногда в неофициальных версиях могут быть специальные ошибки, которые уже исправлены в более новых обновлениях.
Если ни один из этих шагов не поможет, возможно, стоит создать новый проект и проверить, воспроизводится ли проблема на чистом шаблоне. Это поможет определить, вызвана ли проблема чем-то в вашей конкретной настройке или это более широкая проблема с MAUI или Blazor.