Android - Messaging application layout - android

I am trying to reproduce the layout from the stock Android messaging app. I've done this using a list view with a custom adapter for the conversation and a fixed layout for the "send message" part. It looks something like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp" >
<ListView
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/sendMsgLayout"
android:overScrollMode="always"
android:stackFromBottom="true"
android:layout_alignParentTop="true" >
</ListView>
<RelativeLayout
android:id="#+id/sendMsgLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp" >
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/list_divider" />
<EditText
android:id="#+id/messageText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_toLeftOf="#+id/imageSend"
android:hint="#string/type_message"
android:maxLines="3" >
<requestFocus />
</EditText>
<ImageView
android:id="#+id/imageSend"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/messageText"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="#drawable/send" />
</RelativeLayout>
This is my latest version of the layout, I've also used a LinearLayout as the parent with weight set to 1 for the list view.
The edit text has max 3 lines. The problem comes when one line is not enough to hold the text and the edit text grows. It covers part of the list view.
I think I should scroll the list view whenever the edit text grows in dimension but I could not achieve that.
Any ideas on how to tackle this one ?

Set the listview transcriptMode to normal, alternativly alwaysScroll and as pointed out by #andreid remove android:overScrollMode="always".
android:transcriptMode="normal"
or in code:
listView.setTranscriptMode(AbsListView.TRANSCRIPT_MODE_NORMAL);

Try this code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:orientation="vertical" >
<ListView
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:stackFromBottom="true"
android:layout_weight="1" >
</ListView>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/list_divider" />
<LinearLayout
android:id="#+id/sendMsgLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginTop="20dp"
android:orientation="horizontal" >
<EditText
android:id="#+id/messageText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginLeft="10dp"
android:hint="#string/type_message"
android:maxLines="3" >
<requestFocus />
</EditText>
<ImageView
android:id="#+id/imageSend"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:src="#drawable/send" />
</LinearLayout>
</LinearLayout>

Try this way,hope this will help you to solve your problem.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="2dp"
android:orientation="vertical">
<ListView
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:overScrollMode="always"
android:stackFromBottom="true"
android:layout_marginBottom="5dp"/>
<LinearLayout
android:id="#+id/sendMsgLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/messageText"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:hint="#string/type_message"
android:maxLines="3" >
<requestFocus />
</EditText>
<ImageView
android:id="#+id/imageSend"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/send" />
</LinearLayout>
</LinearLayout>

Related

To push Linear Layout with soft keyboard

Hi I've an xml layout in which I've two buttons at the bottom of the parent layout. Here whenever the soft keyboard opens those buttons are hidden, therefore I need to push the button above with the keyboard. I've posted my xml layout here, please refer to it and help me achieving this.
<?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:isScrollContainer="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/view1"
android:orientation="horizontal">
<RelativeLayout
android:id="#+id/leftPane"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3">
<ListView
android:id="#+id/Left_listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0A2F41"
android:duplicateParentState="true"
android:fadingEdge="vertical"
android:gravity="center"
android:listSelector="#335E73"
android:scrollbars="none"
android:smoothScrollbar="true"
android:soundEffectsEnabled="true" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rightPane"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5">
<EditText
android:id="#+id/searchkeyword_editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableRight="#drawable/icon_close"
android:hint="Search"
android:inputType="textNoSuggestions"
android:maxLines="1"
android:paddingRight="10dp" />
<ListView
android:id="#+id/right_listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/searchkeyword_editText"
android:fadingEdge="vertical"
android:gravity="center"
android:scrollbars="none"
android:smoothScrollbar="true"
android:soundEffectsEnabled="true" />
</RelativeLayout>
</LinearLayout>
<View
android:id="#+id/view1"
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:layout_above="#+id/bottom_linearLayout"
android:background="#000"
android:visibility="visible" />
<LinearLayout
android:id="#+id/bottom_linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:visibility="visible">
<TextView
android:id="#+id/cancel_textView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="12dp"
android:text="Cancel"
android:textSize="15sp" />
<View
android:layout_width="0.5dp"
android:layout_height="match_parent"
android:background="#000" />
<TextView
android:id="#+id/apply_textView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#02B5CC"
android:gravity="center"
android:padding="12dp"
android:text="Apply"
android:textColor="#fff"
android:textSize="15sp"
android:visibility="visible" />
</LinearLayout>
</RelativeLayout>
Also in my Manifest I've added the below line in order to achieve the above action.
android:windowSoftInputMode="stateVisible|adjustResize"
I'd like to have something like this.
Try this:
android:windowSoftInputMode="adjustPan|adjustResize"

Organizing layouts with edit text at bottom?

I wanted to make a layout with 3 LinearLayouts. In the 2nd LinearLayout I would have a ListView and the 3rd LinearLayout I would have an EditText and Button at the bottom. This was my attempt:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fresco="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/view_post"
android:layout_width="fill_parent"
android:layout_height="200dp"
android:background="#color/com_facebook_blue">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/view_status"/>
</LinearLayout>
<LinearLayout
android:id="#+id/view_comments"
android:layout_below="#+id/view_post"
android:layout_width="match_parent"
android:layout_height="250dp">
<ListView
android:id="#+id/lv_comments_feed"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ListView>
</LinearLayout>
<LinearLayout
android:layout_below="#+id/view_comments"
android:id="#+id/send_message"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:orientation="horizontal" >
<EditText
android:id="#+id/write_comment"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_weight="5"
android:gravity="top|left"
android:inputType="textMultiLine"
android:scrollHorizontally="false" />
<Button
android:id="#+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center"
android:text="send"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</RelativeLayout>
Now the design looks great but when I load the app on my phone, I have 2 problems:
I don't want to hardcode the LinearLayout heights. I have looked into layout_weight but I can't seem to have these layout_weights work without running into the 2nd problem below:
When I click the EditText, the EditText is hidden even though I have declared android:windowSoftInputMode="adjustResize|stateHidden" in my activity and I'm not sure why that's happening. Also, the EditText and Button are not directly at the bottom of the screen which is what I would want. Any help is appreciated, thanks!
you don't need to add listview as child of linear layout. and avoid fill_parent & use match_parent. if first linear layout is only for textview then don't use it inside of linearlayout. or only use wrap_content instead of a specific layout_height
Here i made some changes hope it will work
<?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="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/view_post"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#222dc9">
<TextView
android:id="#+id/view_status"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/send_message"
android:layout_below="#id/view_post"
></ListView>
<LinearLayout
android:id="#+id/send_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<EditText
android:id="#+id/write_comment"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_weight="5"
android:gravity="top|left"
android:inputType="textMultiLine"
android:scrollHorizontally="false" />
<Button
android:id="#+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center"
android:text="send"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</RelativeLayout>
and use in Manifest with activity name is
android:windowSoftInputMode="adjustPan"
<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"
tools:context=".MainActivity">
<RelativeLayout
android:id="#+id/view_post"
android:layout_width="match_parent"
android:background="#color/material_grey_300"
android:padding="5dp"
android:layout_height="wrap_content">
<TextView
android:id="#+id/view_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/view_comments"
android:layout_above="#+id/send_message"
android:layout_below="#+id/view_post"
android:layout_width="match_parent"
android:background="#color/material_deep_teal_200"
android:padding="10dp"
android:layout_height="match_parent">
<ListView
android:id="#+id/lv_comments_feed"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</ListView>
</RelativeLayout>
<LinearLayout
android:id="#+id/send_message"
android:background="#color/material_blue_grey_800"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true">
<EditText
android:id="#+id/write_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:inputType="textMultiLine"
android:scrollHorizontally="false" />
<Button
android:id="#+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dp"
android:layout_weight="1"
android:text="send" />
</LinearLayout>
</RelativeLayout>

Why is HorizontalScrollView scrolling to right?

The below XML contains an EditText control. As soon as I touch it, the softkeyboard appears but the HorizontalScrollView scrolls to the right so I cannot see the EditText!
Can somebody please tell me what is wrong with the below XML and why it is doing this?
Please excuse hardcoded widths - this is only a test bit of code for sanity checking.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<HorizontalScrollView
android:id="#+id/testScrollView"
android:layout_width="1280dp"
android:layout_height="match_parent"
android:scrollbars="horizontal"
android:background="#00FF00">
<LinearLayout
android:id="#+id/layout"
android:layout_width="2560dp"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/mLeftBaseLinearLayout"
android:layout_width="1280dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#FF0000">
<EditText
android:id="#+id/mEditText"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#BBBBBB"
android:gravity="center"
android:text="EditText"
android:textColor="#FFFF00"
android:textSize="30dp"
android:singleLine="true"
android:clickable="true"
android:editable="true"
android:focusable="true"
android:focusableInTouchMode="true"
android:inputType="text"/>
<ListView
android:id="#+id/mListView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#80FFFFFF" >
</ListView>
</LinearLayout>
<LinearLayout
android:id="#+id/linLayout"
android:layout_width="1280dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#00FF00">
<Button
android:layout_width="600dp"
android:layout_height="wrap_content"
android:text="Button1" />
<Button
android:layout_width="600dp"
android:layout_height="wrap_content"
android:text="Button2" />
</LinearLayout>
</LinearLayout>
</HorizontalScrollView>
</FrameLayout>
My tablet is running Android 4.2.1
Ok, I have been looking at your layout and made a few changes and it looks ok on my computer.
Firstly, mEditText is unnecessary and avoidable. If you want a header for mListView
yourListView.addHeaderView(View v, Object data, boolean isSelectable);
This is what I did:
<?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" >
<HorizontalScrollView
android:id="#+id/testScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00FF00"
android:scrollbars="horizontal" >
<LinearLayout
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/mLeftBaseLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FF0000"
android:orientation="vertical" >
<EditText
android:id="#+id/mEditText"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#BBBBBB"
android:clickable="true"
android:editable="true"
android:focusable="true"
android:focusableInTouchMode="true"
android:gravity="center"
android:inputType="text"
android:singleLine="true"
android:text="EditText"
android:textColor="#FFFF00"
android:textSize="30dp" />
<ListView
android:id="#+id/mListView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#80FFFFFF" >
</ListView>
</LinearLayout>
<LinearLayout
android:id="#+id/linLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00FF00"
android:orientation="vertical" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button2" />
</LinearLayout>
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
If this does not work we need to look at your code.
I found my solution - override scrollTo() and do absolutely nothing.

Android - EditText isn't filling up available space in a fragment?

I'm having an issue with my EditText (with id of body) not filling up the available space in my layout. I've been searching everywhere and experimenting with numerous resources, but I just simply can not seem to get it and have been spending hours on literally just this.. I'm guessing there is an issue with how my entire layout is set up, and probably can't just make a tweak in EditText. By the way this layout is being used in a fragment, maybe that changes things? I'm not sure, what do you guys think? Thanks for any and all help! Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/title" />
<EditText android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/body" />
<EditText
android:id="#+id/body"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="top"
android:hint="write those saucy lyrics"
android:layout_marginTop="5dp"
android:scrollbars="vertical" />
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/confirm"
android:text="#string/confirm"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/btnEmail"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="#string/btnEmail"
android:alpha="1" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I'm looking for my design to look like this (taken from my graphical layout editor):
However on my device it looks like this(snapshot from my device):
Try this..
Change android:layout_height="wrap_content" to android:layout_height="0dp"
<EditText
android:id="#+id/body"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical" />
// try this way,hope this will help you...
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/title"/>
<EditText
android:id="#+id/body"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="top"
android:hint="#string/body"
android:layout_marginTop="5dp"
android:scrollbars="vertical" />
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/confirm"
android:text="#string/confirm"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/btnEmail"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="#string/btnEmail"
android:alpha="1" />
</LinearLayout>
</LinearLayout>
Make
android:layout_height="match_parent"
instead of
android:layout_height="wrap_content"
in Body edit text
So that it becomes
<EditText
android:id="#+id/body"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="top"
android:scrollbars="vertical" />
UPDATE:
Plz try following layout
<!-- Put the buttons at the bottom -->
<RelativeLayout
android:id="#+id/rel_lay_btn"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/confirm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="Confirm" />
<Button
android:id="#+id/btnEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:alpha="1"
android:text="Emial" />
</RelativeLayout>
<!-- Put the title layout at the top of parent -->
<LinearLayout
android:id="#+id/lin_lay_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentTop="true" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title" />
<EditText
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
<!-- Occupy rest of the space of screen -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:layout_above="#id/rel_lay_btn"
android:layout_below="#id/lin_lay_title">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Body" />
<EditText
android:id="#+id/body"
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="top"
android:layout_weight="1"
android:scrollbars="vertical" />
</LinearLayout>

how to set a button at the bottom of a screen when the parent is a scroll view?

I have a scrollView (this is a solution to support landscape computability)
and in it one child- linearLayout.
I want to pose a button at the bottom of a screen.
layout_height = match_parent is problematic as the scroll can be infinite.
How can I do this, to be compatible to all screen resolution?
this is my xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.m"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blue_bg" >
<LinearLayout
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical" >
<com.m.view.text.mTextView
android:id="#+id/verifyHeaderText"
style="#style/textOnBg"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="30dp"
android:layout_marginTop="50dp"
android:text="ENTER VERIFICATION CODE"
android:textAllCaps="true"
android:textColor="#android:color/white"
app:font_type="varela" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:paddingBottom="5dp"
android:paddingLeft="25dp"
android:paddingRight="25dp"
android:paddingTop="5dp" >
<LinearLayout
android:id="#+id/inputBox"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:background="#drawable/input_box_idle"
android:orientation="horizontal" >
<EditText
android:id="#+id/verificationCodeEditText"
style="#style/textOnBg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:hint="- - - - -"
android:inputType="number"
android:maxLength="5"
android:textColor="#00bcfe"
android:textSize="25dp"
android:textStyle="italic" >
</EditText>
</LinearLayout>
</LinearLayout>
<Button
android:id="#+id/continueButton"
style="#style/textOnBg"
android:layout_width="250dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10dp"
android:background="#drawable/btn_selector"
android:text="Continue"
android:textColor="#00bcfe"
android:textSize="16dp"
android:textStyle="italic" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
this is the result on wide-screen
The button is in the bottom of the scroll which spans 3/4 of the whole screen
Add android:fillViewport="true" to your scrollview:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.m"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blue_bg"
android:fillViewport="true" >
Apply this to your layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Your scroll view -->
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_marginBottom="#dimen/ar_button_height"
android:gravity="center" >
<Button
android:id="#+id/button_at_bottom"
android:layout_width="match_parent"
android:layout_height="#dimen/ar_button_height"
android:layout_alignParentBottom="true"
android:gravity="center"
android:orientation="horizontal"
android:showDividers="middle" >
</Button>
</ScrollView>
</RelativeLayout>
Not sure if there is a better solution, but you could put your scroll view inside a relative layout and have your button outside the scroll view and set android:layout_alignParentBottom="true" on the button
If you want to set the button at the bottom you need to implement your layout with weight.
First of all the scrollview can only have one child layout inside it.
Secondly add your content layout inside the child layout of it, set the layout_height to 0dp, and do remember to set the weight to 1.
And at last add your button at the bottom of your content layout and set its height and set the weight to be 0.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="#+id/scrollMain"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="always"
android:background="#00000000"
android:scrollbars="none">
<LinearLayout
android:overScrollMode="always"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
android:background="#FFFFFF"
android:paddingTop="5dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</LinearLayout>
<Button android:layout_width="match_parent"
android:layout_height="35dp"
android:layout_weight="0" />
</LinearLayout>
</ScrollView>
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical" >
<com.m.view.text.mTextView
android:id="#+id/verifyHeaderText"
style="#style/textOnBg"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="30dp"
android:layout_marginTop="50dp"
android:text="ENTER VERIFICATION CODE"
android:textAllCaps="true"
android:textColor="#android:color/white"
app:font_type="varela" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:paddingBottom="5dp"
android:paddingLeft="25dp"
android:paddingRight="25dp"
android:paddingTop="5dp" >
<LinearLayout
android:id="#+id/inputBox"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:background="#drawable/input_box_idle"
android:orientation="horizontal" >
<EditText
android:id="#+id/verificationCodeEditText"
style="#style/textOnBg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:hint="- - - - -"
android:inputType="number"
android:maxLength="5"
android:textColor="#00bcfe"
android:textSize="25dp"
android:textStyle="italic" >
</EditText>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
<Button
android:id="#+id/continueButton"
style="#style/textOnBg"
android:layout_width="250dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10dp"
android:background="#drawable/btn_selector"
android:text="Continue"
android:textColor="#00bcfe"
android:textSize="16dp"
android:textStyle="italic" />
USe your button here
You can use scrollView inside relativeLayout to fix your button at bottom:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/radialback">
<ScrollView android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_below="#+id/top_header"
>
<EditText
android:id="#+id/editmessage"
android:layout_margin="2dp"
style="#style/editView"
android:inputType="textMultiLine"
android:digits="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890 _-.,()"
android:maxLength="500"
/>
</LinearLayout>
</ScrollView>
<Button
android:id="#+id/submitbutton"
android:text="#string/submitbutton"
style="#style/submitView"
android:layout_alignParentBottom="true" />
</RelativeLayout>

Categories

Resources