locked
Loading scaled images in code behind

    Question

  • Hello,

    I try to load images based on the dpi scaling. Therefore I added several pngs into a folder Assets/resources. Most images have scaled versions and are named something.scale-100.png, something.scale-140.png and something.scale-180.png. All files have Content as their build-setting in properties.

    I went through the folder and wrote debug messages to see whether the files are there. That worked.

    var folder = await Windows.ApplicationModel.Package.Current.InstalledLocation.GetFolderAsync("Assets");
                folder = await folder.GetFolderAsync("resources");
                foreach (var file in await folder.GetFilesAsync())
                {
                    Debug.WriteLine(file.Name + ": "+file.DisplayName);
                }


    I tried the following to actually load the files:

            private static async Task<BitmapImage> LoadImage(StorageFile file)
            {
                BitmapImage bitmapImage = new BitmapImage();
                FileRandomAccessStream stream = (FileRandomAccessStream)await file.OpenAsync(FileAccessMode.Read);
    
                bitmapImage.SetSource(stream);
    
                return bitmapImage;
    
            }
    
    ...
    Uri imageUri = new Uri("ms-appx:///Assets/resources/icdozr.png");
    var imageFile = await Windows.Storage.StorageFile.GetFileFromApplicationUriAsync(imageUri);
    BitmapImage bitmapImage = await LoadImage(imageFile);
    ImageBrush imageBrush = new ImageBrush();
    imageBrush.ImageSource = bitmapImage;

    That results in an exception that the files could not ben found, indicating the system is not adding the qualifier .scale-100 to it (which is the default scaling for my system).

    100 to the file path to see whether that works. The call to GetFileFromApplicationUriAsync actually works, and the StorageFile property isAvailable is set to true, but the system throws a FileNotFoundException at file.OpenAsync indicating, that the syntax for the filename is wrong. (HRESULT: 0x8007007B).

    Do you have a suggestion for me what might be the issue?

    Thanks

    Andreas

    Thursday, May 22, 2014 3:14 PM

Answers

  • Hi Andreas,

    Your code looks correct and when I copy & paste it into my test app it works as expected: on a scale-100 system I get my scale-100 image and on scale-140 system I get the scale-140 image. Since I didn't add a scale-180 image the scale-140 image loaded on the scale-180 system.

    I'd double check that the images are ending up in the Appx package and have the correct names.

    If they are, does this occur in all projects or just one? Can you reproduce it in a trivial sample? If so can you share it to us on your OneDrive?

    • Marked as answer by andreasbalzer Saturday, May 24, 2014 7:16 PM
    Friday, May 23, 2014 6:04 AM
    Owner

All replies

  • Hi Andreas,

    Your code looks correct and when I copy & paste it into my test app it works as expected: on a scale-100 system I get my scale-100 image and on scale-140 system I get the scale-140 image. Since I didn't add a scale-180 image the scale-140 image loaded on the scale-180 system.

    I'd double check that the images are ending up in the Appx package and have the correct names.

    If they are, does this occur in all projects or just one? Can you reproduce it in a trivial sample? If so can you share it to us on your OneDrive?

    • Marked as answer by andreasbalzer Saturday, May 24, 2014 7:16 PM
    Friday, May 23, 2014 6:04 AM
    Owner
  • Thanks for your reply.

    Unfortunately there was an issue with the filename. Some filenames had //'s instead of /. The code above works indeed.

    Saturday, May 24, 2014 7:18 PM