Android - Layout Width wrapping content despite being set to match parent?

Question

I am currently having the issue where despite having all the layouts being set to match_parent , within my fragment, unless something explicitly takes up the screen width, such as a TextView with a massive text String, the layouts end up having their width wrapped to their content.

This is the XML:

MainActivity.xml

<android.support.v4.widget.DrawerLayout
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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white"
    tools:context="es.esports_app.MainActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/mainToolbar"
        android:minHeight="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/notQuiteBlack"
        app:layout_constraintTop_toTopOf="parent">

    </android.support.v7.widget.Toolbar>

    <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="0dp"
        android:fillViewport="true"
        app:layout_constraintBottom_toTopOf="@+id/navigationViewLayoutWrapper"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/mainToolbar">

        <!-- Where fragment content is inserted -->
        <FrameLayout
            android:id="@+id/Container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

        </FrameLayout>

    </android.support.constraint.ConstraintLayout>

    <include
        android:id="@+id/navigationViewLayoutWrapper"
        layout="@layout/main_bottom_navigation_bar" />

</android.support.constraint.ConstraintLayout>

<ListView
    android:id="@+id/navigation_drawer_list"
    android:layout_width="240dp"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:choiceMode="singleChoice"
    android:divider="@android:color/transparent"
    android:dividerHeight="0dp"
    android:background="#111" />

series_wrapper.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"
   android:layout_width="match_parent"
   android:layout_height="match_parent">

<android.support.design.widget.TabLayout
    android:id="@+id/seriesSectionTabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/notQuiteBlack"
    app:tabTextColor="@color/mdGrey400"
    app:tabIndicatorColor="@color/white"
    app:tabSelectedTextColor="@color/white"
    app:tabMode="scrollable"
    app:tabGravity="fill"
    app:tabMaxWidth="0dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent">


</android.support.design.widget.TabLayout>

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="YAY"
    app:layout_constraintTop_toBottomOf="@id/seriesSectionTabs"/>

</android.support.constraint.ConstraintLayout>

Where fragment is Added

holder.eventSeriesWrapper.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            AppCompatActivity appCompatActivity = (AppCompatActivity) view.getContext();
            Fragment fragment = new SeriesWrapperFragment();
            Bundle bundle = new Bundle();
            bundle.putInt("seriesID", eventSeries.id);
            bundle.putInt("seriesLength", eventSeries.seriesLength);
            fragment.setArguments(bundle);
            appCompatActivity.getFragmentManager().beginTransaction().replace(R.id.Container, fragment).addToBackStack(null).commit();
        }
    });

The above code results in this

In the case where I set the TextView text to a very long string that spans the width of the screen:

This is the result

This is exactly what I want the tab layout to look like, but I don't want to have to define a TextView or something of the like to be the screen width to get it to display in this way.

I have also tried setting the Layout Params of the Fragment in onCreateView, however, the UI was the same as in the first image

Series Wrapper Fragment OnCreateView

public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.series_wrapper, container, false);
    view.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));

    if(this.getArguments() != null){
        this.seriesID = this.getArguments().getInt("seriesID");
        this.seriesLength = this.getArguments().getInt("seriesLength");
    }
    else{
        this.seriesID = 0;
        this.seriesLength = 0;
    }

    return view;
}

If any more code snippets or images are required please ask.

If someone could help me understand as to why this is occurring, it would be greatly appreciated.

Thank you.

Answer 1

This is happening because match_parent doesn't works in ConstraintLayout .Instead you need to use match_constraint from Designing View or you can set match_constraint by making heigh/width = 0dp

Example you tab layout set android:layout_width="0dp" which will behave as match_parent in ConstraintLayout like this

<android.support.design.widget.TabLayout
    android:id="@+id/seriesSectionTabs"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="@color/notQuiteBlack"
    app:tabTextColor="@color/mdGrey400"
    app:tabIndicatorColor="@color/white"
    app:tabSelectedTextColor="@color/white"
    app:tabMode="scrollable"
    app:tabGravity="fill"
    app:tabMaxWidth="0dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent">

Same this goes with your TextView too

Answer 2

Add this line of code in Recyclerview Adapter in onCreateViewHolder() method it works for me.

 // Add this line if you are using data binding. binding.root.layoutParams = RecyclerView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT) return ViewHolder(binding) // change the class of ViewHolder with your ViewHolder // Add this line if you are not using data binding. val view = inflater.inflate(R.layout.movie_adapter_ly,parent,false) view.rootView.layoutParams = RecyclerView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT) // change the class of ViewHolder with your ViewHolder class return ViewHolder(view)