Develop Reference

How can get this kind of Layout design?

I want to achieve the UI in the below photo. I am not able to decide which layout should I use. Kindly anyone give some points to this:

Use a Linear layout with vertical orientation and within the linear layout(vertical), include linear layouts with horizontal orientation
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<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" />
<!--
online icon
call icon
-->
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--
Gratuity icon
-->
</LinearLayout>

Bottom sheet above the scrollView

I want this kind of bottom sheet which should be above the ScrollView.
The images in the scroll view should be behind the bottom sheet. the bottom sheet should always be there on the screen till the proceed button on it is clicked. Any help will be appreciated. Thanks !!

If the bottom sheet/panel is always there, theres no need to overlap those panels check this simplified xml layout example:
<?xml version="1.0" encoding="utf-8"?>
<!-- This is your root layout element -->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:android_width="match_parent"
android:android_height="0dp"
android:layout_weight="4">
<ScrollView
android:android_width="match_parent"
android:android_height="0dp">
<!-- Put your inner grid layout here -->
</ScrollView>
<!-- this is your bottom panel layout -->
<!-- you can control the size of your bottom -->
<!-- pane by playing with the layout weights -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<Button
android:text="Proceed"
android:background="#drawable/yourSelectorXml"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>

Let's see the code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:android_width="match_parent"
android:android_height="0dp"
android:layout_weight="4">
<ScrollView
android:android_width="match_parent"
android:android_height="0dp">
<!-- Put your inner grid layout here -->
</ScrollView>
<!-- put your bottom panel layout here -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<Button
android:text="Proceed"
android:background="#drawable/yourSelectorXml"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>

Android ExpandableListView not showing

So I have a ExpandableListView in my layout, but for some reason It is showing only some part of it when I run the app. Yes, it's "some" part - actually almost the enture first GroupView.
If I set a fixed height to the list at android:layout_height="some dp", instead of android:layout_height="match_parent" I can see the whole list. But, If I have too many group view's and child view's, again, I can see only some part of it (as the height is fixed).
I've tried to put the expandable list inside a LinearLayout, have tried to set android:layout_height="wrap_content", and so on, but without success.
How can I solve this?
Thank you,
<?xml version="1.0" encoding="utf-8"?>
<!-- That's the main layout.-->
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scroll_view_m"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- This LinearLayout is here because a ScrollView can only have one child view.-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- That's the second ScrollView. But this one is horizontal.-->
<HorizontalScrollView
android:id="#+id/map_layout"
android:layout_width="match_parent"
android:layout_height="400dp">
<!-- This LinearLayout is here because a ScrollView can only have one child view.-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<!-- Some view's here -->
</LinearLayout>
</HorizontalScrollView>
<TextView
android:id="#+id/scroll_down"
android:text="Scroll down to see marker info!"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/holo_green_light"
android:background="#android:color/black"/>
<ExpandableListView
android:id="#+id/m_expandable_list_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ExpandableListView>
</LinearLayout>
</ScrollView>

Android : how to deal with relative layout

i am stuck from two days with relative layout..here is my screen snap in linear layout
so its fine. but now i want to add refresh button somewhere on map but i found that it is not possible with linear layout. so i tried in relative layout but cant even get screen as above.
my footer layout is always shown at top.. here is my xml code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<!-- include title bar for all screen -->
<include
android:id="#+id/include1"
layout="#layout/titlebar_layout" />
<com.google.android.maps.MapView
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1.63"
android:apiKey="0VkXbAOFvAq7b6uaGHSmnS2a2VosPxoS6ceHY_g"
android:clickable="true" >
</com.google.android.maps.MapView>
<include
android:id="#+id/include2"
android:layout_marginBottom="38dp"
layout="#layout/bottom_layout"/>
</LinearLayout>
any help will be greatly appreciated. thanks in advance

Try this. Use a frame layout and put the mapview and button inside the frame layout. Thus button will be placed above the mapview. Place it according to your need.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<!-- include title bar for all screen -->
<include
android:id="#+id/include1"
layout="#layout/titlebar_layout" />
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_width="1.0" >
<com.google.android.maps.MapView
android:id="#+id/map"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.63"
android:apiKey="0VkXbAOFvAq7b6uaGHSmnS2a2VosPxoS6ceHY_g"
android:clickable="true" >
</com.google.android.maps.MapView>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right" />
</FrameLayout>
<include
android:id="#+id/include2"
android:layout_marginBottom="38dp"
layout="#layout/bottom_layout"/>
</LinearLayout>
Hope this helps...!!!

RelativeLayout is probably what you want. It can be difficult to program, as you need to define the bottom View first, and then the Views which come above it on the screen.
Check out these tutorials for some more assistance on using RelativeLayouts. The best way to learn is by doing it! Experiment with various layouts until you figure out how the rules work. Then it should be pretty simple to recreate this as a RelativeLayout.

glsurfaceview inside a scrollview, moving but not clipping

I have a scrollview with a linear layout inside. One of the elements inside this linearlayout is a glsurfaceview.
This all works correctly and when I scroll the glsurfaceview moves up and down however when the glsurfaceview reaches the top or bottom of where it should of the scrollview where it should be clipped it is not and is continued outside of the scrollview. This screenshot should make it clearer:
Don't think it's completly nessecary but here is my layout.xml:
<?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="wrap_content"
android:orientation="vertical"
android:padding="6dip"
>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1"
>
<!-- LOTS OF SEEKBARS/TEXTVIEWS -->
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.4"
android:layout_marginRight="10dip"
android:layout_marginLeft="10dip"
android:orientation="horizontal" >
<android.opengl.GLSurfaceView android:id="#+id/glview"
android:layout_width="100px"
android:layout_height="250px"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_marginTop="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal" >
<!-- OK/CANCEL BUTTONS -->
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
All help much appreciated :)

Hosting SurfaceViews inside ScrollView (or Listview, etc.) is currently not supported.

You may use below lines for removing over scrolling :
glView.getHolder().setFormat(PixelFormat.TRANSLUCENT);
glView.setZOrderOnTop(true);
glView.setZOrderMediaOverlay(true);
And for removing black background :
linearLayout.setBackgroundColor(context.getResources().getColor(R.color.white));
linearLayout.addView(glView);
Also add below line in your manifests file :
android:hardwareAccelerated="true"

It is not about support as answered abowe. The cause of issue is that GLSurfaceView is not on the view level. In short: for you case you have GLSurfaceView at the first level, then other views with holes in views abowe GLSurfaceView (this handles by windows manager, and it dosent matter where you put GLSurfaceView on xml, it will be on first level in any case and others views on next level)
So, what you need is to force view update, and there is work around: you should put scroll with GLSurfaceView or (RecyclerView with GLSurfaceViews) "between" two FrameLayouts. something like 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" >
<ScrollView
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
---- here should be linear layout with your glView, or RecyclerView instead if required ----
</ScrollView>
--- this frame also required: ---
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent" />
</FrameLayout>