Develop Reference

Android XML Layout Layering

Is there a generally accepted way of doing this? My home screen initially looked like the below image, using the below code, to prompt the user to start a game.
Original home screen
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.android.snake.SnakeView
android:id="#+id/snake"
android:layout_width="match_parent"
android:layout_height="match_parent"
tileSize="24" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/text"
android:text="#string/snake_layout_text_text"
android:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:textColor="#ff8888ff"
android:textSize="24sp"/>
</RelativeLayout>
</FrameLayout>
This worked with no errors, but I needed to add items for user input (EditText) and show last 5 scores (Button) and wanted this prompt below it rather than putting the player through multiple screens. From what I've read, I should be able to embed a FrameLayout inside a RelativeLayout with no conflicts, but it only works to the Show Scores button and the game prompt is missing. When I check it in design view, I am also now getting an error that the bottom half (which is now showing) is failing to instantiate the class that would allow the game to play. I am simply beside myself on how to correct this and would like to understand what I have done wrong so as to not allow this to happen again on future projects. Below is the modified code that causes the errors.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Username"
android:id="#+id/textViewName"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/editTextName"/>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="?android:attr/buttonStyleSmall"
android:text="Add"
android:id="#+id/btnAdd"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last 5 Games"
android:id="#+id/btnLastFive"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.android.snake.SnakeView
android:id="#+id/snake"
android:layout_width="match_parent"
android:layout_height="match_parent"
tileSize="24" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/text"
android:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:textColor="#ff8888ff"
android:textSize="24sp"/>
</RelativeLayout>
</FrameLayout>
</LinearLayout>
Proposed layout

You should add the namespace of the custom view com.example.android.snake.SnakeView on your root layout, and add the namespace prefix before the declaration of your custom Views attributes.
So assuming the namespace is "app", tileSize becomes for example app:tileSize
<LinearLayout
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:orientation="vertical">
......
<com.example.android.snake.SnakeView
android:id="#+id/snake"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:tileSize="24" />
.....
</LinearLayout>
It also seems that you have removed the text content "Snake Press up to play" from your TextView #+id/text, otherwise you won't be able to see it.

Add custom location button in right bottom corner like in GoogleMaps

What is the best way to add a button to the bottom right corner in my app with the maps, and change this button in different states like in GoogleMaps? I am using OSMDroid and need add custom button, not default.

use this layout and it get you what you are looking for
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ImageView
android:id="#+id/imageViewFlagPassenger"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#android:color/transparent"
android:src="#drawable/marker" />
<ImageView
android:id="#+id/btn_passenger_current_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="20dp"
android:layout_marginRight="10dp"
android:background="#drawable/location_icon" />
</RelativeLayout>
</LinearLayout>

Elevation not working for BottomSheet inside Coordinator layout

I am trying to use a BottomSheet in my layout.
The root view is an CoordinatorLayout and I want to set Elevation on top for the Bottom Sheet so i am setting it with a high value (50dp), however it is not showing when the app runs but it appears on android studio design tool.
I have tried to set background for the sheet with a solid color instead of gradient but it still did work. I also tried to use Shadow shapes but it does not give the same elevation appearance.
here is my XML
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.atefhares.StartActivity"
android:clipToPadding="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/DetailsView"
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Details Should be shown here"
android:id="#+id/textView"
android:textSize="25sp"
android:padding="20dp" />
</LinearLayout>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.atefhares.Start_Activity" />
</LinearLayout>
<android.support.v4.widget.SlidingPaneLayout
android:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_peekHeight="70dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
android:background="#drawable/gradiant"
android:fillViewport="true"
android:elevation="50dp">
<include layout="#layout/bottom_sheet_layout"/>
</android.support.v4.widget.SlidingPaneLayout>
</android.support.design.widget.CoordinatorLayout>
Edit:
bottom_sheet_layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#color/colorPrimary"
android:padding="10dp"
android:id="#+id/inviteLL">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/imageView"
android:background="#drawable/invite_icon"
android:layout_margin="5dp"
android:layout_gravity="center_vertical" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Invite Friends"
android:textSize="22sp"
android:textColor="#ffffff"
android:padding="10dp"
android:fontFamily="sans-serif-condensed"
android:gravity="center_vertical"
android:id="#+id/inviteTV"
android:layout_gravity="center_vertical"
android:layout_weight="1" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/arrowIV"
android:layout_gravity="center_vertical"
android:background="#drawable/arrow_up" />
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:id="#+id/usersLV"
android:dividerHeight="1dp"
android:divider="#ffffff"
android:background="#ffffff" />
</LinearLayout>
So how can I make the elevation shows on top of the Bottom Sheet
Any one can help, please ?

Try this,
<android.support.v4.widget.SlidingPaneLayout
android:id="#+id/bottom_sheet"
xmlns:slide_panel="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_peekHeight="70dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
android:background="#drawable/gradiant"
android:fillViewport="true"
slide_panel:elevation="50dp">

According to the google guidelines with the android:elevation is not possible (Also you can read more about the keyligth).
Anyway on the most common cases when you scroll up the "BottomSheet" a semitransparent layer appears behind the "BottomSheet", this helps to keep the user focus on the "BottomSheet" actions, like these examples.
If anyway you want a top shadow you can set a drawable background with gradient like this (shadow_top.xml):
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:angle="90"
android:centerColor="#000000"
android:endColor="#android:color/transparent"
android:startColor="#000000"
android:type="linear" />
And your SlidingPanelLayout will be:
<android.support.v4.widget.SlidingPaneLayout
android:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_peekHeight="95dp"
android:paddingTop="25dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
android:background="#drawable/shadow_top"
android:fillViewport="true"
>
Best regards.

Do not forget that to draw shadow you must use hardwareAccelerated drawing
hardwareAccelerated = true
hardwareAccelerated = false
See Android Hardware Acceleration for details

The answer is: no, it is not possible (unless you create your own view custom with an elevation feature on top).
Elevetion is not meant to be visible in the top of a view, but in the bottom, on the right and on the left.
If you see closely on the official Material Design guidelines, you can see that the bottom bar simply don't have it (do not confuse with the gray space between the card and the bottom bar).
For example: import Card View sample from Android Studio and play with it with emulator or your device. You will see that if you increment the elevation value, the view will have his shadow everywhere except on top (see second image below).
Another example is given by importing Elevation Basic.
EDIT
Following code is taken from Card View sample. There is a layout containing a CardView with elevation. Whenever you change the elevation, you will always see shadow everywhere, but not on top (the code was tested with Lollipop and Marshmallow).
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
>
<android.support.v7.widget.CardView
android:id="#+id/cardview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:elevation="100dp"
card_view:cardBackgroundColor="#color/cardview_initial_background"
card_view:cardCornerRadius="8dp"
android:layout_marginLeft="#dimen/margin_large"
android:layout_marginRight="#dimen/margin_large"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_medium"
android:text="#string/cardview_contents"
/>
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_large"
android:orientation="horizontal"
>
<TextView
android:layout_width="#dimen/seekbar_label_length"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="#string/cardview_radius_seekbar_text"
/>
<SeekBar
android:id="#+id/cardview_radius_seekbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_medium"
/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:layout_width="#dimen/seekbar_label_length"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="#string/cardview_elevation_seekbar_text"
/>
<SeekBar
android:id="#+id/cardview_elevation_seekbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_medium"
/>
</LinearLayout>
</LinearLayout>

ListView contents in Android navigation drawer not lined up

I followed up the android docs to build a navigation drawer on my app main activity. But the contents are in a string array in my main activity java code. The listview elements are not lined up.
How do I make them lined up to the left so they all are aligned equal distance from the left side of the screen? I also want this behavior in portrait and layout modes.
This is my xml file.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="fill_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="#+id/adla"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/tvan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#color/blue"
android:textSize="#dimen/abc_action_bar_default_height_material"
android:text="#string/app_name" />
<AutoCompleteTextView
android:id="#+id/acgetd"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:gravity="center_horizontal" />
<requestFocus />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_gravity="bottom" >
<Button
android:id="#+id/bgetd"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/skimmy"
android:text="#string/bgetd" />
<Button
android:id="#+id/brejec"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/skimmy"
android:text="#string/reject" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
<ListView
android:id="#+id/MList"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#111">
</ListView>
</android.support.v4.widget.DrawerLayout>

From the link you shared, there is a layout R.layout.drawer_list_item. there is an XML layout called drawer_list_item.xml. this is the file responsible for all the item in the listView.
check for gravity in the XML and remove it or set the property to alignParentLeft

You should NOT be creating this yourself, and instead should be using the AppCompat provided NavigationLayout for this.
This is designed to set this all up for you using just menu.xml files, and using this control will ensure your drawer matches the guidelines exactly.
http://developer.android.com/reference/android/support/design/widget/NavigationView.html

I think your Text of ListView is align to the center,
android:layout_gravity="center
change that to right or left according to your requirement
which may help

I suspect that you are using android:gravity="center" instead of android:gravity="center_vertical" in the TextView for the List.

Making a button transparent Android?

How do I get rid of the white bit around the button? I don't want the button transparent, but I want the white bit around it. I've got Google Maps behind the button.
I've tried android:background="#android:color/transparent", on the Button, but it's only the button that becomes transparent (not the white bit around it).
How do I do this in XML?
<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"
tools:context=".MyLocation" >
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#android:color/transparent"
android:gravity="center" >
<Button
android:id="#+id/filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="filterMenu"
android:text="#string/filter_button" />
</FrameLayout>
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
</LinearLayout>

How about setting the background of RelativeLayout to transparent?
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent" >
<Button
android:id="#+id/filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:onClick="filterMenu"
android:text="#string/filter_button"
/>
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
</RelativeLayout>
And why not using FrameLayout anyway? It's better in performance than RelativeLayout.
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/transparent" >
<Button
android:id="#+id/filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="filterMenu"
android:text="#string/filter_button"
/>
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
</FrameLayout>

try this:
MybuttonName.getBackground().setAlpha(0);
0= Completely transparent.
255 Completely opaque.

How about this.
Button filter = (Button) findViewById(R.id.filter);
filter.setBackgroundColor(Color.TRANSPARENT);

try this
android:background="#android:color/transparent"