Wugenois
Topic Author
Posts: 15
Joined: 07 Apr 2020, 10:22

Re: Pixelated small images and circles

15 Dec 2020, 14:31

The images are added in a folder called "Content" in the build folder (with sub-folders for images' categories), and then this class load the images for the ViewModel:
namespace TMPC
{
    public static class LoadImage
    {
        /// <summary>
        /// Load an image in Content folder
        /// </summary>
        /// <param name="folderName"></param>
        /// <param name="fileName"></param>
        public static ImageSource  GetImageSource(string folderName, string fileName)
        {
            var filePath = Path.Combine("Content", folderName, fileName);
            if (!File.Exists(filePath))
            {
                return null;
            }

#if NOESIS
            var fileData = File.ReadAllBytes(filePath);
            var tex = new Texture2D(2, 2, TextureFormat.RGBA32, false);
            tex.LoadImage(fileData); 

            return new TextureSource(tex);

#else
            return new BitmapImage(new Uri($"pack://siteoforigin:,,,/{filePath}"));
#endif
        }

        /// <summary>
        /// Load an image in Content folder
        /// </summary>
        /// <param name="filePath"></param>
        public static ImageSource GetImageSource(string filePath)
        {
            if (!File.Exists(filePath))
            {
                return null;
            }

#if NOESIS
            var fileData = File.ReadAllBytes(filePath);
            var tex = new Texture2D(2, 2, TextureFormat.RGBA32, false);
            tex.LoadImage(fileData); 

            return new TextureSource(tex);

#else
            return new BitmapImage(new Uri($"pack://siteoforigin:,,,/{filePath}"));
#endif
        }

        /// <summary>
        /// Get Path for image
        /// </summary>
        /// <param name="folderName"></param>
        /// <param name="fileName"></param>
        /// <returns></returns>
        public static string GetPath(string folderName, string fileName)
        {
            return Path.Combine("Content", folderName, fileName);
        }
    }
}
This class is used in the ViewModels, for example like this :
                msg.SenderImg = LoadImage.GetImageSource(msgR.PathImgSender);
In xaml, the images are displayed with a binding :
            <Border Grid.Column="1" Grid.RowSpan="2" HorizontalAlignment="Center" VerticalAlignment="Center" Width="45" Height="45" CornerRadius="45">
                <Border.Background>
                    <ImageBrush ImageSource="{Binding SenderImg}"/>
                </Border.Background>
            </Border>
There is no "noesis:Dependency" in xaml, the images are not used in WPF or Unity, only after the project is built.

for information, I am only the integrator working in the xaml file so I didn't write the C#
Several developpers write the ViewModels, not always use the LoadImage class but it seems they always use the "Texture2D(TextureSource)"

Tags:
 
User avatar
sfernandez
Site Admin
Posts: 2254
Joined: 22 Dec 2011, 19:20

Re: Pixelated small images and circles

15 Dec 2020, 16:30

From your code:
var tex = new Texture2D(2, 2, TextureFormat.RGBA32, false);
You are creating the textures without mipmaps, so I guess if you just pass there a true Unity will autogenerate the mipmaps.
 
Wugenois
Topic Author
Posts: 15
Joined: 07 Apr 2020, 10:22

Re: Pixelated small images and circles

15 Dec 2020, 19:01

oh thank you, I didn't know this. I will try that and share it with the team.
 
User avatar
jsantos
Site Admin
Posts: 3138
Joined: 20 Jan 2012, 17:18
Contact:

Re: Pixelated small images and circles

15 Dec 2020, 20:21

Circles fixed :
Changing the "Offscreens Sample Count" to "8x" fixes the pixelation.
By the way, multisampling on the offscreens can be expensive. We always recommend 1x and enabling PPAA.
 
Wugenois
Topic Author
Posts: 15
Joined: 07 Apr 2020, 10:22

Re: Pixelated small images and circles

16 Dec 2020, 11:04

thank you, passing the bool mipmaps parameter to true removes the aliasing and blurs the images (similarly to images added in Unity). I will just enlarge a bit the avatar picture for better resolution of the image. The mipmaps blurs a bit the large image of profile too (which that is normal)

I reduced the "Offscreens Sample Count" to 4x and will reduce to 1x later if we will not need it anymore.
Attachments
two-mipmaps.PNG
smallRound-mipmaps.PNG
smallRound-mipmaps.PNG (6.51 KiB) Viewed 863 times

Who is online

Users browsing this forum: No registered users and 2 guests