Apps Device Screen Density

[Nandroider]

Hello All,
First time posting so go easy. I have searched the entire internet, twice I think, trying to figure out how Android handles different screen densities. I have read the official documentation and about a million different posts, but I think I must have missed a fundamental concept somewhere along the way. My problem is simple and is more theoretical than practical, so please don't ask why I would want to do such a thing...

I have a phone and a 7" tablet, both 480x800, with 240dpi / 131dpi respectively. In my main layout, I have a background image with a burned in spot for password entry. I am trying to overlay a textview positioned perfectly on the image for nice effect. All looks well in the Eclipse design window, but when deployed to the devices, it's always one or the other depending on how I tweak my margins/padding.

It was my understanding that as long as I use dp/dip, the system would scale accounting for different dpi, especially on devices with the same resolution. I hope I have explained my situation in enough detail, and thanks for your help!

 

[jonbonazza]

Moved to the Application Development forum for better hits. =)

 

[wubbzy]

can you post your layout sample?

 

[Nandroider]

Hey wubbzy, thanks for your quick reply. There's not much of a layout but I have included it anyway. I think I just missed Android101. I've written apps before but they were always deployed on the same devices. The real world seems scary. Here's my layout:

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:background="@drawable/background_image"
androidrientation="vertical">​

<TextView

android:id="@+id/textView1"

android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="200dp"
android:layout_marginTop="230dp"
android:text="password"/>​

</LinearLayout>​

Just a single textview(password field) that I'm trying to position in a linear layout, but nicely mapped onto the backround image. I don't care about the image being stretched, I just want correct positioning on the image. I have finally got it figured out for my 2, now 3, devices but had to create custom device configurations in the Eclipse designer with corresponding alternate layout folders. This makes me think that I have to create a layout for every combination of size/density. Why when both devices are 480x800, couldn't my single default layout configuration that works on the phone, be displayed proportionately on the tablet? Thanks again.​

 

[wubbzy]

Why don't you use

<TextView
android:background="..."
/>

You can stretch image by changing padding/margins of textView

...or maybe I misunderstood? Please allow me to repeat your question in that case -
You would like to create a textview centered on an image?

Is that question correct?

...one more suggestions (edit) since I know I could be offline:
<RelativeLayout>
<ImageView ...>
<TextView
alignTop="@ImageViewID"
...more alignment options if required...
</TextView>
</RelativeLayout>

 

[Nandroider]

I have tried both these solutions with no result. The textView does not have to be centered on the image. It must be positioned where there is a spot for it within the background image.

I'm just realizing that if i use pixel units (px) for my padding/margins/textsize then the layout displays the same on both the phone and tablet, which makes sense, but I thought using pixels was frowned upon. Do I need to make alternate layouts for every device screen spec if they have different resolutions?

 

[wubbzy]

One thing I'm certain about is you can't do this with layout XML, which expects things to be quite static. If you go the route of create density based layouts, you may end up with lot of device dependent layout. Unless as you said "just a theoretical issue", in which case you should be alright since you're just experimenting.

As far as eclipse comparison between messed up device layout and perfect eclipse layout you could try to play with ADT eclipse device density on top-left.

PS: Whether XML or dynamic I strongly suggest relative layout over linear, as it would give you more control on where to place elements.

Pixel vs device independent pixel is certainly frowned upon, but tell you the truth project requirements determine what needs to be used. Call is certainly yours to make. Its not so bad using pixels, but reason they're looked down upon is different devices have different densities and hence if you were using pixels you'll have to code in some logic to appropriately position layout elements. Another problem is that density is no measure of screen size or DPI, manufacturers are free to change it.

float scale = getBaseContext().getResources().getDisplayMetrics().density;
return (int) (pixel * scale + 0.5f);

converts pixels to DIP, change 'pixel' var to your input or whatever value you want to play with.

Usual way to accomplish what you're trying to do is split background image and 'burned in hole' into different image files. Use background in relative layouts and use burned in as textview/imageview to position with various 'alignment' options.

Yet another option is do basic XML layout (i.e. don't worry where they are and how it looks in eclipse) and 'adjust' it in code after inflating. Give you more precise and dynamic control.

Hopefully this helps....&...I've still resisted the question why, I hope?

 

[Nandroider]

Wow thanks wubbzy! Your explanation above has helped me more than you know. I just figured that using device independant pixels in my xml layout would scale everything on a different screen density, with no extra work involved, again, not caring about image quality, etc. Thanks for clearing this up....and for not asking why

 

[alostpacket]

You may also want to check out:

Draw 9-patch | Android Developers