---
schema_version: "1"
id: 03102828c2f734720d91d3991a01769271f90ce64c761bf14051bcd102a914d3
title: Image Components
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/genai/agentforce-mobile-sdk/references/ios/image-components-ios.md
canonical_url: https://developer.salesforce.com/docs/ai/agentforce-mobile-sdk/references/agentforce-mobile-sdk/image-components-ios.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 3436b333f6b9ba8d0b05cbf39b5ddd54d07deebd440782b2c7733d535dd2bb78
products:
  - Agentforce Mobile SDK
  - Agentforce and Einstein Generative AI
---
# Image Components

The Agentforce iOS SDK provides specialized SwiftUI components for handling image display in conversational AI interfaces. These components are designed to provide seamless image loading, caching, and display capabilities with comprehensive error handling and accessibility support.

## Component Overview

The image component system consists of two main components that work together to provide comprehensive image handling:

### SalesforceAsyncImage

A SwiftUI view component that provides asynchronous image loading with built-in progress indicators, error handling, and fallback support.

#### Key Features

- **Asynchronous Loading**: Non-blocking image loading with progress indicators
- **Error Handling**: Graceful fallback for failed image loads
- **Caching**: Intelligent image caching for performance optimization
- **Accessibility**: Full accessibility support with proper labels and descriptions
- **Customization**: Extensive theming and styling options

#### Usage Patterns

Use the SalesforceAsyncImage component for basic image display with built-in fallback support, or customize with your own styling and error handling.

### AgentforceImageProvider

A protocol-based system that enables custom image loading and caching implementations.

#### Key Features

- **Custom Image Sources**: Integration with any image service or storage system
- **Caching Strategies**: Flexible caching implementation for different use cases
- **Error Handling**: Custom error handling and fallback mechanisms
- **Performance Tuning**: Optimized image loading and processing
- **Security**: Support for secure image loading with authentication

#### Implementation Example

Implement custom image providers that integrate with your existing image services and provide custom loading, caching, and error handling logic.

## Integration Patterns

### Basic Image Display

Integrate the SalesforceAsyncImage component into your SwiftUI views for seamless image loading with built-in fallback support.

### Custom Image Provider Integration

Configure custom image providers in your AgentforceConfiguration to integrate with your existing image services and caching strategies.

### Advanced Image Handling

Implement advanced image handling with custom loading states, error handling, and performance optimizations for complex use cases.

## Component Benefits

### Performance

- **Efficient Loading**: Optimized image loading with minimal memory usage
- **Intelligent Caching**: Smart caching strategies for improved performance
- **Lazy Loading**: Images are loaded only when needed
- **Memory Management**: Automatic memory cleanup for large images

### User Experience

- **Smooth Loading**: Seamless image loading with progress indicators
- **Error Resilience**: Graceful handling of loading failures
- **Accessibility**: Full accessibility support for inclusive design
- **Responsive Design**: Adaptive image sizing for different screen sizes

### Developer Experience

- **Easy Integration**: Simple SwiftUI integration with minimal setup
- **Customizable**: Extensive customization options for different use cases
- **Type Safe**: Type-safe image handling with compile-time validation
- **Documentation**: Comprehensive documentation and examples

## Best Practices

### Image Optimization

- **Use Appropriate Sizes**: Load images at appropriate sizes for display
- **Format Selection**: Use appropriate image formats (JPEG for photos, PNG for graphics)
- **Compression**: Balance quality and file size for optimal performance
- **Lazy Loading**: Implement lazy loading for images outside the viewport

### Error Handling

- **Provide Fallbacks**: Always provide fallback content for failed loads
- **User Feedback**: Show clear error messages when images fail to load
- **Retry Mechanisms**: Implement retry logic for transient failures
- **Offline Support**: Handle offline scenarios gracefully

### Accessibility

- **Alt Text**: Provide meaningful alternative text for images
- **Screen Reader Support**: Ensure images are properly described for screen readers
- **High Contrast**: Test images in high contrast mode
- **Dynamic Type**: Ensure images work with iOS Dynamic Type

### Performance

- **Caching**: Implement appropriate caching strategies
- **Memory Management**: Monitor memory usage for large images
- **Loading States**: Show loading indicators for better user experience
- **Progressive Loading**: Consider progressive image loading for large images

## Next Steps

- **UI Components**: See [iOS UI Components](https://developer.salesforce.com/docs/ai/agentforce-mobile-sdk/references/agentforce-mobile-sdk/ui-components-ios.md) for complete component integration
- **Theming**: See [iOS Theming Overview](https://developer.salesforce.com/docs/ai/agentforce-mobile-sdk/references/agentforce-mobile-sdk/theming-overview-ios.md) for image component styling
- **Configuration**: See [iOS Configuration Overview](https://developer.salesforce.com/docs/ai/agentforce-mobile-sdk/references/agentforce-mobile-sdk/configuration-overview-ios.md) for image provider setup