안드로이드에서 다른 뷰 위에 뷰 배치 / 겹침 (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.