I have a LinearLayout and a FrameLayout inside with some margin. The strange thing is that even though visibility is set to GONE the inner view's margin seems to have an influence on the elemtns surrounding it. This is just the case in runtime, not during design time in the IDE.
Android documentation states:
GONE - This view is invisible, and it doesn't take any space for layout purposes
- So why does margin still have an influence?
- What sense does it make (if it has any)?
- And most importantly: How do I accomplish a view completely vanishing and have no effect whatsoever on its neighbours?
Of course you can just set the margin to 0 in code but that's really inconvenient when you have to toggle visibility frequently and maintaining correct margins.
Here is the layout file:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/cardLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="@+id/cardContentStack"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<ImageView
android:id="@+id/cardImageLarge"
android:layout_width="match_parent"
android:layout_height="@dimen/card_image_big_height"
android:layout_marginBottom="@dimen/card_image_big_bottom_margin"
android:layout_marginLeft="@dimen/margin_base"
android:layout_marginRight="@dimen/margin_base"
android:visibility="gone"
tools:src="@drawable/some_image"
tools:visibility="visible" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<FrameLayout
android:id="@+id/cardImageWrapper"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/margin_base">
<ImageView
android:id="@+id/cardImage"
android:layout_width="@dimen/card_image_size"
android:layout_height="@dimen/card_image_size"
android:visibility="gone"
tools:src="@drawable/some_image2"
tools:visibility="visible" />
<ImageView
android:id="@+id/cardImageSmall"
android:layout_width="@dimen/card_image_small_size"
android:layout_height="@dimen/card_image_small_size"
android:layout_margin="@dimen/margin_base"
android:visibility="gone"
tools:src="@drawable/some_image3"
tools:visibility="visible" />
</FrameLayout>
<LinearLayout
android:id="@+id/cardBodyContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="@+id/cardTextContainer"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
android:paddingBottom="@dimen/margin_base"
android:paddingRight="@dimen/margin_base"
android:paddingTop="@dimen/card_title_top_margin">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.company.android.text.textview.BodyMedium
android:id="@+id/cardTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textColor="@color/midnight"
tools:text="Michele Theisen" />
<FrameLayout
android:id="@+id/cardTitleRightSpacer"
android:layout_width="@dimen/card_title_right_spacer"
android:layout_height="match_parent"
android:layout_weight="1"
android:visibility="gone"
tools:visibility="visible">
</FrameLayout>
</LinearLayout>
<com.company.android.text.textview.BodyLittle
android:id="@+id/cardBody"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top_margin"
android:layout_weight="1"
android:ellipsize="end"
android:maxLines="2"
android:textColor="@color/twilight"
android:visibility="gone"
tools:text="Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text"
tools:visibility="visible" />
</LinearLayout>
<LinearLayout
android:id="@+id/cardButtonContainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:orientation="horizontal"
android:paddingBottom="@dimen/margin_small"
android:paddingLeft="@dimen/margin_small"
android:paddingRight="@dimen/margin_small"
android:visibility="gone"
tools:visibility="visible">
<com.company.views.materialstextviews.CardButton
android:id="@+id/cardSecondaryButton"
android:layout_width="0dp"
android:layout_height="@dimen/card_action_button_height"
android:layout_marginRight="@dimen/margin_small"
android:layout_weight="1"
android:background="?android:attr/selectableItemBackground"
android:maxLines="1"
android:paddingLeft="@dimen/margin_xs"
android:paddingRight="@dimen/margin_xs"
android:singleLine="true"
android:textColor="@color/twilight"
android:visibility="gone"
tools:text="BUTTON TEXT MIGHT BE LONG"
tools:visibility="visible" />
<com.company.views.materialstextviews.CardButton
android:id="@+id/cardPrimaryButton"
android:layout_width="wrap_content"
android:layout_height="@dimen/card_action_button_height"
android:background="?android:attr/selectableItemBackground"
android:ellipsize="end"
android:maxLines="1"
android:paddingLeft="@dimen/margin_xs"
android:paddingRight="@dimen/margin_xs"
android:singleLine="true"
android:textColor="@color/green"
android:visibility="visible"
tools:text="BUTTON TEXT"
tools:visibility="visible" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<ImageView
android:id="@+id/cardCloseButton"
android:layout_width="@dimen/card_close_button_size"
android:layout_height="@dimen/card_close_button_size"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="@drawable/ic_card_close"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground" />
</RelativeLayout>
cardImageWrapper is the view that causes the problem.