Develop Reference

Buttons gone after added swiperefreshlayout

I have a layout with listview and two buttons side by side at the bottom of the listview. Everything work fine until I have added the swiperefreshlayout for my listview.
My codes are as below.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#FFF"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/search_bar"
android:background="#color/colorPrimaryDark"
android:orientation="vertical"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
>
<EditText
android:id="#+id/keyword_editText"
android:layout_width="fill_parent"
android:layout_height="30dp"
android:background="#drawable/search_edit_text"
android:hint="Keyword"
android:textColorHint="#color/list_item_title"
android:textColor="#000"
android:layout_centerVertical="true"
android:maxLines="1"/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/listView_layout"
android:orientation="vertical"
android:layout_below="#+id/search_bar"
>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/refresh"
android:layout_height="match_parent"
android:layout_width="match_parent">
<ListView
android:layout_width="wrap_content"
android:layout_height="0dip"
android:layout_weight="1"
android:id="#+id/RsListView"
android:dividerHeight="1dp"
android:divider="#D3D3D3"/>
</android.support.v4.widget.SwipeRefreshLayout>
<LinearLayout
android:id="#+id/test"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<Button
android:id="#+id/req_history_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Request History"
android:layout_weight="1"
android:background="#drawable/request_history_button"
android:textColor="#drawable/button_text_color"
/>
<Button
android:id="#+id/apprv_history_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Approval History"
android:layout_weight="1"
android:background="#drawable/approval_history_button"
android:textColor="#drawable/button_text_color"
/>
</LinearLayout>
</LinearLayout>
Sorry for dumping my codes here as I can't figure out any other way for you guys to understand my code.
Please help

Inside LinearLayout usually all children have even dimension according to orientation. However, when you would like one child to take a little amount of place and another to fill the rest, you might be interested in layout_weight parameter. If the child that should fill the space gets android:layout_weight="1" it will fill the space making a place for other views.
In order to see the buttons add android:layout_weight="1" to SwipeRefreshLayout and set android:layout_height="0dp". That will make your buttons visible.

Show 3 scrollable ListViews of equal height in Android Layout

I am trying to show three different vertical sections in my Android layout on one screen, each taking up one third of the screen, one on the top, one in the middle, and one on the bottom. Each section has a TextView and a ListView, and the ListViews can scroll so that you can see all items, but the overall page does not move. I have tried putting each TextView and ListView in a LinearLayout and setting the height of each LinearLayout to one third the total height of the screen, but the first ListView just shows all the items in it, taking up most of the screen, and the other sections are pushed down. I also tried using layout_weights, but for some reason it did not work. (EDIT: Setting layout_weight="1" ended up working, I'm not sure what I did wrong the first time) How can I make this work, or is there a better way to go about this?

<LinearLayout
android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="horizontal" >
<ListView android:layout_width="0dp" android:layout_weight="1"
android:layout_height="match_parent" android:background="#FF0000"/>
<ListView android:layout_width="0dp" android:layout_weight="1"
android:layout_height="match_parent" android:background="#00FF00">
<ListView android:layout_width="0dp" android:layout_weight="1"
android:layout_height="match_parent" android:background="#0000FF">
</LinearLayout>
This will give you three equally wide columns: to make it rows, change the orientation to vertical and swap the values of layout_height and layout_width for each listview. If you need to add the TextViews, you'll have to make each listview in this code either a RelativeLayout LinearLayout or FrameLayout, using same width/height/weight and arranging the ListView and TextView inside to taste. To do this most efficiently, use a Framelayout and use a margin on the listview to offset it from the TextView. You can place the TextView relative to the ListView inside the FrameLayout by using the layout_gravity in the TextView.
Ie (swapping the first "column"):
<FrameLayout android:orientation="vertical" android:layout_width="0dp"
android:layout_weight="1" android:layout_height="match_parent"
android:background="#FF0000">
<TextView android:text="Column!" android:background="#3Eff0000"
android:layout_height="40dp" android:layout_width="match_parent">
<ListView android:layout_marginTop="48dp" android:layout_height="match_parent"
android:layout_width="match_parent" android:background="#8Aff0000"/>
</FrameLayout>

Use 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="horizontal"
android:weightSum="3">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ff89ff91">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#1"
android:id="#+id/textView"
android:padding="5dp"
android:gravity="center" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_below="#+id/textView" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffff8177">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#2"
android:id="#+id/textView2"
android:padding="5dp"
android:gravity="center" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView2"
android:layout_below="#+id/textView2" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#ffffe85d">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#3"
android:id="#+id/textView3"
android:padding="5dp"
android:gravity="center" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView3"
android:layout_below="#+id/textView3" />
</RelativeLayout>
</LinearLayout>

Remove padding on listview

Hi I have an annoying problem I want to place a button as part of an action bar at the bottom of my listview but there is some padding just above below the last item of the listview I can't get rid of. Here is my code any help would be greatly appreciated.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:drawingCacheQuality="high">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:drawingCacheQuality="high"
android:paddingBottom="0dp"
android:layout_margin="0dp"
>
<ListView
android:id="#+id/messagingListView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="#null"
android:layout_margin="0dp"
android:layout_alignParentTop="true"
android:dividerHeight="10dp"
android:paddingTop="10dp"
android:paddingRight="10dp"
android:paddingBottom="0dp"
android:paddingLeft="10dp"
/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="0dp"
android:background="#FFFFFF"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="new_game"
android:textColor="#FFFFFF"
/>
</LinearLayout>

A simpler layout would look like this :
A vertical LinearLayout to contain the ListView and the action bar
The LinearLayout used for the action bar has its height to wrap_content so it only gets the height required by its children
The ListView has its height to 0dp and its weight to 1 in order to let it take all the available space left by the action bar
<?xml version="1.0"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:drawingCacheQuality="high">
<ListView
android:id="#+id/messagingListView"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:divider="#null"
android:layout_margin="0dp"
android:dividerHeight="10dp"
android:paddingTop="10dp"
android:paddingRight="10dp"
android:paddingBottom="0dp"
android:paddingLeft="10dp" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="0dp"
android:background="#FFFFFF">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="new_game"
android:textColor="#FFFFFF" />
</LinearLayout>
</LinearLayout>
If space remains, you should definitly show us the layout used for list items
Note :
In Android Studio, try to single click on the LinearLayout to let it be highlighted in the Preview, then on the ListView to see if there is a gap (Use the zoom).
If you see a gap with the layout just above, it's an Android Studio Preview bug on your computer, it works on every devices.

Android Scroll view Image and text

I am solving a problem with image and text in one scroll view. The main problem is, that I get different image height from server side . But the place with image should be all the time same.
Now the height of image place is dynamic. The text should be scrollable with the image.
Is there any possibility how to make the image height static?
Thank you!
EDIT
<?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" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/article_gallery"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="4" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageView
android:id="#+id/article_image_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/sipka_l" />
<ImageView
android:id="#+id/article_image"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1" />
<ImageView
android:id="#+id/article_image_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/sipka_p" />
</LinearLayout>
<TextView
android:id="#+id/image_desc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#color/tran_dark_gray"
android:gravity="center"
android:padding="#dimen/size_8"
android:textAppearance="#style/xsmallLight" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="6"
android:background="#color/opaq_light"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="#dimen/size_16" >
<TextView
android:id="#+id/article_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/size_12"
android:textAppearance="#style/normalBold" />
<TextView
android:id="#+id/article_body"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="#style/xsmall" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</FrameLayout>

If you declare the ImageView with a fixed width and height it will remain static all the time.
Try something like:
<ImageView
android:id="#+id/imageView1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
Put this ImageView inside a ScrollView and ofcourse put your TextView inside the same ScrollView.

you can use layout weights for your linearlayout. Set the width to 0 and let the weight determine actual size. Setting weight to 0.33 each gives each images 1/3 of the screen.
Or you could set one to 0.5 and the others to 0.25 each or whatever makes sense for your app.
Set the 3 images as:
<ImageView
android:id="#+id/article_image_back"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.33"
android:layout_gravity="center_vertical"
android:src="#drawable/sipka_l" />

Android: keep UI with constant size

In my android application i have to design an UI. I have to distribute area of scrollview(70%) and relativelayout(30%) within a linearlayout(100%). But in my code it changes its area with the change of button in scrollview and consume the area of relativelayout. Here is my code
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/lastLayout"
android:layout_weight="70"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/linear_layout_add"
android:background="#drawable/albumbackground"
android:padding="10dp"
>
</LinearLayout>
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:layout_weight="30"
>
<ImageButton
android:id="#+id/albumAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginRight="24dp"
android:layout_marginTop="10dp"
android:layout_toLeftOf="#+id/albumremove"
android:src="#drawable/add" />
<ImageButton
android:id="#+id/albumremove"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_alignParentRight="true"
android:layout_marginRight="58dp"
android:src="#drawable/delete" />
</RelativeLayout>
when there few buttons then the UI shows like this
but when the no of button increase the UI shows like this
how can i keep the scrollview and relativelayout size constant? thanks...

Set android:layout_height="0dp" on both children of LinearLayout.
Weights are to fill unused space. If your children have size of 0 unused space will be divided like you want it.