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>
Related
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>
I have a layout like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="#dimen/action_bar_default_height"
android:layout_marginTop="25dp"
android:background="#drawable/gradient"
android:gravity="center_vertical"
android:orientation="horizontal" >
<ImageButton ... />
<TextView ... />
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<ImageView ... />
<ImageButton ... />
<ImageButton ... />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- All extra views are inflated here, if needed -->
</LinearLayout>
<!-- Main view -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" />
<!-- HERE I WANT TO PUT A FOOTER -->
<LinearLayout
android:id="#+id/FOOTER"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- footer.xml WILL BE INFLATED HERE -->
</LinearLayout>
</LinearLayout>
The footer is another .xml file (footer.xml) that will be inflated in the FOOTER LinearLayout.
I tried to change FOOTER to RelativeLayout and add android:layout_alignParentBottom="true" to the footer.xml LinearLayout, but it did not work.
footer.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
...
</LinearLayout>
Any ideas?
Since all of your LinearLayout in you XML are "wrap_content", you need to set the weight of one of them to be "1" so that guy will actually takes all the possible space. I would give it to the "Main View". basically you should add android:layout_weight="1" to it.
Changing footer to relativelayout won't work. those "relative parent bottom" stuff works if the PARENT is relative layout. not the child.
Try adding
android:layout_weight="1"
To the LinearLayout you want to take up all of the extra vertical space (I assume this would be the one under your Main view comment?)
That will force the footer linear layout to the bottom of its parent.
Also, you may want to consider just using an include tag for your footer.xml layout instead of placing it as a child of your LinearLayout with id FOOTER.
So you should be able to remove the LinearLayout with id FOOTER altogether and replace it with an include tag.
Something like:
<include android:id="#+id/FOOTER" layout="#layout/footer" android:layout_width="fill_parent" android:layout_height="wrap_content"/>
I can't see any reason why changing the patent layout to relative wouldn't work. Try removing all of the XML except the footer and see if it works. Then add it back in bit by but
I have 3 FrameLayout in my layout, the first and the third have a fixed height (wrap_content of child views).
And I want the second FrameLayout to fill remaining space between the first and the third element.
My XML :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<!-- ... childs views with fixed height -->
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp" <!-- Fill remaining space -->
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp" >
<!-- ... childs views with match_parent height -->
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<!-- ... childs view with fixed height -->
</FrameLayout>
</LinearLayout>
you can use the layout_weight="1" property for the central FrameLayout, leaving 0dip for the height. It will the take the space left from the other two
Need help,
See the following screen, (This is my actual home screen)
But, when I run my Application It looks as follows (Screen When I run my application
Here I need to drag (Scroll) the screen to see the footer part. I wants to avoid this, Can anybody help me out in this Please. Thank You.!
hope this will help you. Use following
<?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">
<!-- header part -->
<LinearLayout
android:id="#+id/ll_header"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
android:layout_width="match_parent">
...
</LinearLayout>
<!-- scroll view part -->
<ScrollView
android:id="#+id/sv_container"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_above="#+id/ll_fooetr">
</ScrollView>
<!-- footer part -->
<LinearLayout
android:id="#+id/ll_footer"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content"
android:layout_width="match_parent">
...
</LinearLayout>
</RelativeLayout>
My suggestion is to use LinearLayout or RelativeLayout for your activity, and inside it use a ScrollView for the inside part (which should be scrolled).
So, perhaps something like this
<?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">
<ScrollView
android:layout_height="wrap_content"
android:layout_width="match_parent">
<!-- all your scrollable stuff goes here -->
</ScrollView>
<!-- here's your footer -->
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
...
</LinearLayout>
</LinearLayout>
Documentation on ScrollView
Edit:
I think RelativeLayout (as main Layout) will serve you the best, as it allows you to align itself against parent's edges.
Documentation on RelativeLayout
I want to place 3 linear layouts on same page of android.
Two besides each other and the other one below the two.
The view is in landscape mode and it should cover the whole screen.
How to do that in xml file?
I am not being able to post my code. Seems like its not working
You will do something like this
<LL orientation=vertical android:layout_height="fill_parent">
<LL orientation:horizontal>
<LL><!-- First of the two who are beside--></LL>
<LL><!-- Second of the two who are beside--></LL>
</LL>
<LL>
</LL>
</LL>
You can use RelativeLayout for that:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/layoutLeftTop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true">
<!-- Content of the first layout -->
</LinearLayout>
<LinearLayout
android:id="#+id/layoutRightTop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true">
<!-- Content of the second layout -->
</LinearLayout>
<LinearLayout
android:id="#+id/layoutBottom"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<!-- Content of the third layout at bottom -->
</LinearLayout>
</RelativeLayout>