So I am using phonegap to build an app. I have splash screen that I am displaying and is listed in config.xml like this.
<gap:splash src="splash/android/ldpi.png" gap:platform="android" gap:density="ldpi" /> <gap:splash src="splash/android/mdpi.png" gap:platform="android" gap:density="mdpi"/>
<gap:splash src="splash/android/hdpi.png" gap:platform="android" gap:density="hdpi" />
<gap:splash src="splash/android/xhdpi.png" gap:platform="android" gap:density="xhdpi" />
The problem is that when I test it on my Samsung galaxy skyrocket 2 phone it shows the "hdpi.png" image and when I test it on my Samsung galaxy 10 inch tablet it shows the mdpi.png image.
Shouldn't this be the other-way around?
Based on android specification (see the picture above) my mdpi.png is of size 320x480 and hdpi.png as 480x800 so the mdpi.png appeared stretched in the tablet.
How to get around with this? Do you think I should be defining say multiple splash screen sizes for mdpi e.g. for normal screen 32x480, large screen 480x800 etc. But if we go by this approach then how to define this in config.xml? Because there we are filtering based on only gap:density="mdpi" or should we be adding sizes also and hence add multiple entries to same gap:density="mdpi" ?