FrameLayout 프레임레이아웃

- 프레임레이아웃은 단순한 레이아웃이다.

- 하나의 뷰만을 화면에 표시한다.

프레임 레이아웃은 중첩기능을 가지고 있는데, 뷰를 하나 이상 추가 할 경우에 추가된 순서대로 쌓이는 특징을 가지고 있다.

가장 먼저 추가한 뷰가 아래쪽에 쌓이며, 가장 나중에 추가한 뷰만 보이게 되는데, 이때 뷰의 가시성 속성(visibility)을 가지고 설정을 하게 되면 추가한 여러개의 뷰를 서로 전환하면서 보여줄 수 있다.

다음은 프레임 레이아웃으로 버튼을 클릭했을 때 이미지를 순서대로 보여주는 코드이다. 이미지가 더 이상 없을 때에는 처음으로 돌아가서 마지막에 추가한 뷰 순서대로 이미지를 다시 보여준다.

-xml코드

<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.example.choonie.relativelayoutex.FrameLayoutTest">


    <Button
        android:id="@+id/imageReplaceButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="40dp"
        android:onClick="replaceImage"
        android:text="다음 이미지 보기" />


    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/imageReplaceButton"
        android:layout_marginTop="20dp">

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:src="@drawable/image1"
            android:visibility="invisible" />

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:src="@drawable/image2"
            android:visibility="invisible" />

        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:src="@drawable/images3"
            android:visibility="visible" />

    </FrameLayout>


</RelativeLayout>

visibility로 가시성 속성을 설정할 수 있으며, visible은 보여주는 값이고, invisible은 보여주지 않는 값이다.

-java코드

public class FrameLayoutTest extends AppCompatActivity {

    private List<ImageView> imageList = new ArrayList<ImageView>();
    private int imageIdx;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_frame_layout_test);

        
        //xml에서 정의한 이미지 뷰를 id를 통해서 가져와 리스트에 담는다.
        ImageView img1 = (ImageView) findViewById(R.id.imageView1);
        ImageView img2 = (ImageView) findViewById(R.id.imageView2);
        ImageView img3 = (ImageView) findViewById(R.id.imageView3);

        imageList.add(img1);
        imageList.add(img2);
        imageList.add(img3);
        
        //설명한 것 처럼 맨 나중에 위치한 이미지를 먼저 보여주기 때문에 리스트에서 마지막에 위치한 인덱스를 기준으로 잡는다.
        imageIdx = imageList.size() - 1;

    }


    public void replaceImage(View view) {
        
        //imageIdx의 값은 현재 리스트의 위치를 저장한다. 자리가 0이라면 더이상 진행할 수 없기 때문에 다시 돌아간다. 
        if(imageIdx <= 0){
            imageList.get(0).setVisibility(View.INVISIBLE);
            imageIdx = imageList.size() -1;
            imageList.get(imageIdx).setVisibility(View.VISIBLE);

            return;
        }
        
        //ImageView의 setVisibility메서드를 이용해서 해당 이미지뷰를 보여줄지 말지 설정한다.
        imageList.get(imageIdx).setVisibility(View.INVISIBLE);
        imageList.get(imageIdx-1).setVisibility(View.VISIBLE);

        imageIdx = imageIdx-1;
    }


}

findById메서드를 가지고 xml에서 정의한 뷰를 가져올 수 있다.

-결과화면

다음 이미지 버튼을 누르면 이미지가 계속 바뀐다.

안드로이드에서는 프레임레이아웃을 통한 화면전환 대신 더 편하게 사용 가능하도록 

뷰플리퍼, 뷰페이저 같은 클래스를 제공하고 있다.