Relative layout in android - android

I am a newbie in android who has started android just today.I am facing some problem in Layouts.
I want the layout to be as follows.
1(TextView) 2(TextView)
3(EditView) 4(EditView)
Here is what I have tried.The Top 1 & 2 represents TextView and 3
&4 represents EditView.Can we achieve this only with relative layout.
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#drawable/amicare"
tools:context="com.example.ambulancetrack.MainActivity" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/reg_no"
android:id="#+id/tvRegNo"
android:textColor="#21F6D0"
android:layout_toLeftOf="#+id/tvPhoneNo"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RAHAT Phone No."
android:textColor="#21F6D0"
android:layout_alignParentRight="true"
android:id="#+id/tvPhoneNo"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/tvRegNo"
android:background="#1E4F56"
android:textColor="#FFFFFF"
android:id="#+id/evRegNo"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/evRegNo"
android:background="#1E4F56"
android:textColor="#FFFFFF"
android:id="#+id/evPhoneNo"
/>
</RelativeLayout>
Please Help!!!Thanks in Advance

Ckeck this variant (in your case):
UPDATE:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#drawable/amicare"
tools:context="com.example.ambulancetrack.MainActivity" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/reg_no"
android:id="#+id/tvRegNo"
android:textColor="#21F6D0"
android:layout_toLeftOf="#+id/tvPhoneNo"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RAHAT Phone No."
android:textColor="#21F6D0"
android:layout_alignParentRight="true"
android:id="#+id/tvPhoneNo"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/tvRegNo"
android:background="#1E4F56"
android:textColor="#FFFFFF"
android:id="#+id/evRegNo"
android:layout_toLeftOf="#+id/evPhoneNo"
android:layout_toStartOf="#+id/evPhoneNo" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/tvPhoneNo"
android:layout_below="#+id/tvPhoneNo"
android:background="#1E4F56"
android:textColor="#FFFFFF"
android:id="#+id/evPhoneNo"
/>

Here is your code.
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.ambulancetrack.MainActivity">
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/tvRegNo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/tvPhoneNo"
android:layout_weight="1"
android:text="reg_no"
android:textColor="#21F6D0" />
<TextView
android:id="#+id/tvPhoneNo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_weight="1"
android:text="RAHAT Phone No."
android:textColor="#21F6D0"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/layout1"
android:orientation="horizontal">
<EditText
android:id="#+id/evRegNo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_below="#+id/tvRegNo"
android:layout_weight="1"
android:background="#1E4F56"
android:textColor="#FFFFFF" />
<EditText
android:id="#+id/evPhoneNo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/evRegNo"
android:layout_weight="1"
android:background="#1E4F56"
android:textColor="#FFFFFF" />
</LinearLayout>
Test it and accept the answer if it is useful.

try this way
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="abce"
android:id="#+id/tvRegNo"
android:layout_toLeftOf="#+id/tvPhoneNo"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RAHAT Phone No."
android:layout_alignParentRight="true"
android:id="#+id/tvPhoneNo"
/>
<EditText
android:layout_width="170dp"
android:layout_height="wrap_content"
android:layout_below="#+id/tvRegNo"
android:hint="avc"
android:layout_alignParentLeft="true"
android:textColor="#FFFFFF"
android:id="#+id/evRegNo"
/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="avcd"
android:layout_toRightOf="#+id/evRegNo"
android:layout_alignParentRight="true"
android:layout_below="#+id/tvPhoneNo"
android:textColor="#FFFFFF"
android:id="#+id/evPhoneNo"
/>
</RelativeLayout>

Change main layout type to Linear with Vertical orientation. Then add 2 more Linear layout with Horizontal orientation inside and put your Textviews there. Use Weight attribute to control the size of each layout. Like that:
<?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:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="10"></LinearLayout>
</LinearLayout>
Add one more layout to you main Vertical layout and set it weight to 10, so it will take most space and your textviews will be close to each other. Dont forget to set android:layout_height="0dp"of your inner layouts to make weight work right.

You can archive this using LinearLayout also using android:layout_weight, like:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Text View 1" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Text View 2" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Text View 3" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Text View 4" />
</LinearLayout>
</LinearLayout>

Your thinking is right,we can use one RelativeLayout to achieve your goal,but your last EditText's attrs maybe wrong.Please try 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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#drawable/amicare"
tools:context="com.example.ambulancetrack.MainActivity" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/reg_no"
android:id="#+id/tvRegNo"
android:textColor="#21F6D0"
android:layout_toLeftOf="#+id/tvPhoneNo"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RAHAT Phone No."
android:textColor="#21F6D0"
android:layout_alignParentRight="true"
android:id="#+id/tvPhoneNo"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/tvRegNo"
android:background="#1E4F56"
android:textColor="#FFFFFF"
android:id="#+id/evRegNo"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/tvPhoneNo"
android:layout_below="#+id/tvPhoneNo"
android:background="#1E4F56"
android:textColor="#FFFFFF"
android:id="#+id/evPhoneNo"
/>
</RelativeLayout>
Just add
android:layout_alignLeft="#+id/tvPhoneNo"
android:layout_below="#+id/tvPhoneNo"
to make sure evPhoneNo layouts below of tvPhoneNo and align left of tvPhoneNo.

This should do the work. You can change text color and other attributes as you want.but this is the basic structure of your question
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="137dp"
android:text="EditView"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editText2"
android:layout_alignTop="#+id/editText"
android:text="EditView"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="TextView"
android:id="#+id/textView1"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="TextView"
android:id="#+id/textView2"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>

Related

EditText moves TextView out of the screen when they keyboard is opening

I have an EditText on the bottom of my layout und a few TextViews on the top. When I click on the EditText it moves from the bottom above the keyboard which is good. But the TextViews also move up and out of the screen so you can't see them until you close the keyboard again. How can I avoid this but still have my EditText above the keyboard? I'm using a RelativeLayout.
Thanks!
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.ncss.tyfby.Feeling"
android:background="#1baa84">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<TextView
android:text="I am"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/IamTV"
android:layout_weight="0.10"
android:textSize="40sp"
android:textStyle="normal|bold"
android:gravity="bottom" />
<EditText
android:layout_width="wrap_content"
android:inputType="textPersonName"
android:ems="10"
android:id="#+id/iamAdjective"
android:background="#android:drawable/editbox_background_normal"
android:hint="powerful"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginLeft="10dp" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/send"
android:layout_weight="0.10"
android:src="#android:drawable/ic_menu_send"
android:background="#drawable/transparent"
android:onClick="send"
android:layout_marginLeft="5dp" />
</LinearLayout>
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam1"
android:textSize="18sp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam2"
android:textSize="18sp"
android:layout_below="#+id/iam1"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam4"
android:textSize="18sp"
android:layout_below="#+id/iam3"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam5"
android:textSize="18sp"
android:layout_below="#+id/iam4"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam3"
android:textSize="18sp"
android:layout_below="#+id/iam2"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
You may explore windowSoftInputMode that you can configure for your Activity in the AndroidManifest.xml file: activity | Android Developers.
Perhaps windowSoftInputMode="adjustResize" might be useful for you.
In addition to that you will need to change your layout XML to something like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent"
tools:context="com.ncss.tyfby.Feeling"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:orientation="vertical"
android:background="#1baa84">
<ScrollView
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_weight="1">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:orientation="vertical">
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam1"
android:textSize="18sp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam2"
android:textSize="18sp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam4"
android:textSize="18sp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam5"
android:textSize="18sp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
<TextView
android:text="I am"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/iam3"
android:textSize="18sp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="10dp" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<TextView
android:text="I am"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/IamTV"
android:layout_weight="0.10"
android:textSize="40sp"
android:textStyle="normal|bold"
android:gravity="bottom" />
<EditText
android:layout_width="wrap_content"
android:inputType="textPersonName"
android:ems="10"
android:id="#+id/iamAdjective"
android:background="#android:drawable/editbox_background_normal"
android:hint="powerful"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginLeft="10dp" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/send"
android:layout_weight="0.10"
android:src="#android:drawable/ic_menu_send"
android:background="#drawable/transparent"
android:onClick="send"
android:layout_marginLeft="5dp" />
</LinearLayout>
</LinearLayout>
You should put your entire layout inside a ScrollView and force that to be above of my_edit_text:
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/my_edit_text">

Why my element is not staying at the bottom as supposed?

I have this layout xml file:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true">
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<TextView
android:layout_marginTop="40dp"
android:id="#+id/emalLbl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="#string/test" />
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/testTxtLay"
android:layout_marginTop="10dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/emalLbl"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="1">
<EditText
android:id="#+id/testTxt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:background="#drawable/edit_text_design" />
</LinearLayout>
<TextView
android:layout_marginTop="60dp"
android:id="#+id/reminderLbl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/testTxtLay"
android:layout_centerHorizontal="true"
android:text="#string/reminder" />
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_marginTop="10dp"
android:id="#+id/reminderTxtLay"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/reminderLbl"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="1">
<EditText
android:id="#+id/reminderTxt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:lines="2"
android:background="#drawable/edit_text_design" />
</LinearLayout>
<View
android:id="#+id/spacer"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_below="#id/reminderTxtLay"
android:layout_centerHorizontal="true" />
<Button
android:layout_marginTop="200dp"
android:id="#+id/pickDateBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/reminderTxtLay"
android:layout_toLeftOf="#+id/spacer"
android:onClick="showDatePickerDialog"
android:text="#string/datePickerBtnTxt" />
<Button
android:id="#+id/pickTimeBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/pickDateBtn"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/pickDateBtn"
android:onClick="showTimePickerDialog"
android:text="#string/pickTimeBtn" />
<View
android:id="#+id/spacerTxt"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_below="#id/reminderTxtLay"
android:layout_centerHorizontal="true" />
<EditText
android:layout_marginTop="15dp"
android:id="#+id/selectedDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/spacerTxt"
android:layout_below="#id/pickDateBtn"
android:layout_toLeftOf="#+id/spacerTxt" />
<EditText
android:id="#+id/selectedTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/selectedDate"
android:layout_below="#id/pickTimeBtn"
android:layout_toRightOf="#+id/selectedDate" />
<Button
android:id="#+id/submitBtn"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerInParent="true"
android:onClick="submitData"
android:text="#string/submitBtn" />
</RelativeLayout>
</ScrollView>
This is the custom design for 7 inch tablets, placed in res\layout-sw600dp
Anyways in the android studio landscape preview it seems just fine:
But in the emulator something is going wrong and here is how it looks strange. What I mean is that the submit button is not on the bottom and the pickDate and pickTime buttons are at the bottom of the layout.
I know that I'm missing a basic point here, but as an android developer, I'm not able to spot it.
Can you give me a push?
Here is a complete way to do what you seem to try accomplish. You don't need to create any Views for "spaces" etc. You only need to add margin or padding to either side of your views to make it move away from another view.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<LinearLayout
android:id="#+id/linear_wrapper"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center_horizontal"
>
<TextView
android:layout_marginTop="40dp"
android:id="#+id/emalLbl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/test" />
<EditText
android:id="#+id/testTxt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/edit_text_design" />
<TextView
android:layout_marginTop="60dp"
android:id="#+id/reminderLbl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/reminder" />
<EditText
android:id="#+id/reminderTxt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lines="2"
android:background="#drawable/edit_text_design" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="200dp"
>
<Button
android:id="#+id/pickDateBtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="showDatePickerDialog"
android:text="#string/datePickerBtnTxt" />
<Button
android:id="#+id/pickTimeBtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="showTimePickerDialog"
android:text="#string/pickTimeBtn" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="#+id/selectedDate"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<EditText
android:id="#+id/selectedTime"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
<Button
android:id="#+id/submitBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_below="#+id/linear_wrapper"
android:onClick="submitData"
android:text="#string/submitBtn" />
</RelativeLayout>
you can place 2 buttons next to each other!
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="1">
<Button
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:gravity="left"
android:layout_height="wrap_content"
android:lines="2" />
<Button
android:id="#+id/btn2"
android:layout_width="fill_parent"
android:gravity="right"
android:layout_height="wrap_content" />
</LinearLayout>

how to align the EditText to the layout?

Hi I have some problems with aligning the EditText in Android.
my code:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<LinearLayout
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:orientation="horizontal" >
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/sym_def_app_icon" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title goes here" />
</LinearLayout>
<TableLayout
android:id="#+id/middleSection"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/header" >
<TableRow
android:id="#+id/userRow"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/userText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Username" />
<EditText
android:id="#+id/userEdit"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</TableRow>
<TableRow
android:id="#+id/passwordRow"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/passwordText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Password" />
<EditText
android:id="#+id/passordEdit"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
<TableRow
android:id="#+id/checkBoxRow"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/checkBoxBlank"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" "/>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/checkBoxText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Password"/>
</TableRow>
</TableLayout>
</RelativeLayout>
my output looks like this:
Username i__i
Password i__I
chBox Show Password
actually, I want to have:
Username i__________________i
Password i__________________i
chBox Show Password
I could not figure it out how to align it as I am new to Android(and XML)
thanks
add android:ems="10" to the EditText properties in the XML. The number 10 is an arbitrary number, and you can increase or decrease it depending on how long you want the EditText.
That, or you could just drag it longer to a relative point in the Graphical Layout tab of the XML.
use android:stretchColumns="*" in TableLayout tag that stretch column that you want
<?xml version="1.0" encoding="utf-8"?>
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<LinearLayout
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:orientation="horizontal" >
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/sym_def_app_icon" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title goes here" />
</LinearLayout>
<TableLayout
android:id="#+id/middleSection"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/header"
android:stretchColumns="1"
>
<TableRow
android:id="#+id/userRow"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/userText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Username" />
<EditText
android:id="#+id/userEdit"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</TableRow>
<TableRow
android:id="#+id/passwordRow"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/passwordText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Password" />
<EditText
android:id="#+id/passordEdit"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
<TableRow
android:id="#+id/checkBoxRow"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/checkBoxBlank"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" "/>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/checkBoxText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Password"/>
</LinearLayout>
</TableRow>
</TableLayout>
</RelativeLayout>
Try this. It will work.
<RelativeLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="55dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#android:drawable/sym_def_app_icon" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title goes here"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />
<!--ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="#android:drawable/sym_def_app_icon" /-->
</RelativeLayout>
<LinearLayout
android:id="#+id/middleSection"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/header"
android:orientation="vertical"
>
<LinearLayout
android:id="#+id/userRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:id="#+id/userText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Username" />
<EditText
android:id="#+id/userEdit"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/passwordRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/passwordText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Password" />
<EditText
android:id="#+id/passordEdit"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout
android:id="#+id/checkBoxRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"/>
<TextView
android:id="#+id/checkBoxText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Password"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/checkBoxText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Password"/>
put your above code in one parent layout says Linearlayout like this:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/checkBoxText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Password"/>
</LinearLayout>
what happening is you have 2 controls in each table row except last one which hase 3 controls in it so your EditText has its width according to the second control width that is your check box. so putting CheckBox and TextView in one Linear Layout consider it as a one control (or Layout) and your EditText adjusted according to that.

TextView is not visible

Please have a look at the following code
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".Game" >
<TextView
android:id="#+id/numberOfQuestionsLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="20dp"
android:text="TextView" />
<TextView
android:id="#+id/numberOfCorrectAnswers"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/numberOfQuestionsLeft"
android:layout_alignBottom="#+id/numberOfQuestionsLeft"
android:layout_marginLeft="34dp"
android:layout_toRightOf="#+id/numberOfQuestionsLeft"
android:text="TextView" />
<LinearLayout
android:id="#+id/linearOne"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#49494f"
android:layout_below="#+id/numberOfCorrectAnswers"
android:paddingTop="20dp"
>
<TextView
android:id="#+id/hint"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginBottom="30dp"
android:text="Medium Text"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
This gives the following
As you can see, the hint textview which should appear inside the Linear Layout is not visible. Why is this? Please
Remove android:layout_marginBottom="30dp" from your hint text view :
<LinearLayout
android:id="#+id/linearOne"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#49494f"
android:layout_below="#+id/numberOfCorrectAnswers"
android:paddingTop="20dp" >
<TextView
android:id="#+id/hint"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Medium Text"
android:textColor="#ffffff" />
</LinearLayout >
Actually you dont need that Linear Layout, just do 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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".Game" >
<TextView
android:id="#+id/numberOfQuestionsLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="20dp"
android:text="TextView" />
<TextView
android:id="#+id/numberOfCorrectAnswers"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/numberOfQuestionsLeft"
android:layout_alignBottom="#+id/numberOfQuestionsLeft"
android:layout_marginLeft="34dp"
android:layout_toRightOf="#+id/numberOfQuestionsLeft"
android:text="TextView" />
<TextView
android:id="#+id/hint"
android:background="#49494f"
android:paddingTop="20dp"
android:layout_below="#+id/numberOfCorrectAnswers"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="30dp"
android:text="Medium Text"
android:textColor="#ffffff" />
</RelativeLayout >
You need to do this:
<LinearLayout
android:id="#+id/linearOne"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#49494f"
android:layout_below="#+id/numberOfCorrectAnswers"
android:paddingTop="20dp"
>
<TextView
android:id="#+id/hint"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="30dp"
android:text="MediumText"
android:textColor="#ffffff" />
</LinearLayout>

How to change height of scrollview to not overlap linear layout in android?

I have this xml layout, but the problem is that, in the scroll view, the height of it is spanning the whole screen and overlapping the bottom linear layout (drawing on top of it). Is there a way so that, I can get the scroll view height going only up to the linear layout on the bottom? I want the bottom 2 buttons to be aligned to the bottom of the screen.
Thanks
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".ActivityProfile" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/picture_avatar"
android:layout_width="90dp"
android:layout_height="310dp"
android:background="#bdbdbd"
android:src="#drawable/no_avatar" />
<TextView
android:id="#+id/textview_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="" />
</LinearLayout>
<TextView
android:id="#+id/textview_fullname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30sp"
android:text="" />
<TextView
android:id="#+id/textview_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="email"
android:text="" />
<TextView
android:id="#+id/textview_phone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="phone"
android:text="" />
<TextView
android:id="#+id/textview_website"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="web"
android:text="" />
<TextView
android:id="#+id/textview_bio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="7dp"
android:layout_marginBottom="7dp"
android:text="" />
<TextView
android:id="#+id/textview_lastactive"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
<TextView
android:id="#+id/textview_datejoined"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
<TextView
android:id="#+id/textview_dateleft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:orientation="horizontal" >
<Button
android:id="#+id/button_logout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="CloseActivity"
android:text="#+string/back" />
<Button
android:id="#+id/button_exit"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:onClick="GoToEditProfile"
android:text="#+string/edit" />
</LinearLayout>
</RelativeLayout>
Change it to LinearLayout and use layout_weight :
<?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:orientation="vertical">
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/picture_avatar"
android:layout_width="90dp"
android:layout_height="310dp"
android:background="#bdbdbd"
android:src="#drawable/no_avatar" />
<TextView
android:id="#+id/textview_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="" />
</LinearLayout>
<TextView
android:id="#+id/textview_fullname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30sp"
android:text="" />
<TextView
android:id="#+id/textview_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="email"
android:text="" />
<TextView
android:id="#+id/textview_phone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="phone"
android:text="" />
<TextView
android:id="#+id/textview_website"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="web"
android:text="" />
<TextView
android:id="#+id/textview_bio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="7dp"
android:layout_marginBottom="7dp"
android:text="" />
<TextView
android:id="#+id/textview_lastactive"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
<TextView
android:id="#+id/textview_datejoined"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
<TextView
android:id="#+id/textview_dateleft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:orientation="horizontal" >
<Button
android:id="#+id/button_logout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="CloseActivity"
android:text="#+string/back" />
<Button
android:id="#+id/button_exit"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:onClick="GoToEditProfile"
android:text="#+string/edit" />
</LinearLayout>
</LinearLayout>
hope help you.
in your linear layout (at the bottom) add it to be situated below the scrollview
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:orientation="horizontal"
android:layout_below=""#+id/scrollView1" <-- this code
>
and also change the main base layout to linearlayout so it wont overlap
<LinearLayout 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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".ActivityProfile"
android:orientation='horizontal'
>
dont forget to change the tab at the very end
</LinearLayout>

Categories

Resources