HeyThere
HeyThere

Reputation: 583

How to align view relative to multiple views in RelativeLayout?

I have a parent RelativeLayout and 3 child views. View one and View two are align parent bottom. I want my view three to be aligned above view one if view one is visible, otherwise align above view two if view one is not visible.

Here's my layout:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools">

    <View
        android:id="@+id/one"
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:layout_alignParentBottom="true"
        android:background="@color/green"
        tools:visibility="visible"/>

    <View
        android:id="@+id/two"
        android:layout_width="250dp"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        android:background="@color/red"/>

    <View
        android:id="@+id/three"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_above="@id/one"
        android:layout_marginBottom="10dp"
        android:background="@color/yellow"/>

</RelativeLayout>

I know if I put view one and view two into another layer and align view three above the other layer it will work, but as of current architecture i am not allowed to do that. Is there any other way to achieve this? Would ConstraintLayout be able to solve this issue?

Upvotes: 1

Views: 2064

Answers (3)

Hobbit
Hobbit

Reputation: 611

If you want to go with your current Layout, then you can programatically set the height of view one to zero instead of changing its visibility. In this case, view 3 remains on the top of one and because of zero height, view 3 will appear on the top of view two.

RelativeLayout relativeLayout = (RelativeLayout) findViewById(R.id.one);
relativeLayout.getLayoutParams().height = 0;

Upvotes: 0

Prasad
Prasad

Reputation: 3552

We can achieve this by doing it programmatically.

Find the below code to align the third view based on the first view visibility status.

final View view3 = findViewById(R.id.three);

RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(100, 100);
params.addRule(RelativeLayout.ABOVE, view3.getVisibility() == View.VISIBLE ? R.id.one : R.id.two);
view3.setLayoutParams(params);

Upvotes: 0

Nongthonbam Tonthoi
Nongthonbam Tonthoi

Reputation: 12953

Try this:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools">

    <View
        android:id="@+id/one"
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:layout_above="@+id/two"
        android:background="@android:color/holo_green_dark"
        tools:visibility="visible"/>

    <View
        android:id="@+id/two"
        android:layout_width="250dp"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        android:background="@android:color/holo_red_dark"/>

    <View
        android:id="@+id/three"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_above="@+id/one"
        android:layout_marginBottom="10dp"
        android:background="@android:color/holo_blue_bright"/>

</RelativeLayout>

The thing is you just add

android:layout_above="@+id/two"

to view one which will make it stay above view two and add

android:layout_above="@+id/one"

to view three which will make it stay above view one.

So if view one is visibility is gone view three will stay above view two.

You can test this by setting visibility to gone for view one.

Would ConstraintLayout be able to solve this issue?

Yes.

Upvotes: 3

Related Questions