Layout: TextView at the top and ListView at the center - android

Currently my ListView is exactly below my TextView. How can I make the ListView at the center of the screen while my TextView maintain its position on top?
Below is my layout:
<?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:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/hp_color"
tools:context=".MainActivity" >
<TextView
android:id="#+id/cityText"
style="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<TextView
android:id="#+id/condDescr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/cityText" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/condDescr"
android:orientation="vertical" >
<ListView
android:id="#+id/mainListView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true" />
</LinearLayout>
</RelativeLayout>

You can use Gravity to place the listview in center of the screen.
<?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:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/hp_color"
tools:context=".MainActivity" >
<TextView
android:id="#+id/cityText"
style="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<TextView
android:id="#+id/condDescr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/cityText" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/condDescr"
**android:gravity="center_vertical|center_horizontal"**
android:orientation="vertical" >
<ListView
android:id="#+id/mainListView"
android:layout_width="70dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true" />
</LinearLayout>
</RelativeLayout>

Try setting
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
And although I'm no expert here, it's my impression that there's little point to having a ListView in a LinearLayout. Both are scrollable (which isn't advised) and there's not much point if LinearLayout only has one child.

Related

Button is now at the TOP after setting setEmptyView

After setting the setEmptyView, the button which was formerly at the bottom now goes up to the top of layout. Please help me figure out why. Here's my code:
activity_list.xml :
<?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:gravity="top|center"
android:orientation="vertical" >
<ListView
android:id="#+id/listview_snyc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
</ListView>
<Button
android:id="#+id/button_refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:gravity="center"
android:text="Sync" />
</LinearLayout>
activity_list_empty.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="match_parent" >
<ImageView
android:id="#+id/imageview_empty"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/empty" />
</RelativeLayout>
Java Code :
list = (ListView) findViewById(R.id.listview_snyc);
list.setAdapter(new MasterFileMenuAdapter(this,data));
View emptyView = getLayoutInflater().inflate(R.layout.activity_list_empty, null);
addContentView(emptyView, list.getLayoutParams());
list.setEmptyView(emptyView);
Whenever the ListView is empty I got this result:
The Refresh Button should be in the bottom not on the top.
Any idea?
Use RelativeLayout in the activity_list.xml as well and put
alignParentBottom="true"
in the Button tag
Move your button to your empty view and align it to bottom:
activity_list.xml :
<?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:gravity="top|center"
android:orientation="vertical" >
<ListView
android:id="#+id/listview_snyc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
</ListView>
</LinearLayout>
activity_list_empty.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="match_parent" >
<ImageView
android:id="#+id/imageview_empty"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/empty" />
<Button
android:id="#+id/button_refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:gravity="center"
android:layout_alignParentBottom="true"
android:text="Sync" />
</RelativeLayout>

How to apply background Image on ScrollView android

I want to apply background image on Relativelayout Under ScrollView.
The Image Appear on XML View but Not Appear on Actual device.
I have added ImageView on Ralativelayout
>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
android:id="#+id/parentView"
>
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/cloudbg"
/>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:id="#+id/vo"
android:layout_below="#id/relativeLayout"
android:layout_marginTop="20dp"
android:layout_marginLeft="20dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="XYZ"
/>
<TextView
android:layout_width="wrap_content"
android:layout_marginLeft="25dp"
android:layout_height="wrap_content"
android:id="#+id/textvo"
android:text="Voter Number"
/>
</LinearLayout>
</RelativeLayout>
</ScrollView>
Thanks
can try this way:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/cloudbg">
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:id="#+id/vo"
android:layout_below="#id/relativeLayout"
android:layout_marginTop="20dp"
android:layout_marginLeft="20dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="XYZ"
/>
<TextView
android:layout_width="wrap_content"
android:layout_marginLeft="25dp"
android:layout_height="wrap_content"
android:id="#+id/textvo"
android:text="Voter Number"
/>
</LinearLayout>
</ScrollView>
Use android:background="#drawable/background_image" attribute in Relative or Linear Layout tag.
Set background for scrollview
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/ic_launcher" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
</LinearLayout>
</ScrollView>

Relative layout placing to other relative layout

I am developing a chat app.I want to place edittext to bottom then messages above it.But I have a problem:
I don't want to place messages to top of edittext and button.How can I prevent this ? This is my 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="match_parent"
android:background="#ECECFB"
android:orientation="vertical" >
<ListView
android:id="#+id/message_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<EditText
android:id="#+id/message"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/get_from_user"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:text="Gönder" />
</RelativeLayout>
</RelativeLayout>
And I have one more question.How can I do message list system like other chat apps ? I mean when I send a message this message place to bottom of the list not to top.Now in my xml it's placing to top.Like this:
Set your ListView above the EditText layout.
Your layout will be as below :
<?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:background="#ECECFB">
<RelativeLayout
android:id="#+id/bottom_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<EditText
android:id="#+id/message"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/get_from_user"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:text="Gönder" />
</RelativeLayout>
<ListView
android:id="#+id/message_list"
android:layout_above="#id/bottom_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
And for your second problem, set
android:stackFromBottom="true"
android:transcriptMode="normal"
to the ListView
For example, add
android:layout_below="#id/message_list"
to your inner RelativeLayoutto constrain the ListView and bottom RelativeLayout not to lay out on top of each other.
Try this:
Add this to your Relative layout : android:layout_below="#+id/message_list"
and change your listview to wrap_content
Basically do 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="match_parent"
android:background="#ECECFB"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/comment_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true" >
<EditText
android:id="#+id/message"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<requestFocus />
</EditText>
<Button
android:id="#+id/get_from_user"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:text="Gönder" />
</RelativeLayout>
<ListView
android:id="#+id/message_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/comment_layout"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
</ListView>
</RelativeLayout>
Try changing this:
<ListView
android:id="#+id/message_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"/>
To this:
<ListView
android:id="#+id/message_list"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
This should do the trick
First Problem:
You need to set on RelativeLayout
android:bellow="#+id/message_list"
2º Problem:
You need to set on ListView:
android:stackFromBottom="true"
android:transcriptMode="normal"
Final 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="match_parent"
android:background="#ECECFB"
android:orientation="vertical" >
<ListView
android:id="#+id/message_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stackFromBottom="true"
android:transcriptMode="normal"/>
<RelativeLayout
android:bellow="#+id/message_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<EditText
android:id="#+id/message"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/get_from_user"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:text="Gönder" />
</RelativeLayout>
</RelativeLayout>
Add android:layout_above="#+id/id_of_relative_layout".
Add an ID to the RelativeLayout which contains the EditText.

Android: How to place a linear layout showing a image at the bottom of a layout?

I have used LinearLayout in my activity, in that I need to display another LinearLayout containing image to be displayed at the bottom.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:background="#drawable/gamelevelscreen"
android:orientation="vertical" >
.......
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:gravity="center">
</LinearLayout>
</LinearLayout>
But the image is not completely aligned at the bottom. Its a little above the bottom.
I have completed the layout designing and it will be a lot of rework to make it Relative now. Kindly give solution to make it happen in LinearLayout only.
Use Relative layout instead of Linear layout or use Weight for doing this in Linear layout.
Try this it will surely help you.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</RelativeLayout>
Try this..
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/gamelevelscreen"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center"
android:layout_alignParentBottom="true">
</LinearLayout>
</RelativeLayout>
// try this
<?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:padding="5dp"
android:orientation="vertical" >
<LinearLayout
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_weight="1">
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<ImageView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher"/>
</LinearLayout>
</LinearLayout>

Center a View in Android between bottom and top views

I need somehow to do this :
I tried playing with Relative Layout, I placed top imageview and bottom button but how do I place my gridview in the center? BUT BETWEEN top image and bottom button?
Have the top image and the bottom button use wrap_content for height, and the GridView use 0dip for height along with a weight of 1. This will cause the top and bottom elements to measure first, and the GridView will get all remaining space in the middle.
<?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">
<ImageView android:id="#+id/top_image"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<GridView android:id="#+id/grid"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" />
<Button android:id="#+id/bottom_button"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
adamp's answer didn't work for me. This is what I found to work perfectly:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView android:id="#+id/top_image"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<Button android:id="#+id/bottom_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
<LinearLayout
android:id="#+id/container_layout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/bottom_button"
android:layout_below="#id/top_image"
android:gravity="center" >
<GridView android:id="#+id/grid"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
</RelativeLayout>
I've used this with other LinearLayouts in place of the GridView, with android:gravity="center" set on the innermost layout as well to make all of its text views and images centered horizontally as well as vertically.
use something like this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/table">
<TableRow
android:weightSum="100">
<ImageView android:id="#+id/image1"
android:src="#drawable/icon"
android:visibility="visible"
android:gravity="center"
android:layout_weight="50" />
</TableRow>
<TableRow
android:weightSum="100">
<GridView
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</GridView>
</TableRow>
<TableRow
android:weightSum="100">
<Button android:id="#+id/btn1"
android:visibility="visible"
android:gravity="center"
android:layout_weight="50" />
</TableRow>
</TableLayout>
</LinearLayout>
You could try this:
<?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">
<ImageView android:id="#+id/top_image"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<GridView android:id="#+id/grid1"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" />
<Button android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Add these to your Grid View:
android:layout_above="#id/bottom_button"
android:layout_below="#id/top_image"

Categories

Resources