Display Map (Google API V2) Only on a Specific Area Of Screen - android

I want to show the map in the middle of the screen and want to show the header and footer separately which contains the options or menu buttons. Can Any one please tell me how can i set my layout so it will be best fit on every device. My current layout code is 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:orientation="vertical">
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:name="com.google.android.gms.maps.MapFragment"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:orientation="horizontal"
android:paddingLeft="20dp"
android:paddingRight="20dp" >
<Button
android:id="#+id/setup_macroSavebtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_weight="1"
android:text="Ride Now"/>
<Button
android:id="#+id/setup_macroCancelbtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="1"
android:text="Ride Later"/>
</LinearLayout>
</RelativeLayout>`

Although pasting code is seriously not the way to answer, so I will advice you to use weights for the map, and set the header and footer height to wrap_content
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
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="horizontal"
android:paddingLeft="20dp"
android:paddingRight="20dp" >
<Button
android:id="#+id/Button02"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_weight="1"
android:text="Ride Now" />
<Button
android:id="#+id/Button01"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="1"
android:text="Ride Later" />
</LinearLayout>
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.MapFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal"
android:paddingLeft="20dp"
android:paddingRight="20dp" >
<Button
android:id="#+id/setup_macroSavebtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_weight="1"
android:text="Ride Now" />
<Button
android:id="#+id/setup_macroCancelbtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="1"
android:text="Ride Later" />
</LinearLayout>
</LinearLayout>

Related

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>

Buttons aren't shown in the LinearLayout

I want that it looks so (this is a screenshot from the Graphical Layout editor):
So I created the layout:
<?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" >
<LinearLayout
android:id="#+id/controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/clearButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/clearButtonText"
android:layout_weight="1"
/>
<EditText
android:id="#+id/searchText"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="5"
android:hint="#string/defaultSearchText"
>
<requestFocus/>
</EditText>
<Button
android:id="#+id/addButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/addButtonText"
android:layout_weight="1"
/>
</LinearLayout>
<ListView
android:id="#+id/list_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
But when I ran my app on the emulator I saw:
When I clicked on the loupe there was still no sign of the buttons.
I think you should use weights for the width of the elements of your horizontal layout. This also means the width of the elements with a weight should be 0dp
<LinearLayout
android:id="#+id/controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/clearButton"
android:layout_width="0dp"
android:layout_weight="0.2"
android:layout_height="match_parent"
android:text="#string/clearButtonText"
/>
<EditText
android:id="#+id/searchText"
android:layout_width="0dp"
android:layout_weight="0.6"
android:layout_height="match_parent"
android:hint="#string/defaultSearchText"
>
<requestFocus/>
</EditText>
<Button
android:id="#+id/addButton"
android:layout_width="0dp"
android:layout_weight="0.3"
android:layout_height="match_parent"
android:text="#string/addButtonText"
/>
</LinearLayout>

popup window layout design left blank space

My popup window design left blank space on top of the window. i try different layout options but space persist.i don't understand how to eliminate this.i am using Custom popup Please help.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColor="#FFF"
android:text="Input a Value"/>
<ImageView
android:id="#+id/image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/severity_rating"
android:layout_marginRight="5dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<EditText
android:id="#+id/popup_et"
android:layout_height="wrap_content"
android:layout_width="100dp"
android:inputType="number" />
<Button
android:id="#+id/dialogButtonOK"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Ok"/>
<Button
android:id="#+id/dialogButtonCancel"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="cancel"/>
</LinearLayout>
</LinearLayout>
use dialog.getWindow().setBackgroundDrawableResource(android.R.color.transparent);
Setting height to fill_parent to the first linear layout doesn't help ?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical" >
Try this..
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
and your imageview give as src
<ImageView
android:id="#+id/image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/severity_rating"
android:layout_marginRight="5dp" />
Use android:layout_weight="" for your linearlayout objects and arrange their appearance in window. Use especially for the item which will occupy more space.
Popup Window
for this view, I use
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/popborder_record"
android:orientation="vertical">
<TextView
android:id="#+id/tvCHLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/md_blue_grey_200"
android:text="#string/checklistsetup"
android:textAlignment="center"
android:textSize="#dimen/text_size"
android:textStyle="bold" />
<ListView
android:id="#+id/lvCheckList"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom"
android:layout_weight="8" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="4"
android:text="#string/lblSoru"
android:textSize="25sp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="#string/lblPuan"
android:textSize="25sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="text"
android:layout_weight="9"/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="10"
android:inputType="number"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/btnAdd"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/btnCHSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/strSave" />
<Button
android:id="#+id/btnCLClose"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/strOFF" />
</LinearLayout>
If you use weight on each element with will also cause spaces. So use for object for important.

How to cent image buttons vertically on the action bar

I have made a custom theme to display my image buttons on the action bar. I was wondering how I can center these buttons vertically in android.
The code I have written so far.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|left|center_vertical"
android:background="#drawable/groups" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|center|fill_vertical"
android:background="#drawable/contactlist" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right|center_vertical"
android:background="#drawable/favourites" />
</FrameLayout>
This is what I want
// try this
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/holo_blue_dark"
android:padding="5dp"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/groups" />
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/white"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/holo_blue_dark"
android:padding="5dp"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/contactlist" />
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/white"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/holo_blue_dark"
android:padding="5dp"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/favourites" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
Please follow this code.
<?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="match_parent"
android:orientation="horizontal" >
<ImageButton
android:layout_width="0dip"
android:layout_height="50dip"
android:layout_gravity="top|left|center_vertical"
android:layout_weight="1"
android:background="#FE6602" />
<ImageButton
android:layout_width="0dip"
android:layout_height="50dip"
android:layout_gravity="top|center|fill_vertical"
android:layout_weight="1"
android:background="#DBEAF9" />
<ImageButton
android:layout_width="0dip"
android:layout_height="50dip"
android:layout_gravity="top|right|center_vertical"
android:layout_weight="1"
android:background="#FAF2B0" />
</LinearLayout>
Changes:
android:layout_height="50dip" to android:layout_height="wrap_content"
android:background="#FE6602" to android:background="#drawable/contactlist"
I just put simple color and static size or testing purpose work like charm.
You can put the image buttons inside a LinearLayout with vertical orientation, and then set their gravity to android:layout_gravity="center"

Android Layout Help - Half of screen should be upside down

I'm OK with the java for this beginning app I'm attempting. But the XML still boggles my mind a little. I've included a picture of what I'm trying to achieve:
And here is the code I have so far. I'm happy with the way it came out, I just need to know how to reverse that first half:
<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">
<LinearLayout
android:id="#+id/opponent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="bottom"
android:layout_weight="1"
android:clickable="false" >
<RelativeLayout
android:id="#+id/opPlus"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_weight="0.5"
android:clickable="true" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/opMinus"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_weight="0.5"
android:clickable="true" >
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/player"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="bottom"
android:layout_weight="1"
android:clickable="false" >
<RelativeLayout
android:id="#+id/plPlus"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_weight="0.5"
android:clickable="true" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/plMinus"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_weight="0.5"
android:clickable="true" >
</RelativeLayout>
</LinearLayout>
Thanks in advance to everybody!
Simply add:
android:rotation="180"
to the View or ViewGroup that you wish to rotate. In this case, the LinearLayout with the id of #+id/opponent
EDIT: Example:
<?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"
>
<RelativeLayout
android:id="#+id/opponent"
android:rotation="180"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FF8833"
>
<View
android:id="#+id/emptyview"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_centerInParent="true"
/>
<Button
android:layout_height="50dp"
android:layout_width="match_parent"
android:layout_toLeftOf="#id/emptyview"
android:layout_alignParentBottom="true"
android:background="#999999"
android:text="Button 1"
/>
<Button
android:layout_height="50dp"
android:layout_width="match_parent"
android:layout_toRightOf="#id/emptyview"
android:layout_alignParentBottom="true"
android:background="#888888"
android:text="Button 2"
/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/opponent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#33FF33"
>
<View
android:id="#+id/emptyview"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_centerInParent="true"
/>
<Button
android:layout_height="50dp"
android:layout_width="match_parent"
android:layout_toLeftOf="#id/emptyview"
android:layout_alignParentBottom="true"
android:background="#999999"
android:text="Button 1"
/>
<Button
android:layout_height="50dp"
android:layout_width="match_parent"
android:layout_toRightOf="#id/emptyview"
android:layout_alignParentBottom="true"
android:background="#888888"
android:text="Button 2"
/>
</RelativeLayout>
</LinearLayout>
Result:

Categories

Resources