I have a FrameLayout that consists of a list view and a button. The whole point of the FrameLayout is that elements that are after other elements will be displayed above them.
Since the button code is below the ListView code, I expected the button will always be on top, but it isn't. I can't figure it out - as soon as I get enough items in my list, the button is underneath it and it becomes obsolete.
XML:
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:id="#+id/lvMovies"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#fff"
android:elevation="3dp"
android:paddingTop="8dp" />
<Button
android:id="#+id/btnAddMovie"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:background="#drawable/raised_action_button"
android:elevation="5dp"
android:fontFamily="sans-serif-light"
android:gravity="center"
android:text="+"
android:textColor="#ffffff"
android:textSize="30sp" />
</FrameLayout>
From developer.android:
FrameLayout is designed to block out an area on the screen to display
a single item. Generally, FrameLayout should be used to hold a single
child view,
The current dimensions of the framelayout is the entire screen. If I was to use the entire screen for the above layout I would do something like the following:
<?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:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5"
android:orientation="horizontal">
<ListView
android:id="#+id/lvMovies"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:background="#fff"
android:elevation="3dp"
android:paddingTop="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/btnAddMovie"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:background="#drawable/raised_action_button"
android:elevation="5dp"
android:fontFamily="sans-serif-light"
android:gravity="center"
android:text="+"
android:textColor="#ffffff"
android:textSize="30sp" />
</LinearLayout>
</LinearLayout>
You can say 0dp weight for either a height or a width, but not both. You then team it up with a layout_weight. In this case the first nested linear layout takes up 5/6ths of the screen, the second 1/6th. Thus your button sits in a protected space that the list view will not block out.
The outer linear layout has a vertical orientation which makes the two inner layouts stack on top of each other, the inners are horizontal to make them go across the entire screen. You will need to tweak those weights to make it work for you.
You can use RelativeLayout for this. If you want button view over the listview android:layout_above="#+id/btnAddMovie" delete this line.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:id="#+id/lvMovies"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/btnAddMovie"
android:layout_marginBottom="8dp"
android:background="#fff"
android:elevation="3dp"
android:paddingTop="8dp" />
<Button
android:id="#+id/btnAddMovie"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom|end"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:elevation="5dp"
android:fontFamily="sans-serif-light"
android:gravity="center"
android:text="+"
android:textColor="#ffffff"
android:textSize="30sp" />
</RelativeLayout>
Remove the elevation property from the list view. That's it.
It seems like the elevation causes the element to be on top of other elements.
Related
I am attempting to set up a layout with an "X" button pinned to the top of the screen, and then two elements centered in the view. One a recycler view and then, pinned below the recycler view, a button for form submission. The layout I currently have worked until the recycler view outgrows its bounds. Then the submission button is pushed below the bounds of the view and the recycler view does not stay within the layout. How can I center the two recycler and button views but not have the button go past view bounds if the recycler view grows large?
View With Small Recycler View Appears As (it should be centered. my example is slightly off.)
How View Should Appear with Larger Recycler View (the recycler view's content is too large to fit so it scrolls)
How View Actually Appears with Larger Recycler View (the recycler view does scroll, but now it pushes the button off the bottom of the view, which appears as the button being cut off)
Relevant Code Block for XML Layout
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.45"
android:orientation="vertical"
android:background="#color/backgroundLightSecondary"
android:padding="20dp" >
<Button
android:id="#+id/bt_close"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="end"
android:background="#drawable/ic_close"
android:textColor="#color/textLightPrimary" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight="1"
android:gravity="center_vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rv_item_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<Button
android:id="#+id/bt_order"
android:layout_width="150dp"
android:layout_height="50dp"
android:layout_weight="0"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:background="#drawable/bt_rounded_corner"
android:fontFamily="#font/microbrew_two"
android:padding="3dp"
android:text="#string/btn_add_to_order"
android:textColor="#color/backgroundLightSecondary"
android:textSize="20sp" />
</LinearLayout>
</LinearLayout>
In such cases, the best way is to use a ConstraintLayout as the container. As you mentioned in the question, you want to lay the RecyclerView at the center. So, it leads to binding its top and bottom to the buttons.
On the other hand, if we make a chain between the RecyclerView and submitButton with a vertical chain style of packed, the submitButton would stick to the bottom of RecyclerView (which height is wrap_content to be able to grow) and moves with its bottom until it reaches the bottom of the screen (because of app:layout_constraintBottom_toBottomOf="parent").
The key point is to set app:layout_constrainedHeight="true" for the RecyclerView leading to not overlap with the two buttons.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="8dp" >
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/closeImageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_baseline_close_24"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="#id/submitButton"
app:layout_constraintTop_toBottomOf="#id/closeImageButton"
app:layout_constraintVertical_chainStyle="packed" />
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/submitButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Submit"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/recyclerView" />
</androidx.constraintlayout.widget.ConstraintLayout>
Visual Result:
As I understand You want a button on top followed by recyclerview and than a Submit button in the end.And if size of recyclerview grows Submit button should not change its place.
Try this I make a rough layout
<LinearLayout //This is root layout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycle"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
Output of code looks like this
You can do everything you want in just one hierarchy by using ConstraintLayout. As an example, I edited your XML code as below;
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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">
<Button
android:id="#+id/bt_close"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#drawable/ic_close"
android:textColor="#android:color/white"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rv_item_options"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="30dp"
android:layout_marginBottom="10dp"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintBottom_toTopOf="#+id/bt_order"
app:layout_constraintTop_toBottomOf="#+id/bt_close" />
<Button
android:id="#+id/bt_order"
android:layout_width="150dp"
android:layout_height="50dp"
android:background="#android:color/holo_blue_dark"
android:padding="3dp"
android:text="Button"
android:textColor="#android:color/white"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/rv_item_options" />
</androidx.constraintlayout.widget.ConstraintLayout>
So, I would like to add a button with the text "Already Registered?" on the middle bottom screen but my code contains a two different LinearLayouts for the half left and the half right side. I want the button to be half on the left Linearlayout and half on the right. In addition, they are clickable so as far as I concern I must have them in my current layout and not include them.
what I currently have:
What I want to get:
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:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
tools:context=".MainActivity"
android:weightSum="2"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/customerLinearLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:layout_weight="1"
android:background="#color/lightblueMainActivity"
android:onClick="customerSignUp">
<TextView
android:layout_gravity="center_vertical"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:textColor="#color/orangeMainActivity"
android:text="#string/customerMainActivity"/>
</LinearLayout>
<LinearLayout
android:id="#+id/electricianLinearLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:layout_weight="1"
android:background="#color/orangeMainActivity"
android:onClick="electricianSignUp">
<TextView
android:layout_gravity="center_vertical"
android:gravity="center"
android:textSize="24sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/lightblueMainActivity"
android:text="#string/electricianMainActivity"/>
</LinearLayout>
</LinearLayout>
THANKS IN ADVANCE!
There are other types of ViewGroup besides LinearLayout which allow you to achieve a "split screen" effect, but let's keep it simple and use a weighted LinearLayout to divide the screen.
The child Views however can be TextViews (no intermediate ViewGroup required) because you can let them have a background color and also control the text alignment.
Since you want the Button to overlap both parts of the screen, you can put it and the LinearLayout into a FrameLayout (I used a TextView but the attributes are basically the same):
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:text="Customer"
android:textColor="#aaaaaa"
android:textSize="20sp"
android:gravity="center"
android:background="#0000ff"/>
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:text="Electrician"
android:textColor="#666666"
android:textSize="20sp"
android:gravity="center"
android:background="#ffab00"/>
</LinearLayout>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|bottom"
android:layout_marginBottom="24dp"
android:textColor="#ffffff"
android:textSize="20sp"
android:text="Already Registered?"/>
</FrameLayout>
I am showing the user some stats. There is a lot of information on the screen so space is cramped. I decided to use a horizontal scroll view which contains 9 TextViews in total. However, I only want to display three of these text views at a time.
Like so:
(The arrow is a just separate image view that just show's the user they can scroll)
This is fine and how I want it to look. However, there is 6 other stats which I need to show. I wish to be able to scroll to the right and three new text views to appear (and back to the left when I get to the last three stats). This horizontal scroll view is the parent of a LinearLayout which has 9 child TextViews. I tried putting every three TextViews in there own linear layouts but was prevented because the Horizontal Scroll View can only have one LinearLayout child.
I currently have the other 6 stats visibility to gone because they are currently added below the top 3 stats in a vertical order like this image shows:
My plan was originally to pro-grammatically display the next three stats and hide the original when scrolled but before I programmed this I tested to see if the first three were scroll-able but they don't react when I try to scroll.
How do I got about this?
Here is my current xml:
<HorizontalScrollView
android:id="#+id/sv_horizontalP1Stats"
android:layout_width="0dp"
android:layout_height="97dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
app:layout_constraintBottom_toBottomOf="#+id/sv_horizontalP2Stats"
app:layout_constraintEnd_toStartOf="#+id/sv_player1PastScores"
app:layout_constraintHorizontal_bias="0.596"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/iv_navArrowP1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/tv_legAvg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="#string/tv_LegAVG"
android:textSize="13sp" />
<TextView
android:id="#+id/tv_matchAVG"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="#string/tv_MatchAVG"
android:textSize="13sp" />
<TextView
android:id="#+id/tv_first6Avg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="#string/tv_first6AVG"
android:textSize="13sp" />
<TextView
android:id="#+id/tv_100plus"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/tv_100plus"
android:visibility="gone" />
<TextView
android:id="#+id/tv_140Plus"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/tv_140plus"
android:visibility="gone" />
<TextView
android:id="#+id/tv_180s"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/tv_180"
android:visibility="gone" />
<TextView
android:id="#+id/tv_bestFinish"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/tv_bestFinish"
android:visibility="gone" />
<TextView
android:id="#+id/tv_bestLeg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/tv_BestLeg"
android:visibility="gone" />
<TextView
android:id="#+id/tv_doublesPercentage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/tv_doubles"
android:visibility="gone" />
</LinearLayout>
</HorizontalScrollView>
All you need to do is create multiple linear layouts inside your main linear layout. Each containing 3 textviews and change the orientation of main linear layout to horizontal and you're good to go.
e.g :
<HorizontalScrollView
android:id="#+id/sv_horizontalP1Stats"
android:layout_width="0dp"
android:layout_height="97dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
app:layout_constraintBottom_toBottomOf="#+id/sv_horizontalP2Stats"
app:layout_constraintEnd_toStartOf="#+id/sv_player1PastScores"
app:layout_constraintHorizontal_bias="0.596"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/iv_navArrowP1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"> <!-- Changing orientation to horizontal -->
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"> <!-- Group 1 of TV -->
<TextView
android:id="#+id/tv_legAvg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:text="#string/tv_LegAVG"
android:textSize="13sp" />
<TextView
android:id="#+id/tv_matchAVG"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:text="#string/tv_MatchAVG"
android:textSize="13sp" />
<TextView
android:id="#+id/tv_first6Avg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:text="#string/tv_first6AVG"
android:textSize="13sp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"> <!-- Group 2 -->
// .. Next three
</LinearLayout>
// .. And soo on
</LinearLayout>
</HorizontalScrollView>`
I'm trying to build the screen from picture on a tablet.
Inside fragment i have a RecyclerView with items. Each item has as root a LinearLayout. and has exactly 8 children spread horizontally with weight 1 (as in below code). The first cell on each row is a TextView and the other cells are a CustomView (a vertical LinearLayout with 2 TextViews).
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:orientation="horizontal" />
<TextView
android:id="#+id/item_id"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_margin="2dp"
android:layout_weight="1"
android:background="#drawable/item_border"
android:drawableTop="#drawable/ic_id"
android:fontFamily="#font/cabin_bold"
android:gravity="center"
android:padding="5dp"
android:text="#string/mock"
android:textColor="#android:color/black"
android:textSize="17sp" />
<CustomView X 7 times
android:id="#+id/item_attr1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="2dp"
android:layout_weight="1"
app:titleText="Mock" />
</LinearLayout>
Given that, the row's children are not spread correctly on width, as you can see in the image. I've tried with weightSum attribute to row's root LinearLayout, but no luck. I've noticed that this issue appears (especially) when the first child of the row (which is a TextView) has a many characters.
Here is fragment's layout:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#F1F1F1">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="8dp"
app:layoutManager="LinearLayoutManager" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/add_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="30dp"
android:src="#android:drawable/ic_input_add"
android:tint="#android:color/white"
app:backgroundTint="#android:color/holo_blue_dark"
app:fabSize="normal" />
<TextView
android:id="#+id/loading_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fontFamily="#font/roboto_light"
android:text="#string/loading"
android:textSize="23sp"
android:visibility="gone" />
</android.support.design.widget.CoordinatorLayout>
Any ideas are appreciated
On the TextView:
<TextView
...
android:maxLines="1"
android:maxLength="8"
android:ellipsize="end"/>
This will prevent the TextViews from becoming too big. You can play about with the maxLength attribute to see which will fit your scenario better.
Your LinearLayout should encompass the rest of the code it's self closing now. Replace the closing tag /> with >
Close the LinearLayout below the custom view
I have FrameLayout like this:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="changeColor"
android:text="new button"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some text"/>
</FrameLayout>
The problem is that the button is displayed on top while FrameLayout class overview tells us this: "Child views are drawn in a stack, with the most recently added child on top".
Update:
in android 21+ after introduction of elevation one can play with elevation attribute of various widgets to put them on top of one another. here is a material design guide for elevation values.
for api < 21 :
This answer
Buttons in Lollipop and higher have a default elevation to them which
causes them to always draw on top. You can change this by overriding
the default StateListAnimator.
Try putting this into your button XML:
android:stateListAnimator="#null"
The FrameLayout should now cover the
button.
In the Android 5.0 (API 21) and above, you must add android:elevation into the view.
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="changeColor"
android:text="new button"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some text"
android:elevation="3dp"/>
Put your Button inside FrameLayout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="new button" />
</FrameLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some text" />
</RelativeLayout>
As the official android documantation points out:
FrameLayout is designed to block out an area on the screen to display
a single item. Generally, FrameLayout should be used to hold a single
child view, because it can be difficult to organize child views in a
way that's scalable to different screen sizes without the children
overlapping each other. You can, however, add multiple children to a
FrameLayout and control their position within the FrameLayout by
assigning gravity to each child, using the android:layout_gravity
attribute.
It's better if you put your Button and Textview in a RelativeLayout inside the FrameLayout like:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some text"/>
<Button
android:id="#+id/button1"
android:layout_below="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="changeColor"
android:text="new button"/>
<RelativeLayout>
</FrameLayout>
Apperently android:stateListAnimator="#null" works only for API = 21 or higher,
So for those who target API<21 use this, it worked for me :D
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="changeColor"
android:text="new button"/>
</FrameLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some text"/>
</FrameLayout>
FrameLayout should be used to hold a single child view, because it can be difficult to organize child views in a way that's scalable to different screen sizes without the children overlapping each other.
You should use LinearLayout or RelativeLayout in FrameLayout .
Like this way
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="changeColor"
android:text="new button"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some text"/>
</RelativeLayout>
</FrameLayout>
For API < 21 you cant use android:stateListAnimator="#null" or change the elevation. In my case I used 2 frame layouts embedded in a constraint layout.
As the frame layouts can be stacked upon each other there is no need to change the elevation of the textview.
<android.support.constraint.ConstraintLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
>
<Button
android:id="#+id/my_daybutton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/cal_button_background"
android:textColor="#color/colorPrimaryDark"
android:gravity="start|top"
android:paddingTop="2dp"
android:paddingStart="2dp"
android:paddingEnd="2dp"
/>
</FrameLayout>
<FrameLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bla"
android:textSize="9sp"
android:textColor="#android:color/holo_red_dark"
android:layout_gravity="bottom|end"
/>
</FrameLayout>
Just put elevation FrameLayout or any parent there you are going to load you fragment like
android:elevation="#dimen/dimen_20"
<FrameLayout
android:layout_width="match_parent"
android:layout_height="#dimen/dimen_0"
android:id="#+id/ready_to_scan"
app:layout_constraintTop_toTopOf="parent"
android:elevation="#dimen/dimen_20"
app:layout_constraintBottom_toBottomOf="parent"/>