이미지 UriSource 및 데이터 바인딩

StackOverflow https://stackoverflow.com/questions/20586

  •  09-06-2019
  •  | 
  •  

문제

다음과 같이 사용자 정의 개체 목록을 WPF 이미지에 바인딩하려고 합니다.

<Image>
    <Image.Source>
        <BitmapImage UriSource="{Binding Path=ImagePath}" />
    </Image.Source>
</Image>

하지만 작동하지 않습니다.내가 받고있는 오류는 다음과 같습니다.

"'UriSource' 속성 또는 'StreamSource' 속성을 설정해야 합니다."

내가 무엇을 놓치고 있나요?

도움이 되었습니까?

해결책

WPF에는 특정 유형에 대한 변환기가 내장되어 있습니다.이미지를 바인딩하면 Source 재산을 string 또는 Uri 값, 내부적으로 WPF는 이미지 소스 변환기 값을 다음으로 변환하려면 ImageSource.

그래서

<Image Source="{Binding ImageSource}"/>

ImageSource 속성이 이미지에 대한 유효한 URI의 문자열 표현인 경우 작동합니다.

물론 자체 바인딩 변환기를 롤링할 수도 있습니다.

public class ImageConverter : IValueConverter
{
    public object Convert(
        object value, Type targetType, object parameter, CultureInfo culture)
    {
        return new BitmapImage(new Uri(value.ToString()));
    }

    public object ConvertBack(
        object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotSupportedException();
    }
}

다음과 같이 사용하세요.

<Image Source="{Binding ImageSource, Converter={StaticResource ImageConverter}}"/>

다른 팁

이 기사 Atul Gupta의 여러 시나리오를 다루는 샘플 코드가 있습니다.

  1. XAML의 Source 속성에 대한 일반 리소스 이미지 바인딩
  2. 리소스 이미지 바인딩(코드 숨김)
  3. Application.GetResourceStream을 사용하여 코드 숨김에 리소스 이미지 바인딩
  4. 메모리 스트림을 통해 파일 경로에서 이미지 로드(데이터베이스에서 블로그 이미지 데이터를 로드할 때도 동일하게 적용 가능)
  5. 파일 경로에서 이미지를 로드하지만 파일 경로 속성에 대한 바인딩을 사용합니다.
  6. 종속성 속성을 통해 내부적으로 이미지 제어 기능이 있는 사용자 정의 컨트롤에 이미지 데이터 바인딩
  7. 5번 항목과 동일하지만 파일이 하드 디스크에 잠기지 않도록 보장합니다.

하위 요소를 사용하는 대신 간단히 Source 속성을 설정할 수도 있습니다.이렇게 하려면 클래스에서 이미지를 비트맵 이미지로 반환해야 합니다.다음은 내가 수행한 한 가지 방법의 예입니다.

<Image Width="90" Height="90" 
       Source="{Binding Path=ImageSource}"
       Margin="0,0,0,5" />

클래스 속성은 간단히 말해서 다음과 같습니다.

public object ImageSource {
    get {
        BitmapImage image = new BitmapImage();

        try {
            image.BeginInit();
            image.CacheOption = BitmapCacheOption.OnLoad;
            image.CreateOptions = BitmapCreateOptions.IgnoreImageCache;
            image.UriSource = new Uri( FullPath, UriKind.Absolute );
            image.EndInit();
        }
        catch{
            return DependencyProperty.UnsetValue;
        }

        return image;
    }
}

값 변환기보다 작업이 조금 더 필요할 수 있지만 이는 또 다른 옵션입니다.

구현이 필요합니다. IValueConverter URI를 이미지로 변환하는 인터페이스입니다.IValueConverter의 변환 구현은 다음과 같습니다.

BitmapImage image = new BitmapImage();
image.BeginInit();
image.UriSource = new Uri(value as string);
image.EndInit();

return image;

그런 다음 바인딩에서 변환기를 사용해야 합니다.

<Image>
    <Image.Source>
        <BitmapImage UriSource="{Binding Path=ImagePath, Converter=...}" />
    </Image.Source>
</Image>

여기서 선택한 답변의 문제점은 앞뒤로 탐색할 때 페이지가 표시될 때마다 변환기가 트리거된다는 것입니다.

이로 인해 새 파일 핸들이 계속 생성되고 파일이 아직 사용 중이기 때문에 파일 삭제 시도가 차단됩니다.이는 프로세스 탐색기를 사용하여 확인할 수 있습니다.

어느 시점에서 이미지 파일이 삭제될 수 있는 경우 다음과 같은 변환기를 사용할 수 있습니다.XAML을 사용하여 System. Drawing.Image를 System.Windows.Image 컨트롤에 바인딩

이 메모리 스트림 방법의 단점은 이미지가 매번 로드되고 디코딩되며 캐싱이 발생할 수 없다는 것입니다."이미지가 두 번 이상 디코딩되는 것을 방지하려면 메모리 스트림을 사용하지 않고 URI의 소스 속성을 할당하십시오"소스 :"XAML을 사용하는 Windows 스토어 앱에 대한 성능 팁"

성능 문제를 해결하기 위해 리포지토리 패턴을 사용하여 캐싱 계층을 제공할 수 있습니다.캐싱은 메모리 문제를 일으킬 수 있는 메모리에서 발생하거나 앱이 종료될 때 지워질 수 있는 임시 폴더에 있는 축소판 파일로 발생할 수 있습니다.

당신은 사용할 수 있습니다

ImageSourceConverter 클래스

당신이 원하는 것을 얻기 위해

    img1.Source = (ImageSource)new ImageSourceConverter().ConvertFromString("/Assets/check.png");
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top