In my android app I have a layout which contains many buttons and spinners. I have also added different layouts for the individual screen sizes (hdpi, xhdpi etc.). The problem is when testing my layout-hdpi in the emulator with the Nexus S (indicated as hdpi) it looks fine, but when testing it with Nexus One (also indicated with hdpi) the buttons are overlapping??
In the layouts all sizes are in dp!
So shouldn't I receive the same result with two devices in hdpi?
I had the same problem what you should do is obtain the screen height:width ratio and name it, well ratio.
so your ratio = height/width then instead of using the size of buttons or other elements in exact size in dp, take the size in the form of what part your element takes up in the view.
I think i confused you there, but its easy, see for example:
if you have an image that you want to add on the top half of the screen then dont say height=150dp or width=200dp you screen height was h so your image height would be h/2 and your width would then be h/ratio.
this would also work in the landscape mode, you wont have to find the buttons in the landscape mode because they were out of the screen.
Related
I have folders for xxhdpi and xxxhdpi and you know same density can have different screen sizes so I handled devices 5 inches devices by sw410dp but as soon as screen size reaches 6 inches(especially pixel devices - pixel 2 xl) the layout becomes messy, what sw or h should I try to support 6 inches devices
Thanks in advance!
Instead of creating a separate layout for each screen size, create one view with constraint layout. You can then align constraints as you like which will automatically resize the imageView, textView, or any view according to screen size.
Read this quickstart guide to build responsive UI with constraint layout.
We are working on an android app, and we have encountered an issue where devices in the same density bucket, i.e. "xxhdpi" do not all look the same, i.e. the Pixel and Pixel 2. We have a very image heavy UI and are using a Constraint view to organize the placement of several overlaid images. The Navigation drawer at the top of some of these screens further exacerbates the issue, as the margin is thicker with different densities on the same screen size and the rest of the app in squeezed into a smaller frame.
Heres an example of how different the Pixel and Pixel 2 are rendered:
Pixel 2 vs.
Pixel
We have tried making more specific layouts to match more specific ranges of DPI but the simulator groups the same devices together no matter what we try. These are the layout categories we've tried, where sw320dp for example refers to a minimum screen width.
Is there a way to combat this issue with constraint view features such as a constraint anchor or percentage constraints? Alternatively can we more narrowly define our layout categories or do something about the dp scale not being the same for similar devices? We have already consulted this page as well as numerous stack overflow posts: Android's Guide on Supporting Multiple Screen Sizes.
Any suggestions, comments, or specific questions welcome, thanks in advance to anyone who takes the time to read this.
This is my approach for getting the image to be shown completely without cropping on the edges, hope you get some kind of idea from this to tackle your situation.
Problem here is with wrap_content and match_parent, though pixel and pixel 2 falls in same category that is "xxhdpi" for getting the image from density bucket but they have little bit change with their width, pixel: 143.8 x 69.5 x 8.5 mm (5.66 x 2.74 x 0.33 inches) and pixel2: 145.7 x 69.7 x 7.8 mm (5.7 x 2.7 x 0.31 inches)
So I am guessing you probably have match parent for width and image scale type as center crop so image is scaled accordingly zooming in, so because they have different widths they are zoomed in more on one compared to the other.
I had similar kind of situation so what I did was used webview with match parent as width and wrap content as height then I displayed image in the webview
WebSettings settings = webView.getSettings();
settings.setLoadWithOverviewMode(true);
here setLoadWithOverviewMode actually zooms out and fits the image so no matter what you always see the whole image.
I'm writing an Android application and for testing I have a 9" tablet with a 1024 * 600 resolution. I only have a few activities and they are all broken into 3 fragments. The top fragment has a weight of .1 and contains the title of the activity. The middle fragment has a weight of .7 and is a scrollview of table rows returned from a query. The bottom fragment has a weight of .2 and contains all the buttons and textviews for user input. I used match_parent and wrap_content with relative layouts where possible. Nothing is hard coded and it looks right.
When I install the app on a 10" tablet with a resolution of 1280 x 800 the bottom fragment takes up more real-estate and there is more empty space around the textviews and buttons. It doesn't look right.
What do I do to accommodate these different resolutions with respect to fragment weights? I read other threads that mentioned creating different folders for images/files and different dimens.xml files. Those threads seemed to address resolutions issues for images and margins.
I want to be able to control how much weight is set based on a screen resolution (low, med, high, etc.).
Look in the official doc for resource specifiers. The things you're looking for are smallest width, available width, and available height. You can bundle resources for certain screen sizes into buckets based on values you define, and use those value in your layouts. Note that the values are in dp, not actual pixels.
I want to have a splash screen, something like a full picture, which doesn't crop in heigth or width on different smartphone screens.
Now I achieved a splash screen with android:scaleType="fitXY", but now the image is cropped on top or bottom or if the devices screen size changes to another aspect ratio it is cropped on the left and right.
What do I have to do? I've already read the android developer article Supporting Multiple Screens, but I don't get it how to achieve this.
A simple picture in the middle of the screen is just simple to get, but a picture which fills the screen is hard to get. Can you help me pls?
you should use center_crop per this purpose. From the doc
Scale the image uniformly (maintain the image's aspect ratio) so that
both dimensions (width and height) of the image will be equal to or
larger than the corresponding dimension of the view (minus padding).
There is no way to create one single asset and expect it to do not be cropper and to do not create black areas when the application is deployed in different screen sizes.
The android platform is designed to work dynamically with multiple screen sizes that any manufacture can change at any time, including new resolutions that you haven't thought about it yet.
Android can specify minimums for screen hight/width categories in which your resources will fall, but those are generics.
In order to use them, you will have to specify qualifiers in your drawables and create a different splash screen for every qualifier, as for example if you use drawable-w420dp, all the resources there will be used when the screen has a minimum width of 420dp (notice that are not pixels)
So you have two options:
You can use one single splash image and design margins of that image flexible enough in order to cope with the image being cropped in certain cases. You can play with different scaleTypes in your ImageView and take as a reference this website http://etcodehome.blogspot.co.uk/2011/05/android-imageview-scaletype-samples.html even though as commented before, "center-crop" will be your best shot.
You can programatically use a specific image for a specific resolution.
2.1 Put in the assets directory, all the splash images that you want for all the specific resolutions or aspect ratios that you want to use
2.1 Get the screen size of the device with Get screen dimensions in pixels
2.2 Now you can load from the assets the image that you want dynamically
Use the below code
android:layout_width="match_parent"
android:layout_height="match_parent"
which will fill the entire screen.
Try Using Width and Height of image to "match_parent"
i want to scale my android application, basically i developed it for 800x480 display with a AbsoluteLayout. This is necessary for my Application, i can't change it.
Now the Problem:
When i start my app in the Emulator the buttons disappear and the images are extremly large. I thought android would scale applications with a fixed size down by default, but it does not work. I already tried to manipulate the manifest but this did not work.
I use a ImageView component for graphics.
Targeting Android 2.1
Cheers
Felix
It is definitely not ideal to use AbsoluteLayout. But, if you want to just push through with it, you should switch the units of all your co-ordinates and sizes away from px (pixels) to dp (density independent pixels). You will have to scale all of your existing co-ordinates by a factor of 2/3 to start, since 1 dp = 1.5px at the density that your layout targets (hdpi).
You will need to explicitly specify the sizes of all your images and layouts. If, for example, you had a button that was 30px wide and 120px tall, then it will become 20dp wide and 80dp tall.
Of course, the images won't look great on smaller (mdpi) screens, since they will be scaled to 2/3 size. Also, some devices are fixed to landscape mode, where you will definitely encounter layout problems. So it's not pretty, but it may get you over the finish line, depending on your requirements.