Develop Reference

Why is ScrollView creating a gap in my activity?

I used the following code to display a series of image Buttons vertically. I can successfully scroll through the images that I created but there's a gap in the middle of the screen that I can't fix. I believe that the error stems from the LinearLayout I used but switching that out with a relative or contained layout that didn't change anything.
My code:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/homepbckrnd">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="#+id/imageButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
app:srcCompat="#mipmap/facebook" />
<ImageButton
android:id="#+id/imageButton2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="229dp"
app:srcCompat="#drawable/ddrr" />
<ImageButton
android:id="#+id/imageButton3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="0dp"
app:srcCompat="#drawable/ic_poll_black_24dp" />
<ImageButton
android:id="#+id/imageButton4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="0dp"
app:srcCompat="#mipmap/google" />
<ImageButton
android:id="#+id/imageButton5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ddrr" />
<ImageButton
android:id="#+id/imageButton6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="#mipmap/facebook" />
<ImageButton
android:id="#+id/imageButton7"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="#mipmap/facebook" />
</LinearLayout>
</ScrollView>
</RelativeLayout>

Remove android:layout_marginTop="229dp" from your imageButton2 as by doing that you are applying a top margin of 229dp on your image which is causing this issue for you.

How can I Listview to fit?

I have a ListView which contains ImageView, TextView and Checkbox but,
When textView is long, checkBox is almost unavailable. I want to ListView to fit for a line.
How can I solve a problem that I have mentioned in the image?
ROW
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:padding="0dp"
android:weightSum="100" >
<ImageView
android:id="#+id/newImage"
android:layout_width="88dp"
android:layout_height="match_parent"
android:layout_weight="0.25"
android:clickable="false"
android:hapticFeedbackEnabled="false"
android:saveEnabled="false" />
<TextView
android:id="#+id/newTaskTitle"
android:layout_width="wrap_content"
android:layout_height="63dp"
android:layout_alignParentTop="true"
android:layout_marginStart="11dp"
android:gravity="center_vertical"
android:text="Example"
android:textSize="20sp"
android:layout_weight="78.57" />
<CheckBox
android:id="#+id/checkBox"
android:layout_width="51dp"
android:layout_height="match_parent"
android:layout_weight="18.45"
android:gravity="left|center"
android:text="#string/checkBox" />
</LinearLayout>
</RelativeLayout>
LISTVIEW
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="203dp"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#android:color/transparent"
android:elevation="0dp"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme" />

Your Imageview width is already defined, So we should deal with 2 views and one should always be at right, and middle text to be flexible, so we can give weight to textview it will work fine.
You can try 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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true">
<ImageView
android:id="#+id/newImage"
android:layout_width="88dp"
android:layout_height="match_parent"
android:clickable="false"
android:hapticFeedbackEnabled="false"
android:saveEnabled="false"/>
<TextView
android:id="#+id/newTaskTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="sdfsdfs"
android:textSize="20sp"/>
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="left|center"
android:text="checkBox"/>
</LinearLayout>
</RelativeLayout>

How to align the layouts properly in Android?

I want to align a scrollable TextView above a RelativeLayout) with 3 buttons at the bottom and a SeekBar above this buttons. The problem with my code is that the RelativeLayout takes the entire screen.
Here's my code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/images"
android:orientation="vertical"
tools:context="com.example.acer.aartisangrah.ekdanta">
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="#+id/textView9"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:enabled="true"
android:focusable="true"
android:longClickable="true"
android:textIsSelectable="true" />
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/b9"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="10dp"
android:onClick="decrease"
android:background="#drawable/zoomout1"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<Button
android:id="#+id/b10"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:onClick="increase"
android:layout_marginRight="10dp"
android:background="#drawable/zoomin1"/>
<Button
android:layout_width="50dp"
android:layout_height="50dp"
android:id="#+id/button19"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="#drawable/play"/>
<SeekBar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/seekBar"
android:layout_above="#+id/b9"
android:configChanges="orientation|screenSize"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_toStartOf="#+id/b10"
android:layout_alignRight="#+id/b10"
android:layout_alignEnd="#+id/b10"
android:layout_weight="1"/>
</RelativeLayout>
</LinearLayout>
Check this image

Change the height of the ScrollView to android:layout_height="wrap_content"
and remove the android:layout_weight="1"

The following layout should do the job. Firstly, there was a circular dependency in height among <RelativeLayout> and <SeekBar>, so I fixed the height of <SeekBar>. Secondly, the android:layout_alightParentBottom="true" was messing with the layout manager, so removed that. Finally, moved the <SeekBar> above the buttons to easily manage the layout description. Here's the updated code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/images"
android:orientation="vertical"
tools:context="com.example.acer.aartisangrah.ekdanta">
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="#+id/textView9"
android:enabled="true"
android:focusable="true"
android:longClickable="true"
android:textIsSelectable="true" />
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<SeekBar
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/seekBar"
android:configChanges="orientation|screenSize"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_toStartOf="#+id/b10"
android:layout_alignRight="#+id/b10"
android:layout_alignEnd="#+id/b10"/>
<Button
android:id="#+id/b9"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="10dp"
android:onClick="decrease"
android:layout_below="#id/seekBar"
android:background="#drawable/zoomout1"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<Button
android:id="#+id/b10"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentRight="true"
android:onClick="increase"
android:layout_below="#id/seekBar"
android:layout_marginRight="10dp"
android:background="#drawable/zoomin1"/>
<Button
android:layout_width="50dp"
android:layout_height="50dp"
android:id="#+id/button19"
android:layout_below="#id/seekBar"
android:layout_centerHorizontal="true"
android:background="#drawable/play"/>
</RelativeLayout>
</LinearLayout>

Your problem is you set ScrollView android:layout_height="0dp" and android:layout_weight="1"
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
and
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
so ScrollView takes nothing for hight
Edit
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
You can set android:layout_weight="1" as you want ratio between ScollView and RelativeLayout. Hare both will get half(1/2) of screen.

Android XML - Unable to Prevent ImageView Overlap

I'm attempting to prevent two images from overlapping - and I though I'd be able to do so using two RelativeLayouts inside a LinearLayout - both set to wrap_content - however the two imageViews ( #+id/imageView1 - the boxart and #+id/background - the background) however they still seem to overlap.
Can someone spot what I may have done wrong in this implementation?
XML Source:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/download"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black" >
<RelativeLayout
android:id="#+id/rl_ListView2"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:background="#color/black" >
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:background="#drawable/boxart"
android:gravity="left"
android:paddingBottom="65dp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/background"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:background="#drawable/background_faded"
android:gravity="right"
android:paddingBottom="65dp"
android:scaleType="fitXY" />
</RelativeLayout>
<ImageView
android:id="#+id/downloadbtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"
android:layout_marginTop="200dp"
android:paddingLeft="500dp"
android:src="#drawable/button_download" />
<ProgressBar
android:id="#+id/progressbar_Horizontal"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="585dp"
android:layout_height="5dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginBottom="440dp"
android:layout_marginRight="100dp"
android:max="100"
android:progressDrawable="#drawable/progressbar2" />
<LinearLayout
android:id="#+id/footer"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:layout_alignParentBottom="true"
android:background="#drawable/timeline_bottom_android"
android:orientation="horizontal" >
<ImageView
android:id="#+id/backbtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="left"
android:src="#drawable/icon_back_arrow" />
<TextView
android:id="#+id/backButtonTxt"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignRight="#+id/saveButton"
android:gravity="center_vertical"
android:text="Movies"
android:textSize="40sp" />
</LinearLayout>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/downloadbtn"
android:layout_below="#+id/downloadbtn"
android:layout_marginRight="207dp"
android:layout_marginTop="110dp" />
</RelativeLayout>
</LinearLayout>
Screenshot:

Instead of using Relative layout use a Linear layout with orientation horizontal and then use two Linear layouts with layout_weight=1 for each ImageView. It will divide your screen into two equal parts horizontally.
For example :-
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:orientation="vertical" />
<LinearLayout android:layout_weight="1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:orientation="vertical" />
</LinearLayout>
As per your given layout update your layout as follows:-
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/download"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/rl_ListView2"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="#drawable/boxart"
android:paddingBottom="65dp" />
</LinearLayout >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/background"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:background="#drawable/background_faded"
android:gravity="right"
android:paddingBottom="65dp"
android:scaleType="fitXY" />
</RelativeLayout>
<ImageView
android:id="#+id/downloadbtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"
android:layout_marginTop="200dp"
android:paddingLeft="500dp"
android:src="#drawable/button_download" />
<ProgressBar
android:id="#+id/progressbar_Horizontal"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="585dp"
android:layout_height="5dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginBottom="440dp"
android:layout_marginRight="100dp"
android:max="100"
android:progressDrawable="#drawable/progressbar2" />
<LinearLayout
android:id="#+id/footer"
android:layout_width="fill_parent"
android:layout_height="80dp"
android:layout_alignParentBottom="true"
android:background="#drawable/timeline_bottom_android"
android:orientation="horizontal" >
<ImageView
android:id="#+id/backbtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="left"
android:src="#drawable/icon_back_arrow" />
<TextView
android:id="#+id/backButtonTxt"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignRight="#+id/saveButton"
android:gravity="center_vertical"
android:text="Movies"
android:textSize="40sp" />
</LinearLayout>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/downloadbtn"
android:layout_below="#+id/downloadbtn"
android:layout_marginRight="207dp"
android:layout_marginTop="110dp" />
</LinearLayout>

With regards to your particular situation, the 2 ImageViews causing problems are placed each in a RelativeLayout, which are also placed in a RelativeLayout. Views placed in a relative layout can overlap each other. So when you added the 2 children RelativeLayouts in the parent one, exactly this happened. To make one follow the other, you can add android:layout_toRightOf="#id/id_of_the_layout_you_want_on_the_left_of_this_one" to the second child.
Also, if you are willing to change your layout a bit, you could achieve this through weight and LinearLayout (note however that this will work only if the desired combined width of the 2 children is less than what the parent is willing to offer):
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
... />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
... />
</LinearLayout>
</LinearLayout>

android - imagebutton - place top and bottom?

i want, that the first imagebutton fill the top place and the second imagebutton fill the bottom place. Did I forget something?
<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" >
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#color/white"
android:src="#android:drawable/btn_star"
android:layout_gravity="top" />
<ImageButton
android:id="#+id/imageButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:background="#color/white"
android:src="#android:drawable/btn_star"
android:layout_gravity="bottom" />
</LinearLayout>

The problem is that you need to use a RelativeLayout Try:
<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" >
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#ffffff"
android:src="#android:drawable/btn_star"
android:layout_gravity="top" />
<ImageButton
android:id="#+id/imageButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:background="#ffffff"
android:src="#android:drawable/btn_star"
android:layout_gravity="bottom" />
</RelativeLayout>
Hope that helps. Tell me if that is what you want to accomplish, or if you want both buttons to fill halve the height of the screen equally.
If is then second option then try this:
<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:orientation="vertical" >
<ImageButton
android:id="#+id/imageButton1"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#ffffff"
android:src="#drawable/icon"
/>
<ImageButton
android:id="#+id/imageButton2"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#ffffff"
android:src="#drawable/icon"
/>
</LinearLayout>
Which would look like this:

Try using Relative layout. Using which you can specify the positions of your buttons much easier.
<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="wrap_content" >
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#color/white"
android:src="#android:drawable/btn_star"
android:layout_gravity="top" />
<ImageButton
android:id="#+id/imageButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/imageButton1"
android:background="#color/white"
android:src="#android:drawable/btn_star"
android:layout_gravity="bottom" />
</RelativeLayout>
you can use more positions like layout_below, and its easier to align.
for more positions, http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html

If by "fill" you mean it should take full width, use fill_parent instead of wrap_content for android:layout_width. Otherwise you should use RelativeLayout as your container instead of LinearLayout:
<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" >
<ImageButton
...
android:layout_gravity="top" />
<ImageButton
...
android:layout_gravity="bottom" />
</RelativeLayout>