Splash Screen Background for 18:9 Aspect Ratio (Samsung Galaxy S8) - android

I have implemented a splash screen in android with a full image background using a drawable resource. This displays correctly on traditional screen aspect ratios. When I now run it in Samsung Galaxy S8 which has an aspect ratio of 18:9, the background image get's stretched vertically.
I shy away from using a layout as my splash screen as there will be a delay for the image to show up.
One thing I can think of is if we have a specific image sized for 18:9 but then how can I make it so that android will pick that specific image based on certain aspect ratio?

Use screen aspect qualifier and make a different layout for long screen devices and Android will detect it.

This is not a perfect answer but it works in situation where you don't care about little bit cropping of image, add
android:scaleType="centerCrop"
in imageview tag of splash xml.

Related

What is the full screen image sizes for an Android app? (Android Studio)

I have a background image in an activity, its size was set to 1280x920, as adviced in Background image crashes android. This works perfectly.
I also have a full screen activity (sticky immersive), with the same configuration, the image is "stretched" out vertically. What should be the size of the image so that there is no scaling or stretching at all? (While the image occupies the full screen, off course)
It depends on screen. Android supports multiple screens. That's way in project we have x-hdpi, hdpi, xx-hdpi folder. As source:
https://developer.android.com/guide/practices/screens_support.html
https://developer.android.com/training/multiscreen/screensizes.html
There is no one size. Every Android device has different screen sizes. What you need to do instead is provide multiple sizes and accept some stretching or shrinking on odd sized devices. See https://developer.android.com/guide/practices/screens_support.html for more advice.

Use non-fullscreen image for splash screen

I'm using the approach described in Creating a Splash Screen. It uses a resource (layer-list) with a background and an image. That is used as windowBackground in a theme and this theme is set on an activity. Now I created all drawable folders and put images of different sizes in there.
Now I have these issues:
starting app in landscape on smart phone leads to a black splash screen (on tablet it stays in portrait)
images from drawable-land folder are not taken
the size of the image should be bigger on some devices
In which resolution should I provide the images? The image should have one third of the width of the display width. How can I manage that?
I tried to use this table as reference and calculating the width by taking one third of portrait size. E.g for HDPI, one third of 480 is 144, but the tablet has a width of 800 (not 480). As consequence the image is too small.
Furthermore I don't think that 9-patch files could help me here. It only describes the enlargement, but then the lowest common denominator would be an image of size LDPI ... Enlargement doesn't work so good for a text logo (custom font).
What are my options?
Edit:
starting app in landscape on smart phone leads to a black splash screen (on tablet it stays in portrait):
Adding a break point and the splash screen is shown instead of a black screen. Building an apk and installing on the smartphones works. Debug mode not.
images from drawable-land folder are not taken
Added ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation) and now they are.
But I still have no clue how to define an image, which does take a certain amount on the screen with this approach. For now I supplied a bigger image (xhdpi into hdpi) ...
you should put those images in mipmap folder not at drawable. You have to crop image into three size hpdi,ldpi and mdpi. These theree are best for any android devices.(Fits for all). If you want to display image in full screen then you can define android:background="#mipmap/image" instead of android:windowBackground="#mipmap/image" . For preventing splahscreen from being landscape you can define screen orientation inside activity like below:
<activity android:name=".Splash_Screen"
android:screenOrientation="portrait">
If you doesn't know the required resolution for image ldi,hdpi and mdpi then there's question asked on stackoverflow, google it!! Hope it helped and sorry for poor english!!

android sdk. Background image fits. Foreground images too small

I have my view built to fit a phone screen 800x480. The background PNG shows up as a perfect fit. I have a bunch of imageViews of PNGs sitting on the view that should line up perfectly on any screen that is that size.
When tested on my phone, it works fine. However, when tested on my 7" tablet that has the same screen resolution, the backdrop fits as expected, but the imageViews are all too small.
Why wouldn't they fit the same way, considering the resolution is the same?
Could it be the aspect ratio of the second screen?
I know that when I developed an app on my Note I, it showed up differently on almost every other device with the same resolution, on account of the aspect ratio of the Note I being so wide.
Can you check and see the actual pixel ratio of your second device?
Also, is it showing the on screen action bar thing? The back/menu/etc bit? Because that could be because of the version you're targeting is less than the version of your 7" device, causing it to run in backwards compatibility mode. That'll squish your layout a bit as well.
I have a partial answer to this.
I couldn't find a way to set the size of the PNG itself. Only the ImageView height and width. So I set those to 90dp. I tried px first. Don't do that. It's no good.
But, check this out... Forcing the size in dp made the images show correctly on the tablet, but enormous on the phone! So, it more or less reversed my problem.
But at least I know what the problem is now. I just have to create a secondary view for 7" screens to set the imageView sizes. Or, I'm thinking there must be a way to do this problematically. Before the view launches, detect the screen size, if it's not a phone, change the height and width accordingly.
That should work because, as I mentioned in an earlier comment, the relative positioning is perfect. It's just the size that's incorrect.

How to properly implement full-screen images perfectly stretching on all screens?

When implementing a splash image which has such a design that image cannot be skewed or cropped if the device screen is of different resolution or size, how to perfectly implement this? Image must be a real full-screen without black background due to different aspect ration.
Shall we create splash image for every device screen size? This is how we do at the moment and it's pretty much work. So we go to Android developer support screen advise page to know what images sizes we need. you see, there are a lot of them.
Is there a better and quicker solution?
just get the splash screen in 1920*1080 and put in xxhdpi android system will auto ajust it
Stretch occurs when when try to fit an image into an image view of different Aspect-Ratio.
Create 2 or 3 images for major Aspect-Ratio and then use android:scaleType="fitXY" on your image view, for devices that uses different aspect-ratio than you specify it won't differ a lot so you don't get a noticeable stretch.
Most common aspect-ratio are:
2:1 // ultra wide ex. 800*400 screen
16:9 // HD wide ex. 1920*1080 , 1208*720 , 720*450
16:10 // wide
4:3 // old tv square-like
If you can prepare a image resolution 1920*1280 and put in drawable-xxhdpi, it would fit to any screen
Try to create a 9-patch image and use it as a background of the splash activity/view/whatever. Put your fixed size logo (or whatever you want to display) in the non-scalable part of the 9-patch and let the other areas stretch to fill the view. Note that the non-scalable area (e.g. your logo) should have size that will fit the smallest display you want to support.

How to set ImageView to apply image size to screen resolution in Android

I have an application that uses ImageViews to show some pictures. The image sizes are 320x480px.
I use some animation to move these pictures to the center of the screen and when the phone has the resolution of 320x480, it works great.
However, when I tried it on emulator with the resolution of 240*320, there were some problems:
The ImageView is still 320x480 so it looks way too big
The animation that uses the screen resolution can't move the pictures to the center, it is at least 20-30 px off
I learned the when dealing with pictures, Android dynamically changes resolution of them to make the images fit in. How could I set that these images should be resized according to screen resolution?
It's hard to say what's wrong without seeing any code. Android resizes images from res/drawable according your screen resolution (ldpi, mdpi, hdpi, etc.). If you place pictures in res/drawable-nodpi, they will not be scaled. You could also use the density dependent folders res/drawable-ldpi, res/drawable-mdpi, res/drawable-hdpi etc. You should definitely read the docs here.
I believe that android:adjustViewBounds="true" and android:scaleType="fitCenter" is what I needed. The ImageViews are scaled down to 240x320 and the animation works well.
Interesting that the upscaling is not proper. When I used in the emulator at 480x800, my ImageView is scaled up to 480x720 so I get black edges. Any idea for that?

Categories

Resources