TextView on different displays - android

Help to understand please.
I need to show up in a specific box.
I do it like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/fon"
tools:context=".MainActivity" >
....
<TextView
android:id="#+id/textView3"
android:layout_width="200dp"
android:layout_height="210dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:includeFontPadding="false"
android:lineSpacingMultiplier="0.8"
android:textAlignment="center"
android:textColor="#color/black"
android:textSize="20sp" />
....
</RelativeLayout>
Everything works at four inch screen well but if take a big diagonal, it will be bad. At increase in the screen the textView size doesn't change.
I use "dp" and "sp", instead of static "px", but does not work...
Why Is this happening ?
screenshots:
4 inch
5.4 inch

You can create different resource directories for different screen sizes and densities and then create dimens.xml in each of them providing text size to be used on specific screen size, for example:
res/values-sw420dp/dimens.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="font_size">26sp</dimen>
</resources>
res/values-sw600dp/dimens.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="font_size">30sp</dimen>
</resources>
res/values-sw720dp/dimens.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="font_size">36sp</dimen>
</resources>
And then call it in your layout file:
android:textSize="#dimen/font_size"
This is a solution for the text size, but you can do the same thing for width and height.
More resources:
Supporting Different Screen Sizes
Dimension Resource Type
Supporting Multiple Screen Sizes

The text view size is static because you have defined a fixed size to them.Use wrap content.
android:layout_width="wrap_content"
android:layout_height="wrap_content"

You should adjust the TextView android:layout_width and android:layout_height to
android:layout_width="wrap_content"
android:layout_height="wrap_content"
If you want the TextView to center inside the white background, you should add another attribute
android:layout_centerInParent="true"

Related

android:paddingLeft set to be percentage of screen

I have a textview component that I set its width as 50% of its parent through layout_weight. I also need to set a padding value for it. It seems I can set it as xdp, but how can I use weight config ? say, left padding as 2% of the screen?
<TextView
android:id="#+id/buttonCollect"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="#string/hello"
android:paddingLeft="8dp" //<---- how to se this.
android:layout_weight="0.5" />
You cannot set percentage as padding value in XML layout file.
However, you can set it in Java code, by calculating the correct length in px.
You can use a horizontal LinearLayout with a View and a TextView as its children and assign weights accordingly. Then, there is no need to set padding to the TextView.
Here, the TextView takes 2/3rd of the screen.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:orientation="horizontal" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="2" />
<TextView
android:id="#+id/textView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Lagre text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
You can use dimens.xml and put them in different values-xxx folder. If u want 8dp in hdpi devices, and 10dp in hdpi-1024x600, u can follow these steps:
Create dimens.xml in values-hdpi folder.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="paddingLeft">8dp</dimen>
</resources
Create dimens.xml in values-hdpi-1024x600 folder.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="paddingLeft">10dp</dimen>
</resources
Replace android:paddingLeft="8dp" to
android:paddingLeft="#dimen/paddingLeft"
Hope it helps.

Android scaling text and images based on screen size (phone vs tablet)

I have a good understanding of the difference between px, dp and sp.
The problem is, when I put a TextView ( or ImageView ) on the screen, the dpi is irrelevant.
On a 3 inch high screen with 160 dpi, a text size of 80px will be 1/2 an inch, or 1/6th the height. On a 7 inch high screen with 160 dpi, it's still 1/2 inch, but that is now 1/14th of the height.
The problem is, using dp (or sp), what looks good on a phone disappears on a tablet.
Is there a way to specify fractional screen size, like percent?
I not sure if you can specify size in percent, but why you dont define different dimensions for screen in dimen.xml file. It is very hard to use the same values dp and sp for all screen sizes.
You need to create different dimens.xml different resource folders
res/values-ldpi/dimens.xml
res/values-mdpi/dimens.xml
res/values-hdpi/dimens.xml
Next add some values to these files
<!-- in values-ldpi/dimens.xml -->
<dimen name="textSize">25dip</dimen>
<!-- in values-mdpi/dimens.xml -->
<dimen name="textSize">20dip</dimen>
Finaly reference to dimensions in your layout file:
<TextView
android:layout_toRightOf="#id/at"
android:layout_below="#id/hw"
android:textSize="#dimen/textSize"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
EDIT:
If you want set height of image to 1/10 of screen size you need to use android:layout_weight attribute in your view containers. Check the example below.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="1"
>
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/imageView"
android:background="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:weightSum="1"
android:layout_weight="9"
>
</LinearLayout>
</LinearLayout>
This will give textSize depending upon the density.
TextView text = new TextView(this);
text.setText("text");
TextView.setTextSize(16 * getResources().getDisplayMetrics().density);
OR
Create dimens.xml in values-ldpi,mdpi and hdpi.
<dimen name="textSize">30dip</dimen>
<dimen name="textSize">10dip</dimen>
and then add this in your layout.
<TextView
android:textSize="#dimen/textSize"
//rest code here
/>

How to center a fixed sized main layout in android?

I want my layout to be fixed sized say: 320dp by 480dp as a default for ldpi screen resolution.
So when the user has a 720x1280 device the layout would still be 320x480 but would be centered.
Any suggestions? I want to avoid creating multiple layouts for each resolution.
For your parent view container, you should just set the layout_width and layout_height to the desired size and then make its layout_gravity equal to center. So, in your case you would use the following
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="320dp"
android:layout_height="480dp"
android:layout_gravity="center" >
<!-- The rest of your layout -->
</LinearLayout>
That should center the view and keep it the desired size. It should be noted that you can use any layout, not just LinearLayout.
Hope this helps! Good luck.
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout android:layout_width="320px"
android:layout_height="480px"
android:layout_centerInParent="true"
android:background="#color/white">
</RelativeLayout>
</RelativeLayout>
Hope this is what you want.

Android:SplashScreen Background image NOT CLEAR

I did an android application with splashscreen :
splash.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/splashnine">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="15dp"
android:textSize="16sp"
android:text="test" />
</RelativeLayout>
where splashnine.png is very clear with 1333x2000 but the picture is not clear when tha app is launched.
First, you should put different versions of this image to different drawable folders, such as drawable-hdpi, drawable-xhdpi, etc. If you just put the image to drawable folder, it's loaded as an mdpi image and then scaled up.
Second, when you set an image as a background, it's scaled up or down depending on the size of the view. It means that the quality of the image becomes worse because of resizing.
Maybe ,since you use "fill_parent" with layout size parameters, image would be resized according to your device screen dimensions. try to change fill_parent to wrap_content or give DP values.

How can I create layout for both 320dp and 360dp?

I'm very disappointed. I just finished my project based on 360dp for "normal screens", but when I tried to run in Motorola Atrix I had a surprise. Motorola Atrix is 360dp instead 320dp, because his width is 540px. Now I'm breaking my head to find out that problem to be resolved. How can I create a layout for 360dp?
I tried all of these:
res/values-sw360dp
res/layout-sw360dp
main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#DFEFF1">
<Button
android:background="#AAAA11"
android:id="#+id/button1"
android:layout_width="#dimen/default_width"
android:layout_height="#dimen/default_height"
android:text="SOME TEXT 1"
/>
<Button
android:background="#FFAA11"
android:id="#+id/button2"
android:layout_width="#dimen/default_width"
android:layout_height="#dimen/default_height"
android:text="SOME TEXT 2"
android:layout_alignParentRight="true" />
</RelativeLayout>
res/values/strings.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="default_width">160dp</dimen>
<dimen name="default_height">160dp</dimen>
</resources>
Motorola Atrix
Samsung Galaxy SII
Generally when designing your layout you want to avoid planning for a specific pixel size. If you were to separate all of your layouts based on pixels like you want to, then you'd have to almost provide one layout for every single device (There are so many devices with different sized screens in the world). Usually you'll want to provide layout resources for a few different categories of size. layout-small, layout-normal, layout-large, etc. If you provide those and your layouts are built in a good manner it should scale to the different sized devices pretty well.
Is there something specific that is wrong with your layout when you run it in the larger sized device? Perhaps if you post that I can help you to try to solve it without needing to separate your layouts by pixel size.
Supporting Multiple Screens in the developer docs has lots of great information about how to build your applications so that they will scale well.
EDIT:
One potential way to solve your problem is not use a static dp value for the width, instead allow the buttons to grow to takeup however much space (horizontally) in order to fill up the width of the screen. You can do that with layout_weight and setting the width to fill_parent. I don't have access to eclipse now so I can't test, but I think surely there is also a way you could get this effect without the linearlayout, but this was the first way that I thought of.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#DFEFF1">
<LinearLayout
android:id="#+id/buttonRow"
android:orientation="horizontal"
android:layout_height="#dimen/default_height"
android:layout_width="fill_parent">
<Button
android:background="#AAAA11"
android:id="#+id/button1"
android:layout_width="0"
android:layout_height="#dimen/default_height"
android:text="SOME TEXT 1"
android:layout_weight="1"
/>
<Button
android:background="#FFAA11"
android:id="#+id/button2"
android:layout_width="0"
android:layout_height="#dimen/default_height"
android:text="SOME TEXT 2"
android:layout_weight="1" />
</LinearLayout>
</RelativeLayout>

Categories

Resources