Android Grey Out LinearLayout

Question

I have a linear layout which contains a set of child views (mixture of text, images and other layouts).

I want to grey out the linear layout and all the child views so they look disabled (similar to how a button works).

Is this possible to achieve? I know i can set a colour filter when painting on the canvas, is there something similar for layouts?

no, because all the text/child views are layered on top of the background colour. So they won't look disabled. — Michael Edwards, Apr 18 '19 at 10:36

score 0 · Answer 1 · answered Apr 18 '19 at 09:02

0

Another way is to call setEnabled() on each child (for example if you want to do some extra check on child before disabling), check out this answer: https://stackoverflow.com/a/7069377/4840812

answered Apr 18 '19 at 09:02

TooTall

1
3

1

I tried this but some of the child views don't automatically "grey" themselves. – Michael Edwards Apr 18 '19 at 10:36
@MichaelEdwards try improved solution https://stackoverflow.com/a/49364466/4840812 – TooTall Apr 18 '19 at 13:23

Arjun Vyas · Answer 2 · 2019-04-18T11:15:54.690

You can use Frame-layout

Using TEST ONE you can achieve above text view like disabled. You can set root layout clickable false for actually disable views inside layout. TEST TWO is for understanding purpose. Like you need to manage order of view to show effect.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent">
<!--THIS IS TEST ONE-->
<TextView
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_marginTop="150dp"
    android:background="#000000"
    android:gravity="center"
    android:text="TEST DATA"
    android:textColor="@android:color/white"
    android:textSize="30sp" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:background="#DAD6D6D6"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Data"
        android:textColor="@color/colorAccent"
        android:textSize="30sp" />

</LinearLayout>

<!--THIS IS TEST TWO-->
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_marginTop="300dp"
    android:background="#DAD6D6D6"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Data"
        android:textColor="@color/colorAccent"
        android:textSize="30sp" />

</LinearLayout>

<TextView
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_marginTop="400dp"
    android:background="#000000"
    android:gravity="center"
    android:text="TEST DATA"
    android:textColor="@android:color/white"
    android:textSize="30dp" />
</FrameLayout>

score 0 · Answer 3 · answered Apr 27 '19 at 09:33

To achieve your layout you can use the RelativeLayout. In RelativeLayout you can use the 2 different views or LinearLayout. In first layout you can add views according to your need, and In second layout you can set the alpha colorcode for disable the layout.

Please try below code:

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center">
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/demo_img_1" />
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/demo_img_1"
                android:layout_marginLeft="20dp"/>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/trans"/>

    </RelativeLayout>

Here is output for code:

Android Grey Out LinearLayout

3 Answers3