안드로이드에서 다른 뷰 위에 뷰 배치 / 겹침 (z-index)


230

선형 레이아웃에서 imageview 및 textview로 구성된 선형 레이아웃이 있습니다.

<LinearLayout android:orientation="horizontal" ... >
 <ImageView 
     android:id="@+id/thumbnail"
     android:layout_weight="0.8" 
     android:layout_width="0dip"
     android:layout_height="fill_parent">
 </ImageView>
 <TextView 
    android:id="@+id/description"
    android:layout_weight="0.2"
    android:layout_width="0dip"
    android:layout_height="wrap_content">
 </TextView>

일부 규칙이 누락되었을 수 있습니다. 레이아웃에 대한 아이디어를 제공하는 것입니다. 길이와 너비가 50dip 인 또 다른 작은 텍스트보기를 원하고 imageview 위에 배치하면 "over"라는 말은 imageview보다 z-index 이상을 의미합니다. 이미지 뷰의 중앙과 위 (중첩)에 배치하고 싶습니다.

다양한 z- 색인 (선형 레이아웃에서)을 사용하여 한 뷰를 다른 뷰 위에 배치하는 방법을 알고 싶습니다.

답변:


295

이를 위해 LinearLayout을 사용할 수 없지만을 사용할 수 있습니다 FrameLayout. (A)에 FrameLayout, Z 축 인덱스 항목은, 예를 들면, 추가 된 순서에 의해 정의된다 :

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/my_drawable"
        android:scaleType="fitCenter"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center"
        android:padding="5dp"
        android:text="My Label"
        />
</FrameLayout>

이 경우 TextView는 이미지의 맨 아래 중앙을 따라 ImageView 위에 그려집니다.


예, 문서화를 거친 후 프레임 레이아웃 자체를 사용했습니다. 감사합니다.
토요일

11
이를 위해 RelativeLayout 대신 FrameLayout을 사용하는 이점이 있습니까?
Ixx

12
FrameLayout은 그룹의 다른 뷰와 관련이 없으며 부모와 관련하여 레이어를 계층화합니다. RelativeLayout은 다른 항목을 기준으로 배치하는 데 더 적합합니다.
Kevin Coppock 2012 년

3
안녕하세요 kcoppock 내 모바일 (hdpi)은 프레임 레이아웃에서 z 순서를 존중하지 않지만 다른 (xhdpi)이 있고이 순서를 존중합니다. 왜 그런지 아십니까? 미리 감사드립니다! : D
Merlí Escarpenter Pérez

1
API 21 / KitKat부터 setZ 및 translationZ를 사용할 수 있습니다. FrameLayout 해킹은 더 이상 필요하지 않습니다 (최종!). 이 현대 5.0 개발을위한 선호 답해야한다 : stackoverflow.com/a/29703860/358578은
pbarranis

183

3
우리는 이것을 XML 파일에서도 사용할 수 있습니까?
광고

2
나는 번역 애니메이션 중에 itz zindex를 변경하기 위해 내 견해를 가져다 줄 무언가를 찾고있었습니다.
DeltaCap019

번역 애니메이션 솔루션을 찾을 수 있습니까?
nAkhmedov

9
bringChildToFront ()는 단지 부모의 내부 뷰의 인덱스 변경
자르 E Ahmer

4
이것은 전체 레이아웃 순서를
망칩니다

66

RelativeLayout은 동일한 방식으로 작동하며 상대 레이아웃의 마지막 이미지가 이깁니다.


14
고도를 사용하지 않으면 그 중에서 가장 큰 값이 필요합니다.
Sami Kuhmonen 2016 년

5
이 질문은 고도가 존재하기 전에 묻고 대답했습니다. 앱에 Lollipop보다 minSdk가 낮은 경우에는 권한 상승을 사용해도 문제가 해결되지 않습니다 (사전 막대 사탕 전화에서는 고도에 의존하는 경우 레이아웃이 잘못 표시됨)-레이아웃 순서에주의를 기울여야합니다. 그러나 하단 구성 요소에 표고를 사용하는 경우 상단에 적어도 동일하거나 더 높아야합니다.
jt-gilkeson

27

추첨 순서 변경

다른 방법은 부모가 뷰를 그리는 순서를 변경하는 것입니다. setChildrenDrawingOrderEnabled (true) 를 호출 하고 getChildDrawingOrder (int childCount, int i)를 재정 의하여 ViewGroup에서이 기능을 활성화 할 수 있습니다 .

예:

/**
 * Example Layout that changes draw order of a FrameLayout
 */
public class OrderLayout extends FrameLayout {

    private static final int[][] DRAW_ORDERS = new int[][]{
            {0, 1, 2},
            {2, 1, 0},
            {1, 2, 0}
    };

    private int currentOrder;

    public OrderLayout(Context context) {
        super(context);
        setChildrenDrawingOrderEnabled(true);
    }

    public void setDrawOrder(int order) {
        currentOrder = order;
        invalidate();
    }

    @Override
    protected int getChildDrawingOrder(int childCount, int i) {
        return DRAW_ORDERS[currentOrder][i];
    }
}

산출:

OrderLayout#setDrawOrder(int)0-1-2로 전화하면 다음 과 같은 결과가 발생합니다.

여기에 이미지 설명을 입력하십시오 여기에 이미지 설명을 입력하십시오 여기에 이미지 설명을 입력하십시오


활동의 onCreate ()에서 setDrawOrder (i)를 호출합니까? 내 XML에 6 개의 위젯이있는 경우 DRAW_ORDERS의 각 행을 6 개의 숫자 배열 (0-5)로 초기화해야합니까?
John Ward

@JohnWard 위의 레이아웃은 단지 예시 목적으로, getChildDrawingOrder ()에서 자신의 동작을 정의 할 수 있습니다.
Tobrun

매우 명확한 코드가있는 관련 게시물 : stackoverflow.com/questions/20524162/framelayout-in-reverse
Robert

20

view.setZ(float)API 레벨 21부터 사용할 수 있습니다 . 여기에서 자세한 정보를 찾을 수 있습니다.


3
이제 API 21 / KitKat / 5.0 이상에서 선호되는 답변입니다. 이전 프레임 레이아웃 해킹은 더 이상 필요하지 않습니다. 개인적으로 나는 setZ와 translationZ의 차이점을 이해하지 못하지만 후자는 속성이며 나를 위해 아름답게 일했습니다. 감사!
pbarranis

이전 API의 경우 ViewCompat # setZ ()도 사용할 수 있습니다.
Ali Yucel Akgul

@AliYucelAkgul 여기 문서를 보면 알 수 있습니다 Compatibility: API < 21: No-op . 그래서 나는 그것이 작동하지 않을 것이라고 생각한다
Vadim Kotov

@ VadimKotov, 나는 내 응용 프로그램에서 시도했으며 작동합니다.
Ali Yucel Akgul

@AliYucelAkgul 잘, 그것은 이상하다. 문서에서 실수일까요? API <21에서 작동하는지 100 % 확신합니까? 나는 등은 이전의 API에 대한 전망의 순서를 변경할 수 있다는 생각하지만, 고도와 같은 더 멋진 물건을 가지고 ...
바딤 Kotov

14

android:elevation="1dp"다른 뷰보다 원하는 뷰를 추가하여 동일한 문제를 해결 했습니다. 그러나 5.0 미만으로 표시 할 수 없으며 그림자가 약간 생겨 수락 할 수 있으면 괜찮습니다.

따라서 @kcoppock이 가장 올바른 해결책이라고 말했습니다.


7

RelativeLayout에서 이것을 시도하십시오 :

ImageView image = new ImageView(this);
image.SetZ(float z);

그것은 나를 위해 작동합니다.


2
조금 더 잘 설명해야합니다. 예를 들어이 코드를 어디에 두겠습니까?
DevB2F

글쎄, 나는 그것을 OnCreate () 메소드에 넣었다. 추가 된 각 이미지에는 이전에 추가 된 이미지보다 선호도가 높은 z 인덱스가 있습니다. z 인덱스를 통해 이전의 다음 위치를 변경할 수 있습니다.
Rizzo

5

LinearLayout을 사용하는 방법이 있습니다. 이전 요소의 marginTop을 해당 음수 값으로 설정하고 맨 위에 원하는 요소가 XML에서 아래에 원하는 요소 뒤에 있는지 확인하십시오.

<linearLayout android:orientation="horizontal" ... >
<ImageView 
 android:id="@+id/thumbnail"
 android:layout_weight="0.8" 
 android:layout_width="0dip"
 android:layout_height="fill_parent"
>
</ImageView>
<TextView 
android:id="@+id/description"
android:layout_marginTop="-20dip"
android:layout_weight="0.2"
android:layout_width="0dip"
android:layout_height="wrap_content"
>
</TextView>

4

AFAIK 선형 레이아웃으로는 할 수 없으므로 RelativeLayout해야 합니다.


RelativeLayout은 frameLayout을 확장하지 않습니다. 제대로 작동합니까?
ekatz

그렇습니다. FrameLayout 또는 RelativeLayout을 사용할 수 있습니다. 각기 다른 방식으로 자식 뷰를 배치합니다. 해당 레이아웃에 대한 자세한 내용은 문서를 참조하십시오.
Vincent Mimoun-Prat

이것은가는 길이다
Albert James Teddy

0

프로그래밍 방식으로 View를 추가하는 경우 yourLayout.addView(view, 1);

어디서 1 is the index?


0

필요할 때 하나의보기 만 정면으로 가져 오려면 이것을 사용합니다.

containerView.bringChildToFront(topView);

containerView 는 정렬 할보기의 컨테이너이며, topView 는 컨테이너에서 가장 많이보고 싶은보기입니다.

여러 뷰를 정렬하려면 위에서 언급 한 것처럼 setChildrenDrawingOrderEnabled (true)를 사용하고 getChildDrawingOrder (int childCount, int i)를 재정의하려고합니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.