RelativeLayout margin 안먹히는 경우

Posted by ITPangPang
2016.12.11 20:15 안드로이드(android)/레이아웃(Layout)


RelativeLayout margin

안먹히는 경우



ㆍ 이번에는 간단하게 RelativeLayout을 사용할때

    margin이 안먹히는 경우에 대해 알아보겠습니다.


ㆍ 해결방법은 가장 아랫부분에 있으니 윗부분은

    넘겨도 됩니다.





Relativelayout에서 Margin이 안먹힌다?



무조건 안먹히는건 아닙니다.

그냥 기본형태에서는 똑같이 넣어주면 됩니다.


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.tistory.itpangpang.marginex.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="40dp"
android:text="Hello World!"
android:layout_marginLeft="20dp"
/>
</RelativeLayout>


이렇게 하면 아래와 같이

문제없이 margin이 적용됩니다.




다른 뷰의 위치를 이용해서

배치할때도 잘 먹힙니다.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.tistory.itpangpang.margin.MainActivity">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="40dp"
android:text="Hello World!"
/>
<TextView
android:layout_below="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="40dp"
android:text="Hello World!"
android:layout_marginLeft="20dp"
/>
</RelativeLayout>


첫번째 TextView아래에

두번째 TextView를 배치하고

margin값을 줘도 아래와 같이

잘 적용됩니다.



그럼 언제 안먹히나?


안먹히는 경우는

View를 Layout전체를

기준으로 정렬했을때 입니다.


이런 경우가 됩니다.

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

<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="40dp"
android:text="Hello World!"
android:layout_centerInParent="true"
android:layout_marginLeft="20dp"
android:layout_marginTop=
"100dp"
/>
</RelativeLayout>


layout_centerInParent = "true"


이렇게 전체 Layout의 중앙에 위치 시킨후에

marginLeft, marginTop을 적용 시켜보면


Margin이 절대 적용 안되는 것을

확인 할 수 있습니다.



이번에는

layout_centerHorizontal = "true"를

넣어보겠습니다.

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

<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="40dp"
android:text="Hello World!"
android:layout_centerHorizontal="true"
android:layout_marginLeft="20dp"
android:layout_marginTop=
"100dp"
/>
</RelativeLayout>


과연 어떻게 나올까요??


뭔가 다르죠?

layout_centerHorizontal은

width 기준으로 center가 적용됩니다.

그러므로 마진이 전혀 적용안된 상황이라면


이런 화면이 나와야 됩니다.


그런데 left와 top에 margin을 적용시켜보니

아래와 같이 marginTop만 적용된 것을 알 수 있습니다.


그렇습니다!

layout_centerHorizontal은

width의 좌우정렬을(left,right) 무시하고

무조건 센터에 배치시키기 때문에

marginLeft와 marginRight는 전혀 먹히지 앟습니다.


그리고 centerHorizontal은

vertical(height)에는 관여를 안하므로

marginTop은 먹히게 되는 것입니다.


이런 원리로,

위에서 보았던 layout_centerInParent는

horizontal, vertical 전부를 기준으로 중앙정렬이기때문에

어떠한 margin도 먹히기 않게 되는 것입니다.


그럼 Margin값을 주고 싶다면? 


결국 중요한건 이 부분이었는데

윗 부분 내용이 길었네요.


해결방법은 간단합니다.

margin을 넣고 싶은 View위에

Margin이 통하는 layout으로 감싸버리면 됩니다.


가장 먼저 떠오르는건

LinearLayout이죠


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.tistory.itpangpang.margin.MainActivity">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:layout_marginLeft="20dp"
android:layout_marginTop=
"100dp"
android:textSize="40dp" />
</LinearLayout>
</RelativeLayout>


이렇게 써놓게 되면

LinearLayout은 부모인 RelativeLayout의

영향을 받게 됩니다.

그러므로 LinearLayout에 layout_centerInParent를

적어 주면 되고,


그리고 우리가 margin을 적용시키고 싶은 TextView는

LinearLayout의 자식이므로 TextView에 margin을

적어주게 되면 아주 잘 먹히게 됩니다.

LinearLayout(부모)의 레이아웃 기준으로 마진을 적용시키게

됩니다.



LinearLayout으로만 가능한게 아니라

margin이 통하는 레이아웃에서는 전부 가능합니다.


FrameLayout도 가능하고

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.tistory.itpangpang.margin.MainActivity">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:layout_marginLeft="20dp"
android:layout_marginTop="100dp"
android:textSize="40dp" />
</FrameLayout>
</RelativeLayout>


ScrollView도 가능하겠죠

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.tistory.itpangpang.margin.MainActivity">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:layout_marginLeft="20dp"
android:layout_marginTop="100dp"
android:textSize="40dp" />
</ScrollView>
</RelativeLayout>


상황에 맞는

부모의 View를 바꿔서

margin을 적용시켜주면 됩니다.

저작자 표시 비영리 변경 금지
신고
이 댓글을 비밀 댓글로