FrameLayout: View Arrrangement and Null Pointer Exception - java

The main highlight of my activity is the image in the center, that can be zoom in up to the whole screen. Right now, The positions are okay but in some point of zooming in the image two of the textview are being covered by the image, the rest of the view remains at the top of the image.
So my main problem is to put the two textview at the top of the image. I tried transferring the positions of each of the view in xml but for some reason I got null pointer exception.
xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:gravity="center" >
<TextView
android:id="#+id/txtName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView1"
android:layout_marginTop="20dp"
android:textColor="#FF4F00"
android:textSize="20sp"
android:alpha=".5"
android:text="Name" />
<TextView
android:id="#+id/txtPid"
android:layout_below="#+id/txtName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:textColor="#FF4F00"
android:textSize="20sp"
android:layout_marginTop="20dp"
android:alpha=".5"
android:text="Category Or PID" />
<ImageView
android:id="#+id/iv_photo"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:scaleType="center" />
<TextView
android:id="#+id/txtItemNo"
android:layout_below="#+id/txtSellingPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="19dp"
android:textColor="#FF4F00"
android:textSize="20sp"
android:alpha=".5"
android:text="Item No" />
<TextView
android:id="#+id/txtSellingPrice"
android:layout_below="#+id/txtPid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="20dp"
android:textColor="#FF4F00"
android:textSize="20sp"
android:alpha=".5"
android:text="Selling Price" />
</RelativeLayout>
</FrameLayout>


Change the relative layout item ordering so that the imageview is the first item. Items are layout and drawn in the order of they appearance.


Try out as below:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" >
<RelativeLayout
android:id="#+id/rl"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:id="#+id/layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:orientation="vertical" >
<TextView
android:id="#+id/txtName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="20dp"
android:alpha=".5"
android:text="Name"
android:textColor="#FF4F00"
android:textSize="20sp" />
<TextView
android:id="#+id/txtPid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txtName"
android:layout_marginTop="20dp"
android:alpha=".5"
android:text="Category Or PID"
android:textColor="#FF4F00"
android:textSize="20sp" />
<TextView
android:id="#+id/txtItemNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txtSellingPrice"
android:layout_marginTop="19dp"
android:alpha=".5"
android:text="Item No"
android:textColor="#FF4F00"
android:textSize="20sp" />
<TextView
android:id="#+id/txtSellingPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txtPid"
android:layout_marginTop="20dp"
android:alpha=".5"
android:text="Selling Price"
android:textColor="#FF4F00"
android:textSize="20sp" />
</LinearLayout>
<ImageView
android:id="#+id/iv_photo"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/layout"
android:background="#drawable/selctor"
android:scaleType="center" />
</RelativeLayout>
</FrameLayout>
OutPut:

Related

How to stretch Imagview in xml layout and show other button to left of it

I'm using Relativelayout within cardview layout to show the user details. But I want to show the two button at the end with equal width on and everything in the left side of Image which will stretch from Top to bottom.
But I'm not able to do so.
here is my xml code
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_marginBottom="2dp"
app:cardCornerRadius="8dp"
app:cardElevation="8dp"
>
<ImageView
android:id="#+id/contact_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:background="#fff"
android:src="#drawable/binil"
android:padding="1dp" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/top"
android:padding="5dp">
<TextView
android:id="#+id/contact_name"
android:layout_width="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Sagar Rawal"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:textStyle="bold" />
<TextView
android:id="#+id/contact_mobile"
android:text="9868336847"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/contact_name"
android:layout_alignParentLeft="true"
android:textStyle="bold" />
<TextView
android:id="#+id/contact_address"
android:layout_below="#+id/contact_name"
android:layout_width="wrap_content"
android:text="Jumla"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:textStyle="bold"
android:layout_toRightOf="#+id/contact_mobile" />
<TextView
android:id="#+id/contact_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="searchbbc1881#gmail.com"
android:layout_below="#+id/contact_mobile"
android:layout_alignParentLeft="true"
android:textStyle="bold" />
<ImageButton
android:layout_below="#+id/contact_email"
android:id="#+id/call"
android:background="#drawable/shape_button"
android:layout_width="wrap_content"
android:src="#drawable/ic_call_black_24dp"
android:layout_height="wrap_content" />
<ImageButton
android:layout_toRightOf="#id/call"
android:layout_below="#+id/contact_email"
android:background="#drawable/shape_button"
android:layout_width="wrap_content"
android:src="#drawable/ic_email_black_24dp"
android:layout_height="wrap_content" />
</RelativeLayout>
</android.support.v7.widget.CardView>
My output is
But I want something similar to this
Where two buttons will equally stretch to left side of Image.
Please help

Try using LinearLayout weightSum like this
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="100">
<TextView
android:layout_width="0dp"
android:layout_weight="50"
android:layout_height="wrap_content"
android:text="text1!" />
<TextView
android:layout_width="0dp"
android:layout_weight="50"
android:layout_height="wrap_content"
android:text="text2!" />
</LinearLayout>
Update:
Replace your code with this, it will solve your issue
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
android:padding="5dp"
app:cardCornerRadius="8dp"
app:cardElevation="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="1">
<RelativeLayout
android:id="#+id/top"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".7"
android:padding="5dp">
<TextView
android:id="#+id/contact_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="Sagar Rawal"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textStyle="bold" />
<TextView
android:id="#+id/contact_mobile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/contact_name"
android:text="9868336847"
android:textStyle="bold" />
<TextView
android:id="#+id/contact_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/contact_name"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#+id/contact_mobile"
android:text="Jumla"
android:textStyle="bold" />
<TextView
android:id="#+id/contact_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/contact_mobile"
android:text="searchbbc1881#gmail.com"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/contact_email"
android:weightSum="1">
<ImageButton
android:id="#+id/call"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_below="#+id/contact_email"
android:layout_weight=".5"
android:background="#drawable/shape_button"
android:src="#drawable/ic_email_black_24dp"
/>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_below="#+id/contact_email"
android:layout_toRightOf="#id/call"
android:layout_weight=".5"
android:background="#drawable/shape_button"
android:src="#drawable/ic_email_black_24dp"
/>
</LinearLayout>
</RelativeLayout>
<ImageView
android:id="#+id/contact_profile"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".3"
android:background="#fff"
android:padding="1dp"
android:src="#drawable/ic_launcher_background" />
</LinearLayout>
</android.support.v7.widget.CardView>

Try to reorganize it this way:

How to fit my Layout to any Screen in Android

I'm building my own application game for Android, it's a Tic Tac Toe game.
my activities contains mostly ImageViews , all the images placed in the dir res\drawable-mdpi ONLY.
the rest of the drawable folders are empty.
my problem is that when i run the app on a 5.4 inch MDPI screen it works fine and it looks like this:
but when i run the app on another screen of different size for example this 4.65 inch XHDPI screen, it looks like this:
in the above activity i used LinearLayout and RelativeLayout, what should i do to fit my layout to any screen ?
thanks
thanks for editting the pictures
this is the code of the xml file of activity_board.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/board_page_bg"
android:gravity="center" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:background="#drawable/board"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="30dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/players_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginTop="2dp"
android:text="#string/playersName"
android:textSize="30sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/players_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="150dp"
android:layout_marginTop="5dp"
android:text="#string/playersPoints"
android:textSize="25sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="right" >
<TextView
android:id="#+id/machines_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="172dp"
android:layout_marginTop="5dp"
android:text="#string/machinePoints"
android:textSize="25sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="right" >
<TextView
android:id="#+id/machines_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="50dp"
android:onClick="openChat"
android:clickable="true"
android:text="#string/machineName"
android:textSize="30sp" />
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<ImageView
android:id="#+id/block1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:onClick="touch"
android:src="#drawable/block_1_empty" />
<ImageView
android:id="#+id/block2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="155dp"
android:onClick="touch"
android:src="#drawable/block_2_empty" />
<ImageView
android:id="#+id/block3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="310dp"
android:onClick="touch"
android:src="#drawable/block_3_empty" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="40dp" >
<ImageView
android:id="#+id/block4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:onClick="touch"
android:src="#drawable/block_4_empty" />
<ImageView
android:id="#+id/block5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="150dp"
android:layout_marginTop="10dp"
android:onClick="touch"
android:src="#drawable/block_5_empty" />
<ImageView
android:id="#+id/block6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="310dp"
android:layout_marginTop="10dp"
android:onClick="touch"
android:src="#drawable/block_6_empty" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="55dp" >
<ImageView
android:id="#+id/block7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:onClick="touch"
android:src="#drawable/block_7_empty" />
<ImageView
android:id="#+id/block8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="155dp"
android:onClick="touch"
android:src="#drawable/block_8_empty" />
<ImageView
android:id="#+id/block9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="315dp"
android:onClick="touch"
android:src="#drawable/block_9_empty" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="6dp" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/game_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="105dp"
android:text="#string/gameNumber"
android:textSize="25sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/count_down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="390dp"
android:text="#string/countDown"
android:textSize="25sp" />
</RelativeLayout>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:orientation="horizontal" >
<ImageView
android:id="#+id/end_game"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/EndGame"
android:onClick="endGame"
android:src="#drawable/endgame_btn_1" />
</LinearLayout>
</LinearLayout>

Are you using RelativeLayout?
You should
1. use RelativeLayout as the base container
2. put the "Player" and "System" score inside the same horizontal LinearLayout so that they won't overlap
3. Put the "End game" button as an element which align parent bottom
The screenshots you attached shows that it's a problem caused by the soft status bar. RelativeLayout would help and you should try to prevent hard-coding the dimensions in numbers but making the auto-adjust in RelativeLayout using margins, "layout_toLeftOf", "layout_toRightOf" and etc.

Create a drawable folder, just the word "drawable", in res and put your game images in there. That will make the game images the same across every device density.
Without looking at your XML, I would agree that you're probably using hardcoded dp values instead of sizing the layout with math, ie, weights, match_parent, alignParentRight, etc.
I have adjusted your XML to be easier. I did not plug it into a previewer or anything.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/board_page_bg"
android:gravity="center" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:layout_marginLeft="ADJUST ME"
android:layout_marginRight="ADJUST ME"
android:background="#drawable/board"
android:orientation="vertical" >
<!-- Scoreboard -->
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp" >
<TextView
android:id="#+id/players_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginTop="2dp"
android:layout_alignParentLeft="true"
android:text="#string/playersName"
android:textSize="30sp" />
<TextView
android:id="#+id/players_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="150dp"
android:layout_marginTop="5dp"
android:layout_toLeftOf="#id/players_name"
android:text="#string/playersPoints"
android:textSize="25sp" />
<TextView
android:id="#+id/machines_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="172dp"
android:layout_marginTop="5dp"
android:layout_toRightOf="#id/machines_name"
android:text="#string/machinePoints"
android:textSize="25sp" />
<TextView
android:id="#+id/machines_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="50dp"
android:onClick="openChat"
android:layout_alignParentRight="true"
android:clickable="true"
android:text="#string/machineName"
android:textSize="30sp" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/block1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_1_empty" />
<ImageView
android:id="#+id/block2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_2_empty" />
<ImageView
android:id="#+id/block3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_3_empty" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/block4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_4_empty" />
<ImageView
android:id="#+id/block5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_5_empty" />
<ImageView
android:id="#+id/block6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_6_empty" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/block7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_7_empty" />
<ImageView
android:id="#+id/block8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_8_empty" />
<ImageView
android:id="#+id/block9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="touch"
android:src="#drawable/block_9_empty" />
</LinearLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="ADJUST ME" >
<TextView
android:id="#+id/game_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="#string/gameNumber"
android:textSize="25sp" />
<TextView
android:id="#+id/count_down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="#string/countDown"
android:textSize="25sp" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:orientation="horizontal" >
<ImageView
android:id="#+id/end_game"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/EndGame"
android:onClick="endGame"
android:src="#drawable/endgame_btn_1" />
</LinearLayout>
</LinearLayout>

How to put an image below textview in layout?

How can I put the image view below two of the text views, tv_pw and tv_un. So that in the layout the two text views are on top of the image, while the image serves as a background for that two text views. How could I do that?
Here is my xml file:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="510dip"
android:layout_marginTop="10dip"
android:background="#DDDDDD">"
<EditText
android:id="#+id/et_pw"
android:layout_width="150dip"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/et_un"
android:layout_below="#+id/et_un"
android:background="#android:drawable/editbox_background"
android:ems="10"
android:inputType="textPassword" />
<TextView
android:id="#+id/tv_pw"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/et_pw"
android:layout_alignBottom="#+id/et_pw"
android:layout_marginRight="20dp"
android:layout_toLeftOf="#+id/et_pw"
android:text="Password:"
android:textColor="#444444"
android:textSize="10pt" />
<Button
android:id="#+id/btn_login"
android:layout_width="100dip"
android:layout_height="wrap_content"
android:layout_below="#+id/et_pw"
android:layout_centerHorizontal="true"
android:text="Login" />
<TextView
android:id="#+id/tv_un"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/tv_pw"
android:layout_marginTop="98dp"
android:text="User Name:"
android:textColor="#444444"
android:textSize="10pt" />
<EditText
android:id="#+id/et_un"
android:layout_width="150dip"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/tv_un"
android:layout_centerHorizontal="true"
android:background="#android:drawable/editbox_background"
android:ems="10"
android:inputType="text" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/btn_login"
android:layout_centerHorizontal="true"
android:text="" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="32dp"
android:text="text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="14dp"
android:src="#drawable/bkground" />

There's a lot more in your XML but, focusing on what you are asking, you can use the margin attribute to overlap the textviews.
Try something 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" >
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/myImage">
</ImageView>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/image"
android:layout_marginTop="-50dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world2" />
</LinearLayout>
</RelativeLayout>
In this example I wrapped the two textviews inside a linear-layout (vertical) and set the linear-layout below the imageview and a margin of -50dp so it goes up and overlap.
HIH

Another way would be to use drawableBottom="#drawable/ic_launcher" inside your textview

If you don't care about having control on how the image scales, you can set the background of a LinearLayout that's wrapped around the TextViews.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/your_background_image_here"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/text_view_1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/text_view_2" />
</LinearLayout>

Try this way,hope this will help you to solve your problem.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="510dp"
android:layout_marginTop="10dp"
android:orientation="vertical"
android:gravity="center"
android:background="#DDDDDD">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="98dp">
<LinearLayout
android:layout_width="110dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/bkground">
<TextView
android:id="#+id/tv_un"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="User Name:"
android:textColor="#444444"
android:textSize="10pt" />
<TextView
android:id="#+id/tv_pw"
android:layout_width="110dp"
android:layout_height="wrap_content"
android:text="Password:"
android:textColor="#444444"
android:textSize="10pt" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginLeft="20dp">
<EditText
android:id="#+id/et_un"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:background="#android:drawable/editbox_background"
android:ems="10"
android:inputType="text" />
<EditText
android:id="#+id/et_pw"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:background="#android:drawable/editbox_background"
android:ems="10"
android:inputType="textPassword" />
</LinearLayout>
</LinearLayout>
<Button
android:id="#+id/btn_login"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Login" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>

Wrap the two TextViews in linear layout with vertical orientation and assign background for linear layout.

use android:weight on the the two text views and boom

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content" />

Android - text overlapping in landscape but not portrait

So i have a small issue. When I am in portrait mode and click on an item, the conformation page comes up and its fine. but when you turn it landscape, some text is overwritten but the button. See picture:
Overlapping
However if I click on the item in landscape, its not overlapping. Can anyone see where im going wrong.
Below is the landscape code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/fragment_one_click_reservation_details_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/fragment_one_click_message_layouts"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<include layout="#layout/fragment_one_click_message_layout" />
<ImageView
android:id="#+id/fragment_one_click_horizontal_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:src="#color/thin_line" />
<LinearLayout
android:id="#+id/fragment_one_click_reservation_detalis_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/fragment_one_click_reservation_number_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/fragment_one_click_reservation_message_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/fragment_one_click_reservation_message_text" />
<TextView
android:id="#+id/fragment_one_click_reservation_number_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/fragment_one_click_reservation_message_text"
android:layout_toRightOf="#id/fragment_one_click_reservation_message_text"
android:textColor="#color/one_click_reservation_number_text"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/fragment_one_click_reservation_store_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/fragment_one_click_reservation_number_text"
android:text="#string/fragment_one_click_reservation_store_text" />
<TextView
android:id="#+id/fragment_one_click_reservation_store_name_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/fragment_one_click_reservation_store_text"
android:layout_toRightOf="#id/fragment_one_click_reservation_store_text"
android:text="TEST TEST TEST TES"
android:layout_toLeftOf="#+id/fragment_one_click_cancel_reservation_button_tablet_land"
android:textStyle="bold" />
<TextView
android:id="#+id/fragment_one_click_reservation_until_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/fragment_one_click_reservation_store_text"
android:layout_marginTop="15dp"
android:text="#string/fragment_one_click_reservation_until_text" />
<TextView
android:id="#+id/fragment_one_click_reservation_until_time_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/fragment_one_click_reservation_until_text"
android:layout_toRightOf="#id/fragment_one_click_reservation_until_text"
android:textStyle="bold" />
<Button
android:id="#+id/fragment_one_click_cancel_reservation_button_tablet_land"
android:layout_width="200dp"
android:layout_height="40dp"
android:layout_alignParentRight="true"
android:background="#drawable/one_click_cancel_red_button"
android:text="#string/one_click_button_cancel_reservation" />
</RelativeLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/fragment_one_click_store_details_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp" >
<Button
android:id="#+id/fragment_one_click_store_details_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/grey"
android:padding="10dp"
android:text="#string/one_click_store_details" />
</RelativeLayout>
<LinearLayout
android:id="#+id/fragment_one_click_reservation_until_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="vertical" >
<TextView
android:id="#+id/fragment_one_click_reservation_details_sent_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/fragment_one_click_reservation_details_sent_text" />
<LinearLayout
android:id="#+id/fragment_one_click_reservation_mobile_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/fragment_one_click_reservation_mobile_message_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/fragment_one_click_reservation_mobile_message_text" />
<TextView
android:id="#+id/fragment_one_click_reservation_mobile_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="#+id/fragment_one_click_reservation_email_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/fragment_one_click_reservation_email_message_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/fragment_one_click_reservation_email_message_text" />
<TextView
android:id="#+id/fragment_one_click_reservation_email_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:textStyle="bold" />
</LinearLayout>
<Button
android:id="#+id/fragment_one_click_cancel_reservation_button_tablet_port"
android:layout_width="200dp"
android:layout_height="40dp"
android:layout_marginTop="10dp"
android:background="#drawable/one_click_cancel_red_button"
android:text="#string/one_click_button_cancel_reservation" />
<RelativeLayout
android:id="#+id/fragment_one_click_reservation_my_account_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
<TextView
android:id="#+id/fragment_one_click_reservation_my_account_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:lines="3"
android:text="#string/fragment_one_click_reservation_my_account_text_tablet" />
<Button
android:id="#+id/fragment_one_click_account_button"
style="#style/alternatesmallbutton"
android:layout_width="140dp"
android:layout_height="35dp"
android:layout_alignParentRight="true"
android:layout_marginTop="4dp"
android:text="#string/one_click_my_account" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/progress_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal" >
<ProgressBar
android:id="#+id/fragment_pdp_add_to_trolley_progress_collection"
style="#style/progress_spinner"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:visibility="visible" />
</LinearLayout>
<ImageView
android:id="#+id/fragment_one_click_horizontal_line"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:src="#color/thin_line" />
</LinearLayout>

Set the WIDTH of the button to WRAP CONTENT and set PADDING for the button to make the button looks larger and set the button to the right of the ID of "Reserved At info text".

Center TextView between Button and TextView?

I have this layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:textSize="16sp"
android:textStyle="bold"
android:gravity="center_horizontal"
android:textColor="#color/red"
android:text="#string/inf" />
<TextView
android:id="#+id/textView2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="60dp"
android:textSize="28sp"
android:gravity="center_horizontal"
android:textStyle="bold"
android:text="#string/ben" />
<TextView
android:id="#+id/textView3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="120dp"
android:gravity="center_horizontal"
android:textSize="18sp"
/>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_centerInParent="true"
android:text="#string/verifica" />
<TextView
android:id="#+id/textView4"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="330dp"
android:gravity="center_horizontal"
android:textSize="18sp"
/>
</RelativeLayout>
Running the application on my Nexus TextView3 looks good, centered between the TextView2 and Button, but on other phones do not.
Do you have ideas on how I can center it between the second TextView and the Button? And to insert a ScrollView?

See following code. It may helps you.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum = "5" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:textSize="16sp"
android:layout_weight = "1"
android:textStyle="bold"
android:gravity="center_horizontal"
android:textColor="#color/red"
android:text="#string/inf" />
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="60dp"
android:layout_weight = "1
android:textSize="28sp"
android:gravity="center_horizontal"
android:textStyle="bold"
android:text="#string/ben" />
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight = "1
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="120dp"
android:gravity="center_horizontal"
android:textSize="18sp"
/>
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight = "1
android:layout_gravity="center_vertical|center_horizontal"
android:layout_centerInParent="true"
android:text="#string/verifica" />
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_weight = "1
android:layout_marginTop="330dp"
android:gravity="center_horizontal"
android:textSize="18sp"
/>
</RelativeLayout>

Scrollview only supports a single child take this into consideration, Here is your layout
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:gravity="center_horizontal"
android:text="#string/inf"
android:textColor="#color/red"
android:textSize="16sp"
android:textStyle="bold" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_marginTop="60dp" >
<TextView
android:id="#+id/textView2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:gravity="center_horizontal"
android:text="TextView 2"
android:textSize="28sp"
android:textStyle="bold" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center_vertical|center_horizontal"
android:text="#string/verifica" />
<TextView
android:id="#+id/textView3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginTop="120dp"
android:gravity="center_horizontal"
android:text="TextView 3"
android:textSize="18sp" />
</RelativeLayout>
<TextView
android:id="#+id/textView4"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="330dp"
android:gravity="center_horizontal"
android:textSize="18sp" />
</RelativeLayout>
</ScrollView>]![enter image description here][2]

Categories

Resources