Develop Reference

Buttons are not shown in real device but shown in emulator in android

I have a linearlayout which has 2 buttons cancel & download which are use to cancel or download of image respectively. When I run the app on emulator [Emulator is Nexus-5] all works fine , these 2 buttons are shown, but when I test my app on real device [My device is samsung-core].
Image is loaded from internet and then this liearLayout is shown, initially it is hidden.
This is the screenshot from my device
And this is my emulator screenshot
This is layout file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="16dp">
<EditText
android:id="#+id/et_pic_url"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter pic url here" />
<Button
android:id="#+id/bt_pic_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Send" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="#+id/iv_pic"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="2"
android:paddingTop="10dp"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/linear_layout_download_cancel_button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:paddingLeft="32dp"
android:paddingRight="32dp">
<Button
android:id="#+id/bt_cancel_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel" />
<Button
android:id="#+id/bt_pic_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Download" />
</LinearLayout>
I am guessing this is happening because of Screen Height. But why this 2 buttons get hidden.What is making this weird thing happen in my layout file.
Thanks - Suraj

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightsum="10"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:padding="16dp"
android:weight="1"
>
<EditText
android:id="#+id/et_pic_url"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter pic url here" />
<Button
android:id="#+id/bt_pic_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Send" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:weight="8"
>
<ImageView
android:id="#+id/iv_pic"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="2"
android:paddingTop="10dp"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/linear_layout_download_cancel_button"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
android:paddingLeft="32dp"
android:paddingRight="32dp">
<Button
android:id="#+id/bt_cancel_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel" />
<Button
android:id="#+id/bt_pic_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Download" />
</LinearLayout>
enter code here
Your imageview is match parent, so it cover the screen, use the above code. it will workl fine

try ScrollView. The Buttons may below your ImageView(and set your image view attr "wrap_content") or your layout.
demo below according your code:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="16dp">
<EditText
android:id="#+id/et_pic_url"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter pic url here" />
<Button
android:id="#+id/bt_pic_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Send" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/iv_pic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:paddingTop="10dp"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/linear_layout_download_cancel_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:paddingLeft="32dp"
android:paddingRight="32dp">
<Button
android:id="#+id/bt_cancel_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel" />
<Button
android:id="#+id/bt_pic_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Download" />
</LinearLayout>
</LinearLayout>
</ScrollView>

Because there is no space to show the button in the device. do 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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="16dp"
android:layout_above="#+id/linear_layout_download_cancel_button"
>
<EditText
android:id="#+id/et_pic_url"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter pic url here"/>
<Button
android:id="#+id/bt_pic_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Send"/>
<ImageView
android:id="#+id/iv_pic"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="2"
android:paddingTop="10dp"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/linear_layout_download_cancel_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:paddingLeft="32dp"
android:paddingRight="32dp"
android:layout_alignParentBottom="true"
>
<Button
android:id="#+id/bt_cancel_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel"/>
<Button
android:id="#+id/bt_pic_download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Download"/>
</LinearLayout>
</RelativeLayout>

How do I create overlay button in my Android layout

I want to create a button which will overlay between 2 layouts.
I am using Linear Layout and added appropriate weight to it.
Have attached a screen shot for reference.
Here is my XML
tag.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="center"
android:orientation="vertical"
android:weightSum="100" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="30"
android:background="#color/greyColor"
android:gravity="center" >
<ImageView
android:id="#+id/ximgvwCamera"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/camera_big" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="70"
android:background="#android:color/white" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#android:color/white"
android:gravity="center_horizontal"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="5dp"
android:padding="5dp"
android:text="#string/strQ1"
android:textAppearance="#android:style/TextAppearance.Medium"
android:textColor="#android:color/darker_gray" />
</LinearLayout>
</ScrollView>
Please help me in this.
Thanks in advance!

Try this it will working...
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="150dp" >
<ImageView
android:id="#+id/imageCover"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:src="#drawable/image_top" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:background="#drawable/image_bottom"
android:layout_height="match_parent" >
</LinearLayout>
</LinearLayout>
<ImageView
android:id="#+id/imageProfile"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="end"
android:layout_marginTop="100dp"
android:src="#drawable/ic_launcher" />
</FrameLayout>
View like this

You need a relative layout. Set image alignt to right-top and set margin top appropriately.

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/first"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:src="#drawable/firstImage" />
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:src="#drawable/middleImage" >
</ImageView>
<RelativeLayout
android:id="#+id/second"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:layout_below="#id/first"
android:src="#drawable/share_over" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="20dp"
android:orientation="horizontal" >
<ImageView
android:id="#+id/YES"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/YES" />
<ImageView
android:id="#+id/NO"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/NO" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
Divide your image TOP-MIDDLE-BOTTOM(layout). Your size looking like above but
you can change width/height size.

Why doesn't this HorizontalScrollView fills the parent?

I've made a layout that worked fine with a vertical scroll view, but I need to make another one with a horizontal scroll view.
I just changed ScrollView to HorizontalScrollView:
<?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:layout_weight="1"
android:scrollbars="none"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:text="#string/activity_visibilidade_cronologia_aula_subtitulo"
android:textSize="16dp" />
<ImageButton
android:id="#+id/activity_visibilidade_cronologia_aula_btn_info"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:background="#null"
android:scaleType="fitXY"
android:src="#drawable/btn_info" />
</RelativeLayout>
<LinearLayout
android:id="#+id/activity_visibilidade_cronologia_aula_linear_conteudo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</LinearLayout>
<Button
android:id="#+id/activity_visibilidade_cronologia_aula_btn_confimar"
android:layout_width="165dp"
android:layout_height="35dp"
android:layout_centerVertical="true"
android:layout_gravity="right"
android:layout_marginBottom="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:background="#drawable/botao_add_confirmar"
android:text="#string/dialogo_alterar_classe_confirmar"
android:textColor="#color/branco" />
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
And its result is:
Why doesn't HorizontalScrollView fills the parent, is there something wrong?

I solved merging all your advices and also using android:fillViewport="true" my final code is:
<?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" >
<include layout="#layout/layout_titulo_views" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:text="#string/activity_visibilidade_cronologia_aula_subtitulo"
android:textSize="16dp" />
<ImageButton
android:id="#+id/activity_visibilidade_cronologia_aula_btn_info"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:background="#null"
android:scaleType="fitXY"
android:src="#drawable/btn_info" />
</RelativeLayout>
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:scrollbars="horizontal" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/activity_visibilidade_cronologia_aula_linear_conteudo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</LinearLayout>
</LinearLayout>
</HorizontalScrollView>
<Button
android:id="#+id/activity_visibilidade_cronologia_aula_btn_confimar"
android:layout_width="165dp"
android:layout_height="35dp"
android:layout_centerVertical="true"
android:layout_gravity="right"
android:layout_marginBottom="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:background="#drawable/botao_add_confirmar"
android:text="#string/dialogo_alterar_classe_confirmar"
android:textColor="#color/branco" />
</LinearLayout>
</LinearLayout>
Thank you all

I found teh problem. In addition to removing the weight sum, you need to change the linear layout orientation to horizontal.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >

Vertical Linear Imageview goes at the bottom

i am working on a layout with 3 buttons and an image view i call the imageview as the first child of the parent however when i build it on actual device the imageview goes down after the buttons... really weird....
heres the xml file:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:layout_gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/title_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/111"
android:visibility="visible" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/222"
android:visibility="visible"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_medium"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/highscores_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/highscore_btn"
android:visibility="visible" />
<Button
android:id="#+id/more_apps_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/margin_medium"
android:background="#drawable/333"
android:visibility="visible" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
is this because of the size of the imageview? it is really large so i put it in xxhdpi folder so it will be reduced. any thoughts? thanks

// try this
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:layout_gravity="center"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
<ImageView
android:id="#+id/title_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/111"
android:visibility="visible" />
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/222"
android:visibility="visible"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_medium"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/highscores_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/highscore_btn"
android:visibility="visible" />
<Button
android:id="#+id/more_apps_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/margin_medium"
android:background="#drawable/333"
android:visibility="visible" />
</LinearLayout>
</LinearLayout>
</FrameLayout>

buttons are not displayed

This is my xml code (i followed this post, but its not working):
<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" >
<WebView
android:id="#+id/webChapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_below="#+id/webChapter"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/btnMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back To Menu" />
<Button
android:id="#+id/btnNavi"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Example" />
<Button
android:id="#+id/btnQuestion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Quiz" />
</LinearLayout>
And this is the graphical one :
My buttons are not displayed when my webview become too tall. What should i do? Thanks :D

Try the following:
<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" >
<WebView
android:id="#+id/webChapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_above="#+id/linearlayout"/>
<LinearLayout
android:id="#+id/linearlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/btnMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back To Menu" />
<Button
android:id="#+id/btnNavi"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Example" />
<Button
android:id="#+id/btnQuestion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Quiz" />
</LinearLayout>
Hope this will help you

hi try this following one
<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" >
<WebView
android:id="#+id/webChapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignBottom="#+id/btnLayout"/>
<LinearLayout
android:id="#+id/btnLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_below="#+id/webChapter">
<Button
android:id="#+id/btnMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back To Menu" />
<Button
android:id="#+id/btnNavi"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Example" />
<Button
android:id="#+id/btnQuestion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Quiz" />
</LinearLayout>

Try below Layout, Hope it works for you.
<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:weightSum="10" >
<WebView
android:id="#+id/webChapter"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="9" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center_horizontal" >
<Button
android:id="#+id/btnMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back To Menu" />
<Button
android:id="#+id/btnNavi"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Example" />
<Button
android:id="#+id/btnQuestion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Quiz" />
</LinearLayout>
</LinearLayout>
Above code will have buttons down the webview. If you can use the buttons above the webview, then there is no need of using weights also. you can put webview below the buttons layout.

You may fix a height to your webview, or maybe define an id to your LinearLayout and set the property android:layout_above on your webView to guarantee that your webview will be above buttons not floating over them.
Try something like this:
<WebView
android:id="#+id/webChapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/lowerBar"
android:layout_alignParentTop="true"/>
<LinearLayout
android:id="#+id/lowerBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_alignParentBottom="true">