Uncommon png file iOS display

Question

In this post, i was wondering why my png files were badly displayed on retina displays.

I finaly found that the problem came from the PNG file itself: when I open it and save it again with photoshop or something else, the problem disapear.

As this post proposed, I used sips command to see what exactly were formed my PNG file. I have the original-image.png (with the glitch) and the photoshoped-image.png

The command

sips original-image.png -g all

Gives me

  pixelWidth: 256
  pixelHeight: 256
  typeIdentifier: public.png
  format: png
  formatOptions: default
  dpiWidth: 72.000
  dpiHeight: 72.000
  samplesPerPixel: 3
  bitsPerSample: 8
  hasAlpha: no
  space: RGB

And

sips photoshoped-image.png -g all

Gives me

  pixelWidth: 256
  pixelHeight: 256
  typeIdentifier: public.png
  format: png
  formatOptions: default
  dpiWidth: 72.000
  dpiHeight: 72.000
  samplesPerPixel: 4
  bitsPerSample: 8
  hasAlpha: yes
  space: RGB
  profile: HD 709-A

So 3 differences :

samplePerPixel
hasAlpha
the photoshoped file has a profile.

But these properies are read-only in sips and I wonder how can I change them to understand exactly where the bug comes from.

Any idea ?

score 1 · Answer 1 · answered Jul 23 '12 at 13:09

1

So using sips you can output a different file. Take the photoshop file and start modifying it. First remove the profile, then remove the alpa channel (which will affect the first two variables).

Its quite possible that this image works. PNG has many options, and the original image may have some other feature not visible using these tools. Photoshop is obviously re-writing the image completely, using the RGB values as the only common attribute between the files.

I suspect that when you do the above, that image will work too. There is just something odd about the originals.

In any case, you make it easier on iOS if you use pngs with an alpha channel, as it will convert them to have one if the base image does not have one.

answered Jul 23 '12 at 13:09

David H

40,852
12
92
138

How can I remove the alpha channel ? `sips 1.png -s hasAlpha no` doesn't work, cause hasAlpha is read-only (https://developer.apple.com/library/mac/#documentation/Darwin/Reference/ManPages/man1/sips.1.html) – Martin Jul 23 '12 at 13:38
I believe you can use samplesPerPixel=3 to do this, or something like that. Google around on using sips or experiment - its a bit daunting at first but since its command line you can work quickly. To view a new image just say "open " from Terminal, it will open the image in Preview. – David H Jul 23 '12 at 14:10
Hum... it seems that samplesPerPixel is a read-only property too. – Martin Jul 23 '12 at 15:46
Well, the point I was trying to make is that SOME command line tool will let you do this. ImageMagik for sure, maybe some png command line tool. You can get binaries of most of these tools so no need to build from scratch. I thought you could use sips to convert but only formats. Its possible if you convert to bmp or sgi then back to png it will add an alpha channel but experimentation is the only way to find out. – David H Jul 23 '12 at 19:16

score 0 · Answer 2 · answered Sep 05 '12 at 18:31

On some files, this works:

sips -s format png '/Volumes/HD/Optimized PNG/TXT - Section Depth copy.png' --out '/Volumes/HD/Optimized PNG/TXT - Section Depth copy-.PNG' /Volumes/HD/Optimized PNG/TXT - Section Depth copy.png /Volumes/HD/Optimized PNG/TXT - Section Depth copy-.PNG mis-bhayward61p-swk:~ zav$

But also, sometimes it doesn't:

sips -s format png --setProperty hasAlpha 0 '/Volumes/HD/Optimized PNG/Subsection copy 2/Section Depth Text.png' --out '/Volumes/HD/Optimized PNG/Subsection copy 2/Section Depth Text-.PNG' /Volumes/HD/Optimized PNG/Subsection copy 2/Section Depth Text.png Error: Cannot do --setProperty hasAlpha on file /Volumes/HD/Optimized PNG/Subsection copy 2/Section Depth Text-.PNG mis-bhayward61p-swk:~ zav$

Hope this gets you a little farther.

Uncommon png file iOS display

2 Answers2