Placing one layout above another layout in the bottom of the screen - android

I am trying to create a black view and placing it on top of another view as can be seen in the image below. So far so good.
But I can't figure out how to place the black view in the bottom of the screen? (still on top of the white pdf background...)
Here is my xml code so far:
<?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"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/background_pdf"
android:layout_below="#+id/background_pdf2"
android:orientation="vertical"
>
<com.radaee.pdf.MLPDFViewer
android:id="#+id/pdf"
android:background="#android:color/white"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="visible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/background_pdf2"
android:orientation="vertical"
android:gravity="bottom"
android:layout_gravity="bottom"
>
<View
android:layout_width="match_parent"
android:layout_height="75px"
android:gravity="bottom"
android:layout_gravity="bottom"
android:background="#android:color/black"
/>
</LinearLayout>
</RelativeLayout>
If I add the following code android:layout_alignParentBottom="true" to android:id="#+id/background_pdf2" my result is the following:
As you can see the black view is placed at the bottom but the main-view (white pdf) dissapears. I don't understand this...


Give android:layout_alignParentBottom="true" to your Linear layout with id background_pdf2, like 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"
android:orientation="vertical">
<LinearLayout
android:id="#+id/background_pdf"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.radaee.pdf.MLPDFViewer
android:id="#+id/pdf"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:visibility="visible"/>
</LinearLayout>
<LinearLayout
android:id="#+id/background_pdf2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:gravity="bottom"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="75px"
android:layout_gravity="bottom"
android:background="#android:color/black"
android:gravity="bottom"
/>
</LinearLayout>
</RelativeLayout>

Related

Android how to fill parent but leave some space

The title isn't good but i didn't know how else to describe
I have a relative layout with 2 elements, some container and a button at bottom.
I want the container fill all the space in the relativelayout leaving just the space enough to put the button
here is an example:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout //i'm using linearlayout as an example, it could be anything here
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/b3"
android:gravity="center"
android:orientation="vertical">
</LinearLayout>
<Button
android:id="#+id/b3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="asdasdasdasdasdasdasdasd" />
</RelativeLayout>
here is how i want it look like
The red means the relavitive layout, the green the linear layout, and the yellow means the button...
how can i make it?

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#color/red"
android:padding="5dp"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/b"
android:background="#color/green">
</LinearLayout>
<Button
android:id="#+id/b"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="this is the button"
android:background="#color/yellow"/>
</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorAccent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignTop="#+id/b3"
android:layout_margin="4dp"
android:background="#color/colorPrimary"
android:gravity="center"
android:orientation="vertical">
</LinearLayout>
<Button
android:id="#+id/b3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="asdasdasdasdasdasdasdasd" />
</RelativeLayout>

This should give you something close to what you want:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLayout"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout //i'm using linearlayout as an example, it could be anything here
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="3"
android:gravity="center"
android:orientation="vertical">
</LinearLayout>
<Button
android:id="#+id/b3"
android:layout_width="wrap_content"
android:layout_height="0px"
android:layout_weight="1"
android:text="asdasdasdasdasdasdasdasd" />
</LinearLayout>

Scrollview top and bottom

I'm building and android application using android studio and I'm using scroll view in my layout, but the problem is that the scroll view doesn't start after the action bar and leaves huge white space at the bottom (as you can see in the screenshots below).
and here's my code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="false"
android:background="#fefcf8"
android:orientation="vertical"
android:weightSum="1">
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:layout_gravity="center"
android:orientation="vertical"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="0dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:padding="5dp"
android:orientation="vertical">
<ImageButton
android:id="#+id/info1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="2dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:scaleType="fitCenter"
android:src="#drawable/info1" />
</LinearLayout>
.
.
.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:padding="5dp"
android:orientation="vertical">
<ImageButton
android:id="#+id/info6"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="2dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:scaleType="fitCenter"
android:src="#drawable/info6" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:background="#3a3c3a"
app:menu="#menu/navigation"
app:itemTextColor="#ffffff"/>
</LinearLayout>
As you can see my xml above, i didn't any padding or margin. Yet there's a white space at the bottom and the scroll view starts at the very top of the activity not after the action bar. How to solve this?

Try by putting this inside your ScrollView or FrameLayout containing ScrollView
<ScrollView
...
app:layout_behavior="#string/appbar_scrolling_view_behavior"
...>

Horizontal and Vertical center to the parent layout

I am creating a user profile screen in Android. In this screen have user profile wallpaper and user profile image. Here the grey background is profile wallpaper and red background is going to profile image. I need to set the red bg layout to the horizontal and vertical center of the grey bg layout..
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/rlActivityNotificationsAndProfile">
<include layout="#layout/layout_tool_bar"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="#dimen/profile_wallpaper_container_height"
android:id="#+id/rlProfileWallpaper"
android:layout_below="#+id/toolbar">
<LinearLayout
android:layout_width="match_parent"
android:background="#646464"
android:orientation="vertical"
android:layout_height="#dimen/profile_wallpaper_height">
<LinearLayout
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center"
android:background="#A52525">
</LinearLayout>
</LinearLayout>
<android.support.design.widget.FloatingActionButton xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/tools"
android:id="#+id/fabEditProfile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_margin="#dimen/base_ten_dp"
android:layout_marginEnd="#dimen/base_ten_dp"
android:layout_marginStart="#dimen/base_ten_dp"
android:scaleType="center"
android:src="#drawable/add"
app:elevation="#dimen/priority_1_elevation"
app:fabSize="1"/>
</RelativeLayout>
</LinearLayout>

You can just set your parent LinearLayout's gravity to center (just add 1 line):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/rlActivityNotificationsAndProfile">
<include layout="#layout/layout_tool_bar"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="#dimen/profile_wallpaper_container_height"
android:id="#+id/rlProfileWallpaper"
android:layout_below="#+id/toolbar">
<LinearLayout
android:layout_width="match_parent"
android:background="#646464"
android:orientation="vertical"
android:layout_height="#dimen/profile_wallpaper_height"
android:gravity="center">
<LinearLayout
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center"
android:background="#A52525">
</LinearLayout>
</LinearLayout>
<android.support.design.widget.FloatingActionButton xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/tools"
android:id="#+id/fabEditProfile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_margin="#dimen/base_ten_dp"
android:layout_marginEnd="#dimen/base_ten_dp"
android:layout_marginStart="#dimen/base_ten_dp"
android:scaleType="center"
android:src="#drawable/add"
app:elevation="#dimen/priority_1_elevation"
app:fabSize="1"/>
</RelativeLayout>
</LinearLayout>

Why does animateLayoutChanges move the position of sibling views before animation ends?

I have following XML code
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/viewGroup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/textLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
<ListView
android:id="#+id/testList"
android:layout_width="match_parent"
android:layout_height="75dp"
android:visibility="gone" />
</LinearLayout>
<RelativeLayout
android:id="#+id/anotherLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TextView
android:id="#+id/messageText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
So when the textLayout is clicked, it will determine the visibility of testList.
When the visibility becomes VISIBLE, it works well. However, when the visibility becomes GONE, the anotherLayout goes back to original position before the animation of viewGroup ends, so it overlaps the testList.
How can I prevent this?

Android ScrollView below Toolbar fails to show all content

I have made a base-activity with a toolbar and add my layouts to this. But when I add a scrollview in the main content it doesn't show the bottom part when scrolling down. The missing part seems to be the same height as the toolbar.
My activitybase.xml:
<?xml version="1.0" encoding="utf-8"?>
<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">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/ToolBarStyle"
android:background="?attr/colorPrimary" />
<FrameLayout
android:id="#+id/root_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
My fragmentinfo.xml:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/default_margin">
<TextView
android:id="#+id/info_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/default_margin"
android:text="hei"
style="#style/TextLarge" />
<TextView
android:id="#+id/info_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/small_margin"
android:text="-SOME LONG TEXT-"
style="#style/TextNormal" />
<TextView
android:id="#+id/info_header2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/default_margin"
android:text="Test"
style="#style/TextLarge" />
</LinearLayout>
</ScrollView>
Screenshot below. This is scrolled all the way down. "Test" should be showing with 16 dp margin below it...

In FrameLayout
<FrameLayout
...
android:layout_marginBottom="56dp"
...
/>
Here 56dp is the Action Bar size.

Add android:layout_marginBottom to the ScrollView, using the action bar height dimen.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/abc_action_bar_default_height_material"
android:fillViewport="true">

Categories

Resources