1. Similarities

Both RawImage and Image are components that can be used to display pictures

Two, the difference

2.1 Difference

The Image component is mainly used to display Sprite or 2D images in other common formats,
while RawImage is more suitable for displaying unprocessed Texture2D textures or textures with special formats.

2.2 Advantages of RawImage

RawImage can use Texture2D directly, while Image uses Sprite
to demonstrate the code

//从图片的路径读取bytes字节流
byte[] bytes = File.ReadAllBytes(photoPath);

//byte[] 转 Texture2D 
Texture2D tex = new Texture2D(1, 1);
tex.LoadImage(bytes);

//可以直接把Texture2D  赋给 RawImage
rawImage.texture = tex;
            
// Texture2D 转 Sprite           
Sprite sp = Sprite.Create(tex , new Rect(0, 0, tex.width, tex.height), Vector2.zero);                    
//把Sprite赋给image           
image.sprite  = sp；

可以看到从一个文件路径出发，到显示到图片组件，Image比RawImage多了一步Sprite.Create()转化操作，而这一步在图片比较大，比如4M或以上，是可以明显感到耗时，大概耗时会1秒以上，看机器。所以这种需求可以选择RawImage

2.3 Advantages of Image

Image supports advanced display effects such as zooming, stretching, and rotation. There is also preserveAspect property, which can be displayed proportionally. And using RawImage, you have to calculate the ratio yourself according to the aspect ratio of Texture2D

3. Color space conversion

Sometimes, we want to use RenderTexture to convert the camera screen into a picture, as shown below

			//把画面转到Texture2D t；
			Camera camera = self.avatarCameraGo.GetComponent<Camera>();
            RenderTexture.active = camera.targetTexture;
            var width = camera.targetTexture.width;
            var height = camera.targetTexture.height;
            Texture2D t = new Texture2D(width, height,TextureFormat.RGBA32,false);
            t.ReadPixels(new Rect(0, 0, width, height), 0, 0);
            t.Apply();

            RenderTexture.active = null;

If it is displayed directly, it is possible that after displaying, the picture will be black and different from the original picture. As shown in the figure below
insert image description here
, but the original picture is like this.

At this time, we need to perform color space conversion on Texture2D, as shown in the figure below. Just convert the color space

 			var newTex = t;
            if (QualitySettings.activeColorSpace == ColorSpace.Linear)
            {
                newTex = self.LinearToGammaSpace(t);
            }

 		  /// <summary>
        /// linear颜色空间转换到gamma颜色空间
        /// </summary>
        private static Texture2D LinearToGammaSpace(this DlgCreCharacNew self,Texture2D texture)
        {
            Texture2D result = new Texture2D(texture.width, texture.height, TextureFormat.RGBA32, false);
            Color[] pixels = texture.GetPixels();

            for (int i = 0; i < pixels.Length; i++)
            {
                Color color = pixels[i];
                color.r = Mathf.LinearToGammaSpace(color.r);
                color.g = Mathf.LinearToGammaSpace(color.g);
                color.b = Mathf.LinearToGammaSpace(color.b);
                color.a = Mathf.LinearToGammaSpace(color.a);
                pixels[i] = color;
            }

            result.SetPixels(pixels);
            result.Apply();

            return result;
        }

The difference between Unity RawImage and Image