Wpf 원본 사진 목록을 가져와 사진첩 만들기

🖥️ UI/UX 프로그래밍 Q&A WPF Q&A
1

안녕하세요. :smile:

WPF에서 스마트폰 사진첩처럼 작은 크기의 이미지 목록을 만들려고 합니다.

코드로 구현할 경우

new BitmapImage(new Uri(imagePath, UriKind.RelativeOrAbsolute));

문자열을 통해 바인딩할 경우

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

그 외에도 기본적으로 쉽게 할 수 있는 방법을 사용하고 있습니다.


여기서 제가 궁금한 것은 사진첩 목록을 만들 때…

image

원본 이미지를 통해 작은 썸네일을 만들 때 내부적으로 어떤 처리를 해주는 것이 좋을까요?
(기본적으로 비동기 처리 이미지 로드)

  • 컨트롤(Image)에서 Width Height 사이즈 조절만으로도 충분하다.
  • 원본 이미지를 작은 사이즈로 압축한다.
  • 원본 이미지를 작은 사이즈로 압축해서 임시 파일로 관리한다.

제가 당장 떠오르는 것은 여기까지 인데요.
혹시 여러분은 어떻게 생각하시는지 궁금합니다.

조언 많이 부탁드립니다. :smile:

3개의 좋아요
2

원본 이미지의 용량이 천차만별이므로 썸네일을 새로 만들어줘야 한다고 생각합니다.

생성한 썸네일 이미지를 이미지 경로에 저장한다

일반적으로 Thumbnail 디렉토리에 해당 이미지의 썸네일이 있을 경우 그것을 사용, 없을 경우 생성, 썸네일은 있으나 원본 이미지가 이동/삭제가 되었을 경우 썸네일 삭제 하는 방식을 사용합니다.

생성한 썸네일 이미지를 임시 경로에 저장한다

이렇게 할 경우 원본이미지의 경로를 관리하는 메타정보가 필요하며, 이 메타정보를 이용해서 임시 경로에 썸네일을 저장하고 썸네일을 찾습니다.

두가지 방식 다 괜찮다고 생각하고, 목적에 따라 선택하면 될 듯 합니다.

※ 아마 많이 사용하는 기능이니까 썸네일 관련 라이브러리가 존재하지 않을까도 싶네요.

1개의 좋아요
3

@dimohy 답변 감사드립니다. :smile:

말씀해주신대로 생성한 썸네일 이미지를 임시 경로에 저장하는 방식으로 처리했습니다!

그리고 혹시 방식에 관해서 필요하신 분들을 위해…
제가 처리한 부분 소스코드도 남겨두도록 하겠습니다.

private async Task<BitmapImage> GetImage(string imagePath)
{
    await Task.Delay(1);

    string name = Path.GetFileName(imagePath);
    string savePath = Path.Combine(GetSavePath(), name);

    bool isExistsThumbnail = false;
    while (!isExistsThumbnail)
    {
        if (!File.Exists(savePath))
        {
            Bitmap sourceImage = new Bitmap(imagePath);

            int width = 160;
            int height = 90;
            Size resize = new Size(width, height);
            Bitmap resizeImage = new Bitmap(sourceImage, resize);
            resizeImage.Save(savePath, ImageFormat.Png);
            continue;
        }
        isExistsThumbnail = true;
    }
    return new BitmapImage(new Uri(savePath, UriKind.RelativeOrAbsolute));
}

private static string GetSavePath()
{ 
    string localPath = Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData);
    string devflowPath = Path.Combine(localPath, "DevFlow/Images/HistoryThumbnails");
    return devflowPath;
}

감사합니다.

2개의 좋아요