В Xamarin.Forms для отображения изображений используется элемент управления <Image>. Этот элемент позволяет загружать и отображать графические файлы из различных источников: встроенные ресурсы проекта, локальные файлы устройства, URI (интернет-ресурсы), а также потоковые данные. Он поддерживает управление размерами, выравниванием, прозрачностью, анимацией загрузки и другими параметрами.

Источники изображений в Xamarin.Forms

1. Встроенные ресурсы (Embedded Resource)

Это изображения, включённые в сборку проекта и компилируемые вместе с приложением.

Шаги для использования:

1. Поместите изображение в папку проекта (например, Assets).

2. Установите для файла свойство Build Action = EmbeddedResource.

3. Используйте ImageSource.FromResource() в коде C#:

image.Source = ImageSource.FromResource("YourAppNamespace.Assets.logo.png");

Для XAML потребуется кастомный ImageResourceExtension.

2. Ресурсы проекта (Platform-Specific)

Android:

• Поместите изображения в папки:

  • Resources/drawable

  • Resources/drawable-hdpi, mdpi, xhdpi и т.д.

• Установите Build Action = AndroidResource.

• Используйте имя файла без расширения:

<Image Source="logo.png" />

iOS:

• Поместите в Resources или Assets.xcassets.

• Установите Build Action = BundleResource.

• Имя указывается без расширения, если используется .xcassets.

<Image Source="logo" />

UWP:

• Поместите изображения в Assets.

• Установите Build Action = Content.

• Указывайте относительный путь:

<Image Source="Assets/logo.png" />

3. Интернет-изображения (URI / URL)

Можно загружать изображения по ссылке:

<Image Source="https://example.com/image.png" />

• Работает асинхронно.

• Поддерживается кэш браузера.

• Для изображений из интернета желательно использовать FFImageLoading или ImageButton для дополнительного контроля.

4. Локальные файлы на устройстве

Для доступа к изображениям, сохранённым во внутренней памяти:

Получение пути:

string filePath = Path.Combine(
Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "image.png");
image.Source = ImageSource.FromFile(filePath);

• Используется метод ImageSource.FromFile.

• Файл должен быть доступен приложению (внутренняя или внешняя директория).

5. Потоки (Stream) — динамическая загрузка

Если изображение поступает из базы данных, web API или ZIP-архива, его можно отобразить как поток:

Stream GetImageStream()
{
var assembly = typeof(MainPage).GetTypeInfo().Assembly;
return assembly.GetManifestResourceStream("YourAppNamespace.Assets.logo.png");
}
image.Source = ImageSource.FromStream(() => GetImageStream());

Пример использования в XAML

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
&lt;StackLayout Padding="20"&gt;
<Image Source="logo.png"
HeightRequest="100"
WidthRequest="100"
Aspect="AspectFit" />
&lt;/StackLayout&gt;
&lt;/ContentPage&gt;

Свойства элемента <Image>:

Значения свойства Aspect

Динамическая подстановка изображения в C#

var image = new Image
{
Source = "logo.png",
Aspect = Aspect.AspectFit,
HeightRequest = 100,
WidthRequest = 100
};

Или изменение по событию:

myImage.Source = ImageSource.FromFile("newImage.png");

Кэширование изображений

Изображения из интернета не кэшируются автоматически. Для продвинутых сценариев можно использовать сторонние библиотеки:

FFImageLoading (больше не поддерживается, но ещё работает)

<ffimageloading:CachedImage Source="https://example.com/img.jpg"
DownsampleToViewSize="true"
Aspect="AspectFit"
LoadingPlaceholder="loading.png"
ErrorPlaceholder="error.png" />

• Поддерживает кэш, анимации, преобразования

• Используется через NuGet и подключение namespace

ImageButton

Если изображение должно реагировать на нажатие, можно использовать ImageButton:

<ImageButton Source="icon.png"
Clicked="OnImageClicked"
BackgroundColor="Transparent"
WidthRequest="50" HeightRequest="50" />

Отладка и диагностика

• Если изображение не отображается:

  • Проверьте правильность пути и расширения

  • Убедитесь, что файл имеет правильную Build Action

  • Для EmbeddedResource проверьте полное пространство имён

  • Проверьте логи загрузки (особенно для URL)

Где хранить изображения в проекте

Рекомендуется использовать отдельные папки:

• Resources/Images — для Android

• Assets.xcassets — для iOS

• Assets/ — для UWP

• Images/ или Assets/ — для общего проекта (если EmbeddedResource)

Особенности для платформ

Стилизация и прозрачность

• Можно применять прозрачные .png

• Использовать Opacity и BackgroundColor

• Для наложения изображений используйте AbsoluteLayout или Grid с перекрытием

Отображение изображений в Xamarin.Forms реализуется гибко и кроссплатформенно, с поддержкой локальных и удалённых источников. Правильная организация ресурсов и выбор подходящего способа загрузки позволяют повысить производительность, улучшить UX и снизить вероятность ошибок при сборке.