Develop Reference

Constraint Layout height takes available space

I have a constraint layout and inside a linear layout that looks like a bar that is constrained to the bottom. Besides I have an item (called SwipeFlingAdapterView) that I would like to take the remaining space, meaning to start from the top, and to go all the way down until the top of the linear layout bar:
<?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"
tools:context=".fragments.SwipeFragment">
<LinearLayout
android:id="#+id/likeDislikeBar"
android:layout_width="match_parent"
android:layout_height="#dimen/like_dislike_height"
android:gravity="bottom"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent">
<ImageButton
android:id="#+id/dislikeButton"
android:layout_width="0dp"
android:layout_height="#dimen/like_dislike_button_height"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/dislike"
android:layout_gravity="center_vertical"
android:scaleType="centerInside"/>
<ImageButton
android:id="#+id/likeButton"
android:layout_width="0dp"
android:layout_height="#dimen/like_dislike_button_height"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/like"
android:layout_gravity="center_vertical"
android:scaleType="centerInside"/>
</LinearLayout>
<com.lorentzos.flingswipe.SwipeFlingAdapterView
android:id="#+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toTopOf="#id/likeDislikeBar"
app:rotation_degrees="15.5"/>
</androidx.constraintlayout.widget.ConstraintLayout>
The views are constrained correctly, so theoretically if I remove the height="match_parent" from the SwipeFlingAdapterView, it will take the available space. Setting its height to "match_parent" will cause it to overlay the likeDislikeBar.
Is there a simple way to achieve this? Can I do it with a constraint layout?

It is not recommended to use match_parent for any child of the ConstraintLayout as stated in the official docs and tutorial. This applies to both vertical and horizontal dimensions.
In order to make the SwipeFlingAdapterView use all available height between the constraints you need to set its android:layout_height to 0dp (to match constraints).

You need to remove
app:layout_constraintEnd_toEndOf="parent"
Also ConstraintLayout seems like an overkill for such a simple layout.
RelativeLayout is pretty sufficient here. You can set likeDislikeBar to have layout_alignParentBottom and SwipeFlingAdapterView to have layout_alignParentTop and android:layout_above="#id/likeDislikeBar" in this case.

Custom View not adhering to Constraints in Constraint Layout

I have a custom FrameLayout in my project which acts as a button since I did not want to to keep repeating same code.
The view works perfectly but when I need to arrange them horizontally constraining to each other, The center view does not follow the constraints and instead, It aligns to parent start overshadowing the other.
What should I do to my code to ensure the constraints work as expected?
The code is as below
dash_buttons.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.revosleap.wazalendo.utils.ui.DashButton
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#id/dashButtonLoan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:dash_text="Pay"
app:dash_icon="#drawable/ic_pay"
android:id="#+id/dashButtonPay"
/>
<com.revosleap.wazalendo.utils.ui.DashButton
app:layout_constraintStart_toEndOf="#id/dashButtonPay"
app:layout_constraintEnd_toStartOf="#id/dashButtonAccount"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:dash_text="Loan"
app:dash_icon="#drawable/ic_loan"
android:id="#+id/dashButtonLoan"
/>
<com.revosleap.wazalendo.utils.ui.DashButton
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/dashButtonLoan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:dash_text="Account"
app:dash_icon="#drawable/ic_user"
android:id="#+id/dashButtonAccount"
/>
</android.support.constraint.ConstraintLayout>
The result

I finally figured it out. It seems Constraint Layout has some issues with custom views that use layout resource containing Linear Layout. To achieve my objective, I changed parent layout from Constraint layout to Frame layout and used gravity to maintain positions and all runs perfectly now.

RecyclerView overlaps TextView and Button or disappear inside the fragment

I stuck for a whole day with simple question...
Inside my fragment I want to place vertically from the top - TextView(title), below it - RecyclerView, and below recyclerview - button
This is my fragment xml
<?xml version="1.0" encoding="utf-8"?><android.support.constraint.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"
tools:context=".presentation.view.CurrentLocationFragment">
<TextView
android:id="#+id/country_output"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/recycler_view_title"
android:textAlignment="center"
android:textSize="30sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="12dp"
app:layout_constraintBottom_toTopOf="#id/btn_country_choice"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/country_output"
/>
<Button
android:id="#+id/btn_country_choice"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/yes"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
in this case recyclerview overlaps textview and button partially overlaps recyclerview. this is a screenshot
if I define in recyclerview android:layout_height="0dp" then I have another problem - recyclerview disappered
preview in android studio displays me all like I need, but on device all is another
any suggestions?

Your RecyclerView has constraints issues. Its height is not being constraint, it is wrapping its content. You should use 0dp, which means MATCH_CONSTRAINT:
Using 0dp, which is the equivalent of "MATCH_CONSTRAINT"
Important: MATCH_PARENT is not recommended for widgets contained in a
ConstraintLayout. Similar behavior can be defined by using
MATCH_CONSTRAINT with the corresponding left/right or top/bottom
constraints being set to "parent".
https://developer.android.com/reference/android/support/constraint/ConstraintLayout
Also, instead of #id use #+id. This is because you Button ID is only declared before your RecyclerView in your layout. From the docs:
The at-symbol (#) at the beginning of the string indicates that the
XML parser should parse and expand the rest of the ID string and
identify it as an ID resource. The plus-symbol (+) means that this is
a new resource name that must be created and added to our resources
(in the R.java file). There are a number of other ID resources that
are offered by the Android framework. When referencing an Android
resource ID, you do not need the plus-symbol, but must add the android
package namespace.
So, applying everything:
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="12dp"
app:layout_constraintBottom_toTopOf="#+id/btn_country_choice"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/country_output"/>

Use MATCH_CONSTRAINT for height and width both for RecyclerView into added layout code in question. As below
android:layout_width="0dp"
android:layout_height="0dp"

Divide the screen into SurfaceView and xml layout

MyActivity has setContentView(MySurfaceView) that covers all the screen.
I would like to divide the screen into two parts: the first 2/3 of the screen must be occupied by MySurfaceView and the last 1/3 by my_activity_layout.xml.
How can I do that? Thanks.
EDIT
Thanks for your answers, but I don't have how to apply them in my case. To be clear, these are my objects:

Solution:
To attach an xml file in your layout, you can make use of the <include> tag.
Reusing layouts is particularly powerful as it allows you create reusable complex layouts. For example, a yes/no button panel, or custom progress bar with description text. More
You can have a functionality as shown in the question with the help of ConstraintLayout. Of course, there are solutions using the legacy <LinearLayout> with something called as weights but as the warning says Weights are bad for performance.
Why weights are bad for performance?
Layout weights require a widget to be measured twice. When a LinearLayout with non-zero weights is nested inside another LinearLayout with non-zero weights, then the number of measurements increase exponentially.
So let's get on to the solution using <ConstraintLayout>.
Let's say we have a layout file called my_activity_layout.xml and we use the below code to achieve what we want:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
tools:context=".MainActivity">
<SurfaceView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.constraint.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.67" />
<include
android:id="#+id/news_title"
layout="#layout/my_activity_layout"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline" />
</android.support.constraint.ConstraintLayout>
As you can see the Guideline help us to get 2/3 i.e 66.666 ~ 67 % of the screen, and then you can constraint your SurfaceView and your layout using <include> tag on your activity.
You can also see the required result:
You can just copy-paste the solution and see if it works as expected.

You can solve this with a linear Layout and specifying a layout weight for the correction ratios.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<SurfaceView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"/>
<include layout="my_activity_layout.xml"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>

Have ways for remain previous layout in all pages?

I want to create an application that have 5 buttons in bottom of page, when user clicks
on the any button, the page will changes but 5buttons remain in bottom of page. now i create
this program but when i call setContentView() in other class becuase i call other layout,
buttons removed. have ways for remain 5buttons? or i should create 5buttons again in 5layout?
Thanks
Cheers

Easiest and Simple way is to make a layout having 5 buttons and it in all your layout files
Example
<include layout="#layout/titlebar"/>
Or another way is to use fragments so tht only fragments with change keeping other of your layout stuff same
Edit
OR Use the <merge> Tag
The <merge /> tag helps eliminate redundant view groups in your view hierarchy when including one layout within another. For example, if your main layout is a vertical LinearLayout in which two consecutive views can be re-used in multiple layouts, then the re-usable layout in which you place the two views requires its own root view. However, using another LinearLayout as the root for the re-usable layout would result in a vertical LinearLayout inside a vertical LinearLayout. The nested LinearLayout serves no real purpose other than to slow down your UI performance.
To avoid including such a redundant view group, you can instead use the element as the root view for the re-usable layout. For example:
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/add"/>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/delete"/>
</merge>
Now, when you include this layout in another layout (using the tag), the system ignores the element and places the two buttons directly in the layout, in place of the tag.
Please go through this link to gain more information about Reusing layouts

From what I can gather, I think you are looking for tabs instead of Buttons. Take a look at this.

Thanks for answer. I read developer link and i add merge and include tag to xml file but the program has errors. Why?
MainActivity.xml
<?xml version="1.0" encoding="utf-8"?>
<include layout="#layout/location"/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<WebView
android:id="#+id/web_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.0" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/background"
android:gravity="bottom"
android:orientation="horizontal" >
<Button
android:id="#+id/button_home"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/home_icon"
android:text="#string/button_home"
android:textColor="#color/text_home" />
<Button
android:id="#+id/button_product"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/product_icon"
android:onClick="Product"
android:text="#string/button_product"
android:textColor="#color/text_product" />
<Button
android:id="#+id/button_places"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/places_icon"
android:onClick="Places"
android:text="#string/button_places"
android:textColor="#color/text_places" />
<Button
android:id="#+id/button_rewards"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/rewards_icon"
android:onClick="Rewards"
android:text="#string/button_rewards"
android:textColor="#color/text_rewards" />
<Button
android:id="#+id/button_more"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/more_icon"
android:onClick="More"
android:text="#string/button_more"
android:textColor="#color/text_more" />
</LinearLayout>
</LinearLayout>
location.xml
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView>
<com.google.android.maps.MapView
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:apiKey="0cPRv243zM1_S3ydsNg8MJP9_6BfCp642jOhPvQ"/>
<LinearLayout
android:id="#+id/zoom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</LinearLayout>
</merge>
what is incorrect?
Thank you