Develop Reference

Android xml styling for different sized elements in constrained layout

I have the farrowing code that I am using to dynamically place items in gridview
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="350dp"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_margin="#dimen/margin_small"
card_view:cardCornerRadius="10dp"
card_view:cardElevation="#dimen/margin_small">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_small"
android:layout_gravity="center">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/name"
card_view:layout_constraintTop_toTopOf="parent"
card_view:layout_constraintBottom_toTopOf="#+id/cost"
card_view:layout_constraintStart_toStartOf="#+id/image"
android:maxLines="3"
android:padding="9dp"
android:textAppearance="?android:attr/textAppearanceSmall"/>
<TextView
android:id="#+id/cost"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/ksh_000_00"
card_view:layout_constraintTop_toBottomOf="#+id/name"
card_view:layout_constraintBottom_toTopOf="#+id/image"
card_view:layout_constraintStart_toStartOf="#+id/image"
android:textAppearance="?android:attr/textAppearanceSmall"
android:typeface="serif"/>
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="150dp"
android:contentDescription="#string/food_fuzz_logo"
android:src="#drawable/logo"
card_view:layout_constraintBottom_toTopOf="#+id/footer"
card_view:layout_constraintEnd_toEndOf="parent"
card_view:layout_constraintStart_toStartOf="parent"
card_view:layout_constraintTop_toBottomOf="#+id/cost"
tools:scaleType="fitCenter" />
<LinearLayout
android:layout_width="match_parent"
android:id="#+id/footer"
android:layout_height="wrap_content"
card_view:layout_constraintTop_toBottomOf="#+id/image"
card_view:layout_constraintBottom_toBottomOf="parent"
card_view:layout_constraintEnd_toEndOf="#+id/image"
card_view:layout_constraintStart_toStartOf="#+id/name"
android:orientation="horizontal"
android:background="#color/gradient_background">
<TextView
android:id="#+id/minus"
android:layout_width="14dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginStart="#dimen/activity_vertical_margin"
android:gravity="start"
android:text="#string/minus"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:layout_width="30dp"
android:layout_height="wrap_content"
android:id="#+id/quantity"
android:text="#string/zero"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold"
android:layout_gravity="center"
android:gravity="center"/>
<TextView
android:layout_width="30dp"
android:layout_height="wrap_content"
android:id="#+id/plus"
android:text="#string/plus"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold"
android:layout_gravity="end"
android:gravity="end"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
now I would like to have it like the bootstrap card with card-header, card-body and card-footer effect but I am only able to make it have the body like effect only. My attempt for the footer only positions the footer id element in the centre and its components crumbled together instead of the first one(minus) being spread out one to the extreme left, the other(quantity) in the centre and the last one(plus)n to the extreme right of the cardview's linear layout item.
This is what the code gives me
And this is what I expect
yet what I want is for the grey area to span the entire width of the card view and position the components appropriately as explained earlier
How is it possible to achieve my design idea?

what I want is for the grey area to span the entire width of the card view
I see that you used tools:scaleType for the image, and this won't work at runtime, as tools namespace is used for design purpose, so change it to android:scaleType
and position the components appropriately as explained earlier
You need to set the width of the LinearLayout that holds the buttons to match_parent, and set the weight values so that the buttons can be distribute like you need:
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="350dp"
android:layout_margin="#dimen/margin_small"
card_view:cardCornerRadius="10dp"
card_view:cardElevation="#dimen/margin_small">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="#dimen/margin_small">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="3"
android:padding="9dp"
android:text="#string/name"
android:textAppearance="?android:attr/textAppearanceSmall"
card_view:layout_constraintBottom_toTopOf="#+id/cost"
card_view:layout_constraintStart_toStartOf="#+id/image"
card_view:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/cost"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/ksh_000_00"
android:textAppearance="?android:attr/textAppearanceSmall"
android:typeface="serif"
card_view:layout_constraintBottom_toTopOf="#+id/image"
card_view:layout_constraintStart_toStartOf="#+id/image"
card_view:layout_constraintTop_toBottomOf="#+id/name" />
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="150dp"
android:scaleType="fitCenter"
android:src="#drawable/ic_launcher_background"
card_view:layout_constraintBottom_toTopOf="#+id/footer"
card_view:layout_constraintEnd_toEndOf="parent"
card_view:layout_constraintStart_toStartOf="parent"
card_view:layout_constraintTop_toBottomOf="#+id/cost"
tools:scaleType="fitCenter" />
<LinearLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/gradient_background"
android:orientation="horizontal"
card_view:layout_constraintBottom_toBottomOf="parent"
card_view:layout_constraintEnd_toEndOf="#+id/image"
card_view:layout_constraintStart_toStartOf="#+id/name"
card_view:layout_constraintTop_toBottomOf="#+id/image">
<TextView
android:id="#+id/minus"
android:layout_width="14dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginStart="#dimen/activity_vertical_margin"
android:gravity="start"
android:text="#string/minus"
android:layout_weight="1"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/quantity"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="#string/zero"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/plus"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginEnd="#dimen/activity_vertical_margin"
android:layout_weight="1"
android:layout_gravity="end"
android:gravity="end"
android:text="#string/plus"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>

How to set alpha property to image not to text in Android Studio?

I use linearlayout to equally spread the space of view group. I set view group background as image and added alpha property to linearlayout. opacity is applied to all the views in view group.But I want alpha property should be applied to only background image not to textview.Is there any way to do this in linearlayout.
<LinearLayout
android:layout_height="300dp"
android:layout_width="match_parent"
android:layout_below="#id/getCoffeeText"
android:background="#drawable/coffee"
android:layout_marginLeft="20sp"
android:layout_marginRight="20sp"
android:alpha="0.5"
android:layout_centerHorizontal="true"
android:layout_marginTop="20sp"
android:orientation="vertical"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="Order Coffee Here....!!!!"
android:textColor="#D50000"
android:textSize="20sp"
android:layout_marginLeft="60sp"/>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<Button
android:text="+"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
android:onClick="incrementCoffeeCount"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
android:padding="45sp"
android:text="0"
android:textSize="20sp"
android:textColor="#D50000"
android:id="#+id/coffeeCount"
/>
<Button
android:text="-"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
android:onClick="decrementCoffeeCount"
/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="Price"
android:textSize="25sp"
android:textColor="#D50000"
android:layout_marginLeft="130sp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="$0"
android:textSize="20sp"
android:textColor="#D50000"
android:layout_marginLeft="130sp"
android:id="#+id/price"/>
<Button
android:text="Order"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_marginLeft="110sp"
android:onClick="submitOrder"/>
</LinearLayout>
I want to do this in linearlayout not in Relativelayout.Anyone please help me.Thanks in advance.

Try using FrameLayout like below code:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.5"
android:layout_gravity="center"
android:background="#drawable/coffee" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="Hello World!"
android:textColor="#color/orange"
android:textSize="30sp" />
</LinearLayout>
</FrameLayout>

How to align TextView + RecyclerView at screen bottom within ScrollView?

I have the next structure of XML file in my Fragment. I have an issue with RelativeLayout 3 (id=referralsContainer). It consist of textView (id=inviteText) + RecyclerView (id=rv_referrals). I need to show textView at the bottom of screen with any resolution. And after that textView must be RecyclerView with elements (when user will scroll down). I tried to do something like this in method, when all elements of recyclerview loaded, but recyclerview is replaced in different positions by Y axe from time to time, I can't understand how to correctly place that textview at the bottom of the scrren. And also ScrollView cuts several items of recyclerView. Does anybody can help with this? All positions in debugger looks right. Code+xml is below image. Thanks.
this.dataSourceListForAdapter.addAll(incomeListOfItemsFromServer);
recyclerView.setY(scrollView.getBottom() - textView.getHeight());
recyclerView.setY(coordinatorView.getBottom() - textView.getHeight());
adapter.notifyDataSetChanged();
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/invite_friends_swipe_refresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/invite_friends_content_part"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:visibility="visible">
<RelativeLayout
android:id="#+id/invite_friends_container"
android:layout_width="match_parent"
android:layout_height="190dp"
android:layout_alignParentTop="true"
android:background="#color/re_black_light_new">
<TextView
android:id="#+id/invite_friends_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/invite_friends_button_container"
android:gravity="center"
android:paddingEnd="40dp"
android:paddingStart="40dp"
android:textColor="#color/white"
android:textSize="16sp"
tools:text="#string/friends_invite_message" />
<RelativeLayout
android:id="#+id/invite_friends_button_container"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true">
<View
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentTop="true"
android:layout_marginTop="2dp"
android:background="#drawable/combined_shape_white" />
<View
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_alignParentBottom="true"
android:background="#color/white" />
<android.support.v7.widget.CardView
android:id="#+id/invite_friends_button_invite"
android:layout_width="147dp"
android:layout_height="40dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginTop="10dp"
card_view:cardBackgroundColor="#color/white"
card_view:cardCornerRadius="3dp"
card_view:cardElevation="2dp"
card_view:cardPreventCornerOverlap="false"
card_view:cardUseCompatPadding="true">
<TextView
android:id="#+id/invite_friends_button_invite_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/yellow_button_selector"
android:clickable="true"
android:focusable="true"
android:fontFamily="sans-serif-medium"
android:gravity="center"
android:text="#string/friends_invite"
android:textAllCaps="true"
android:textColor="#color/re_black_light_new"
android:textSize="14sp" />
</android.support.v7.widget.CardView>
</RelativeLayout>
</RelativeLayout>
<TextView
android:id="#+id/copy_choice_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/invite_friends_container"
android:layout_centerHorizontal="true"
android:textSize="12sp"
android:text="#string/copy_link_text"
android:textColor="#color/re_gray_new" />
<RelativeLayout
android:id="#+id/invite_friends_referal_link_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/copy_choice_label"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="16dp"
android:background="#drawable/rectangle_gray">
<TextView
android:id="#+id/invite_friends_referal_link_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:background="?attr/selectableItemBackground"
android:clickable="true"
android:focusable="true"
android:fontFamily="sans-serif-light"
android:gravity="center"
android:padding="7dp"
android:textColor="#color/re_black_light"
android:textSize="12sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/invite_friends_full_info_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/invite_friends_referal_link_button"
android:layout_marginTop="32dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="10dp"
android:layout_marginStart="24dp"
android:layout_toLeftOf="#+id/invite_friends_container_central"
android:gravity="center_vertical">
<TextView
android:id="#+id/invite_friends_text_friends"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-medium"
android:text="#string/friends_invite_friends"
android:textColor="#color/re_black_light_new"
android:textSize="12sp" />
<TextView
android:id="#+id/invite_friends_friends_count"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/invite_friends_text_friends"
android:layout_marginTop="4dp"
android:fontFamily="sans-serif-medium"
android:textColor="#color/re_black_light_new"
android:textSize="24sp"
tools:text="4" />
<View
android:id="#+id/invite_friends_divider_horizontal"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/invite_friends_friends_count"
android:layout_marginTop="8dp"
android:background="#drawable/dash_horizontal_gray"
android:layerType="software" />
<TextView
android:id="#+id/invite_friends_text_orders"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="#+id/invite_friends_divider_horizontal"
android:layout_marginTop="14dp"
android:fontFamily="sans-serif-medium"
android:text="#string/friends_invite_orders"
android:textColor="#color/re_black_light_new"
android:textSize="12sp" />
<TextView
android:id="#+id/invite_friends_orders_count"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/invite_friends_text_orders"
android:layout_marginTop="4dp"
android:fontFamily="sans-serif-medium"
android:textColor="#color/re_black_light_new"
android:textSize="24sp"
tools:text="32" />
</RelativeLayout>
<View
android:id="#+id/invite_friends_container_central"
android:layout_width="1dp"
android:layout_height="1dp"
android:layout_centerInParent="true"
android:background="#drawable/dotted_line"
android:layerType="software" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginStart="10dp"
android:layout_toRightOf="#+id/invite_friends_container_central">
<TextView
android:id="#+id/invite_friends_income_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginStart="6dp"
android:fontFamily="sans-serif-medium"
android:text="#string/friends_invite_income"
android:textColor="#color/re_black_light_new"
android:textSize="12sp" />
<LinearLayout
android:id="#+id/invite_friends_income_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/invite_friends_income_text"
android:layout_marginTop="4dp"
android:orientation="horizontal">
<TextView
android:id="#+id/invite_friends_income_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="6dp"
android:fontFamily="sans-serif-medium"
android:lines="1"
android:maxLines="1"
android:textColor="#color/re_black_light_new"
android:textSize="24sp"
tools:text="1488.77" />
<TextView
android:id="#+id/invite_friends_income_currency"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:fontFamily="sans-serif-medium"
android:lines="1"
android:maxLines="1"
android:textColor="#color/re_black_light_new"
android:textSize="12sp"
tools:text="руб." />
</LinearLayout>
<View
android:id="#+id/invite_friends_divider_horizontal_2"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/invite_friends_income_container"
android:layout_marginEnd="16dp"
android:layout_marginTop="8dp"
android:background="#drawable/dash_horizontal_gray"
android:layerType="software" />
<TextView
android:id="#+id/invite_friends_text_income_pending"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/invite_friends_divider_horizontal_2"
android:layout_marginStart="6dp"
android:layout_marginTop="14dp"
android:fontFamily="sans-serif-medium"
android:text="#string/friends_invite_income_pending"
android:textColor="#color/re_black_light"
android:textSize="12sp" />
<LinearLayout
android:id="#+id/invite_friends_text_income_pending_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/invite_friends_text_income_pending"
android:layout_marginStart="6dp"
android:layout_marginTop="4dp"
android:orientation="horizontal">
<TextView
android:id="#+id/invite_friends_text_income_pending_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-medium"
android:textColor="#color/re_gray_new"
android:textSize="24sp"
tools:text="0" />
<TextView
android:id="#+id/invite_friends_text_income_pending_count_currency"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:fontFamily="sans-serif-medium"
android:lines="1"
android:maxLines="1"
android:textColor="#color/re_gray_new"
android:textSize="12sp"
tools:text="руб."/>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/referralsContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/invite_friends_content_part"
android:visibility="gone"
android:orientation="vertical">
<TextView
android:id="#+id/inviteText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:fontFamily="sans-serif-medium"
android:text="Вы уже пригласили:"
android:textColor="#color/re_black_light_new"
android:textSize="20sp"
android:textStyle="normal" />
<ImageView
android:id="#+id/scrollMore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/inviteText"
android:layout_centerHorizontal="true"
android:layout_marginBottom="6dp"
android:layout_marginTop="6dp"
android:src="#drawable/ic_scroll_more" />
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_referrals"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/scrollMore"
android:scrollbars="vertical" />
</RelativeLayout>
</RelativeLayout>
<LinearLayout
android:id="#+id/invite_friends_error_part"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:gravity="center"
android:orientation="vertical"
android:visibility="gone">
<ImageView
android:id="#+id/error_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:layout_marginTop="20dp"
android:scaleType="fitCenter"
android:src="#drawable/lost_connection_holder" />
<TextView
android:id="#+id/error_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/error_image"
android:layout_marginBottom="60dp"
android:layout_marginTop="10dp"
android:gravity="center_horizontal"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:text="#string/no_connection_message"
android:textColor="#color/black_tr_38"
android:textSize="19sp" />
</LinearLayout>
</RelativeLayout>
</ScrollView>
</android.support.v4.widget.SwipeRefreshLayout>

ScrollView is not purposed for sub-child layouts aligned to the bottom of screen as its direct child doesn't know where the bottom is. From your question is not clear how do you need (want) to scroll bottom part.
If it is ok to scroll by dragging bottom part (RelativeLayout 3) it is better to use BottomSheetBehaviour in Coordinatorlayout for this layout.
If not then just put RelativeLayout 3 under (below) SwipeRefreshLayout and handle ScrollView scrollChanged events to animate scrolling of bottom layout if you need or just show/hide this bottom layout.
Don't forget that on small resolutions layout aligned to the bottom will cover the content of ScrollView and user won't be able to scroll top layout.

make EditText below TextView

I am trying to make each editText stick to its width and be placed exactly below the score I tried to make them each take have of the width of the screen but the white space of the editText took the whole space.
they are both child LinearLayout of a vertical LinearLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/rightScoreTV"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
android:textAlignment="center"
android:text="0"
android:textSize="60sp"
android:paddingTop="8dp"/>
<TextView
android:id="#+id/leftScoreTV"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
android:textAlignment="center"
android:text="0"
android:layout_alignParentRight="true"
android:textSize="60sp"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="#+id/leftET"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:minHeight="40dp"
android:minWidth="70dp"
android:maxLines="1"
android:background="#android:color/white"
android:inputType="number" />
<EditText
android:id="#+id/rightET"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:minHeight="40dp"
android:minWidth="70dp"
android:maxLines="1"
android:background="#android:color/white"
android:inputType="number" />
</LinearLayout>

you can try this below:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/rightScoreTV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="8dp"
android:text="0"
android:textAlignment="center"
android:textSize="60sp"/>
<EditText
android:id="#+id/leftET"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:inputType="number"
android:maxLines="1"
android:minHeight="40dp"
android:minWidth="70dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/leftScoreTV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="0"
android:textAlignment="center"
android:textSize="60sp"
/>
<EditText
android:id="#+id/rightET"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:inputType="number"
android:maxLines="1"
android:minHeight="40dp"
android:minWidth="70dp"/>
</LinearLayout>
</LinearLayout>

You have used wrap_content for your layout_with. From the docs at https://developer.android.com/reference/android/view/View.html
MATCH_PARENT, which means the view wants to be as big as its parent (minus padding)
WRAP_CONTENT, which means that the view wants to be just big enough to enclose its content (plus padding).

You should use layout_weight for your two EditTexts
android:layout_width="0dp"
android:layout_weight="1"

use this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

Button position can't be placed correctly

I am developing an android app but buttons can't be placed correct position. I use layout_width="match_parent" but it is going to the right side. layout_gravity= "center" is also same.
<LinearLayout
android:layout_width="368dp"
android:layout_height="495dp"
android:orientation="vertical"
tools:layout_editor_absoluteY="8dp"
tools:layout_editor_absoluteX="8dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerInside"
android:id="#+id/imgView"
/>
<mehdi.sakout.fancybuttons.FancyButton
android:id="#+id/btn_spotify"
android:layout_width="match_parent"
android:layout_height="45dp"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
fancy:fb_textSize="20dp"
android:layout_gravity="center_vertical"
fancy:fb_borderColor="#FFFFFF"
fancy:fb_iconResource="#drawable/ic_image_black_24dp"
fancy:fb_borderWidth="1dp"
fancy:fb_defaultColor="#6495ED"
fancy:fb_focusColor="#9bd823"
fancy:fb_iconPosition="left"
fancy:fb_radius="10dp"
fancy:fb_text="LOAD PICTURE"
fancy:fb_textColor="#FFFFFF" />
<ru.dimorinny.floatingtextbutton.FloatingTextButton
android:id="#+id/action_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
app:floating_background_color="#color/colorPrimary"
app:floating_icon="#drawable/ic_image_black_24dp"
app:floating_title="Load Picture"
app:floating_title_color="#android:color/white" />
<Button
android:layout_below="#+id/buttonLoadPicture"
android:foregroundGravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="PROCESS"
android:scaleType="centerInside"
android:id="#+id/btn_process"
/>
<Button
android:layout_below="#+id/btn_process"
android:foregroundGravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Next Page"
android:scaleType="centerInside"
android:id="#+id/btn_next"
/>
<TextView
android:layout_below="#+id/btn_process"
android:foregroundGravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="NO TEXT"
android:textSize="18sp"
android:scaleType="centerInside"
android:id="#+id/textview_result"
/>
</LinearLayout>
So how can I fix it? I want to place the button correct position & it will be same for all android phone.

Change the width of Main parent layout Linearlayout width to Match_Parent and remove tools:layout_editor_absoluteY="8dp" and tools:layout_editor_absoluteX="8dp"
Edit :
As this LinearLayout is under ConstraintLayout. You need to assign app:layout_constraintLeft_toLeftOf and
app:layout_constraintRight_toRightOf property.
<LinearLayout
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

You're giving a fixed height and width for your parent LinearLayout. Either try
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
or go with a relativelayout.

Set Parent Linear layout width to android:layout_width="match_parent" and android:gravity="center_horizontal"
<LinearLayout
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp"
android:layout_width="match_parent"
android:layout_height="495dp"
android:gravity="center_horizontal"
android:orientation="vertical">
<ImageView
android:id="#+id/imgView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerInside" />
<mehdi.sakout.fancybuttons.FancyButton
android:id="#+id/btn_spotify"
android:layout_width="match_parent"
android:layout_height="45dp"
android:layout_gravity="center_vertical"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
fancy:fb_borderColor="#FFFFFF"
fancy:fb_borderWidth="1dp"
fancy:fb_defaultColor="#6495ED"
fancy:fb_focusColor="#9bd823"
fancy:fb_iconPosition="left"
fancy:fb_iconResource="#drawable/ic_image_black_24dp"
fancy:fb_radius="10dp"
fancy:fb_text="LOAD PICTURE"
fancy:fb_textColor="#FFFFFF"
fancy:fb_textSize="20dp" />
<ru.dimorinny.floatingtextbutton.FloatingTextButton
android:id="#+id/action_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
app:floating_background_color="#color/colorPrimary"
app:floating_icon="#drawable/ic_image_black_24dp"
app:floating_title="Load Picture"
app:floating_title_color="#android:color/white" />
<Button
android:id="#+id/btn_process"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/buttonLoadPicture"
android:foregroundGravity="center_horizontal"
android:scaleType="centerInside"
android:text="PROCESS" />
<Button
android:id="#+id/btn_next"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/btn_process"
android:foregroundGravity="center_horizontal"
android:scaleType="centerInside"
android:text="Next Page" />
<TextView
android:id="#+id/textview_result"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/btn_process"
android:foregroundGravity="center_horizontal"
android:scaleType="centerInside"
android:text="NO TEXT"
android:textSize="18sp" />
</LinearLayout>

if your LinearLayout is under ConstraintLayout use this
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"