Children from custom LinearLayout not displaying ripple effect

Question

I'm using a custom LinearLayout (extends LinearLayout), so that and Adapter (BaseAdapter) can be attached to it.

(Thanks to the original author ofc.)

 * @author Vincent Mimoun-Prat @ MarvinLabs
 */
public class MyLinearLayout extends LinearLayout {
    private static final String TAG = "MyLinearLayout";
    private Adapter adapter;

....

private void reloadChildViews() {
    removeAllViews();

    if (adapter == null) return;

    int count = adapter.getCount();
    for (int position = 0; position < count; ++position) {
        View v = adapter.getView(position, null, this);
        if (v != null) {
            int[] attrs =new int[]{R.attr.selectableItemBackground};

            TypedArray typedArray =getContext().obtainStyledAttributes(attrs);

            int backgroundResource =typedArray.getResourceId(0, 0);

            v.setBackgroundResource(backgroundResource);

            typedArray.recycle();

            addView(v);
        }

    }

    requestLayout();
}

}

So I'm basically adding each child dynamically via addView() method. As you can see I've already attempted to place a ripple effect on each child view added programatically.

The child view that is added to this ViewGroup has the according attrs:

<layout xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    >
    <data>
    <variable
        name="contentProduct"
        type="com.example.flyhigh.data.pojos_entities.content.variations.ContentProduct" />
    <variable
        name="touchListener"
        type="android.view.View.OnTouchListener"/>
    </data>
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        tools:context="com.example.flyhigh.ui.DailyJournalFragment"
        android:clickable="true"
        android:focusable="true"
        setOnTouchListener="@{touchListener}"
        android:background="?android:attr/selectableItemBackground"
        >
        <TextView

.....
        />
</LinearLayout>
</layout>

The touchListener binded is working accordingly.

The LinearLayout:

<layout
    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"
    tools:context="com.example.flyhigh.adapters.PhaseTypePagerAdapter2"
>
<com.example.flyhigh.custom_artifacts.MyLinearLayout
    android:id="@+id/myLinearLayout"

    android:layout_width="match_parent"
    android:layout_height="wrap_content"

    app:layout_constraintTop_toTopOf="parent"

    android:orientation="vertical"
    android:background="?selectableItemBackground" //I've tried with this on and off
    android:clickable="true" //I've tried with this on and off
    android:focusable="true" //I've tried with this on and off


    android:divider="@drawable/divider"
    android:dividerPadding="10dp"
    android:showDividers="middle"

    />

</layout>

This LinearLayout is inside a ViewPager. This ViewPager is working without FragmentManager (its Adapter is a PagerAdapter). How do I know its the LinearLayout obfuscating the children and not the ViewPager obfuscating everything? because when playing around the LinearLayout attributes, the changes become visible, this includes the actual ripple effect of the LinearLayout itself (not its children) when touched outside a children (I've given some room for this to be possible).

In case you want to see the ViewPager:

        <com.example.flyhigh.custom_artifacts.MyViewPager
            android:id="@+id/main_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_constraintTop_toTopOf="parent"
            >

I'm planning to add a Drag and Drop functionality to each children but I'm afraid that this symptom will reach that functionality also.

I'm 100% sure the solution relies on overriding a Method in the MyLayout class but which one?

Answer 1

I appear to have had some concepts wrong about the order of how views overlap. It seems that the order will always be that the last nested object is the one on top of everything else (how could I've thought it otherwise...), maybe I was confused by the way the code is written (in a nested way)...

Anyways...

The problem wasn't that the parent ViewGroup was obfuscating its more inner children, BUT the other way around:

It's always the children that obfuscate its parent.

To reprise my initial question, I thought my outer layout (a custom LinearLayout) was preventing the ripple effect from its list items (a ViewGroup also).

So, the solution, without using the android:foreground= that seems to be a popular one, is the next one:

This inside the ViewGroup you want highlighted with ripple effect (my list item):

<LinearLayout
    ...
    android:clickable="true"
    android:focusable="true"
    android:background="?android:attr/selectableItemBackground"
    android:addStatesFromChildren="true" // this is the important one, but without the other attrs is useless
    >

//obfuscating children should have the according:
    <TextView
        ...
        android:clickable="true"
        android:focusable="true"
        ...
    />

    <TextView
        ...
        android:clickable="true"
        android:focusable="true"
       ...
    />

    <TextView
        ...
        android:clickable="true"
        android:focusable="true"
       ...
    />

    Etc...etc...etc...
    </LinearLayout>