[Android Studio] 안드로이드 스튜디오 Event 실습 02

예제 1 ) 버튼 클릭 시 이미지 사라지게 하기

 

이미지 넣는 방법

1. 넣고싶은 이미지 파일 ctrl + c

2. res->drawble 폴더 선택 후 ctrl + v

3.  drawable 이나 drawble-v24 폴더에 넣기

☆이미지 파일 삽입 시 대문자나 특수문자 한글 금지!!☆

 

4. xml 파일에서 imageView 드래그 앤 드롭 후 이러한 창이 뜨면 원하는 사진을 선택!

 

 

activity_main. xml 파일

- 기본적인 UI는 이렇다. 버튼 클릭 시 이미지가 나타났다 사라졌다 해야하기 때문에 이미지와 버튼 둘다 ID값을 부여한다

MainActivity.java 파일

 

img와 btn 선언 후 각 아이디 값을 찾아와주자

img = findViewById(R.id.img);
btn = findViewById(R.id.btn);

btn에 온클릭 이벤트를 걸어준 후, img가 현재 visible 상태인지, invisible 상태인지를 판별하여 조건문을 걸어주자

img가 visible 이라면 invisible로 바꾼 후 btn의 txt는 visible, 반대로 img가 invisible 이라면 visible로 바꾼 후 btn의 txt는 invisible로 설정 해 준다.

btn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {

        if (img.getVisibility() == view.VISIBLE) {

            img.setVisibility(view.INVISIBLE);
            btn.setText("VISIBLE");

        }  else {
            img.setVisibility(view.VISIBLE);
            btn.setText("INVISIBLE");

        }

    }

참고로 이것도 가능하다

간단히 설명하자면 btn의 txt 내용을 조건으로 비교하는 것이다.

btn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        if (btn.getText().equals("INVISIBLE")) {

            img.setVisibility(view.INVISIBLE);
            btn.setText("VISIBLE");

        } else {

            img.setVisibility(view.VISIBLE);
            btn.setText("INVISIBLE");

        }
}

 

코드 전문

public class MainActivity4 extends AppCompatActivity {

    ImageView img;
    Button btn;

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

        img = findViewById(R.id.img);
        btn = findViewById(R.id.btn);

        btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                if (img.getVisibility() == view.VISIBLE) {

                    img.setVisibility(view.INVISIBLE);
                    btn.setText("VISIBLE");

                }  else {
                    img.setVisibility(view.VISIBLE);
                    btn.setText("INVISIBLE");

                }



            }
        });



    }
}

 

예제 2) next , pre 버튼으로 이미지 바꾸기

- next 버튼 클릭 시 다음사진이, pre 버튼 클릭 시 이전 사진이 나타나게 만들어보자

우선 짱절미 사진 4장을 drawable에 넣어준다!

 

activity_main.xml

- ui는 img 하나와 button 두개로 구성 돼 있다.

각각 id값을 지정해주자

 

MainActivity.java

 

아까 drawable 에 넣은 이미지들을 관리할 수 있도록 배열을 사용하자. 

안드로이드는 파일의 id값을 정수형 상수로 갖기 때문에 int형태의 배열을 하나 만들어 주고 안에 이미지 id값을 넣어주자

ImageView img_view;
Button btn_pre, btn_next;

int[] arr = {R.drawable.one, R.drawable.two, R.drawable.three, R.drawable.four};
int i = 0;

btn_pre와 btn_next에 온클릭리스너를 설정해주자

 

위에 선언해놓은 i 를 이용해 pre버튼을 누르면 i 1을 마이너스, next 버튼을 클릭하면 1을 더해주자

위에 선언해놓은 arr에 접근하여 이미지 i번째 이미지로 변경 해 주자 

이미지가 4장이므로 i가 -1 이거나 4 일경우 오류가 나기 때문에 조건문으로 i가 -1일때는 i를 3으로, i가 4일때는 0으로 바꿔준다. 

btn_pre.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {

        i = i-1;
        if (i == -1) {
            i = 3;
        }
        img_view.setImageResource(arr[i]);
    }
});

btn_next.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {

        i = i+1;
        if (i == 4) {
            i = 0;
        }
        img_view.setImageResource(arr[i]);
    }
});

 

코드 전문

package com.example.ex_0708;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity5 extends AppCompatActivity {

    ImageView img_view;
    Button btn_pre, btn_next;

    // 연속적으로 변경되는 이미지들을 관리할 수 있도록 배열 사용용
    // 안드로이드는 파일의 id값을 정수형 상수로 가질 수 있다!
    int[] arr = {R.drawable.one, R.drawable.two, R.drawable.three, R.drawable.four};
    int i = 0;

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


        img_view = findViewById(R.id.img_view);
        btn_pre = findViewById(R.id.btn_pre);
        btn_next = findViewById(R.id.btn_next);



        btn_pre.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                i = i-1;
                if (i == -1) {
                    i = 3;
                }
                img_view.setImageResource(arr[i]);
            }
        });

        btn_next.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                i = i+1;
                if (i == 4) {
                    i = 0;
                }
                img_view.setImageResource(arr[i]);
            }
        });

    }

}