이미지 이동하기
안녕하세요 초이 입니다.
이론만으로는 실전에 적용하기 힘든 점이있으니 문제를 풀어보는 시간을 가져 보려고합니다
오늘은 이미지뷰(ImageView)를 활용한 이미지 이동하는 문제를 풀어 보려고 합니다.
문제의 해답은 가장 하단에 적어 놓았으니 참고 하시길 바랍니다.
문제 내용
1. ImageView를 화면 위, 아래에 한개 씩 총 두개를 배치합니다.
2. 각각의 이미지는 수평 스크롤이 되도록 합니다.
3. 최초 기동 시 상단의 ImageView에만 이미지가 보이도록 합니다.
4. 가운데 버튼을 누르면 상단의 ImageView 감추고, 하단의 ImageView로 표시되도록 합니다.
5. 다시 버튼을 누르면 하단의 ImageView를 감추고, 상단의 ImageView를 표시합니다.
(layout 구성 예시 그림)
문제의 정답
[activity_main.xml] 작성 소스
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="@+id/topImageView"
android:layout_width="500dp"
android:layout_height="match_parent"
app:srcCompat="?attr/actionModeCutDrawable" />
</LinearLayout>
</HorizontalScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="button" />
</LinearLayout>
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="@+id/bottomImageView"
android:layout_width="500dp"
android:layout_height="match_parent" />
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
[MainActivity.java] 작성 소스
public class MainActivity extends AppCompatActivity {
ImageView topImage; //상단 이미지 뷰
ImageView bottomImage; //하단 이미지 뷰
Button button; //이미지를 바꿔서 표시할 버튼
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
/**
* View들의 findViewById
* */
topImage = (ImageView) findViewById(R.id.topImageView);
bottomImage = (ImageView) findViewById(R.id.bottomImageView);
button= (Button) findViewById(R.id.button);
/**
* button 클릭 리스너
* */
button.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View v) {
if(topImage.getVisibility() == View.VISIBLE){ //상단 이미지뷰의 보여주기 속성이 만약 VISIBLE이라면 실행해라
Drawable dra = topImage.getDrawable(); //상단 이미지 뷰에서 이미지 가져오기
topImage.setImageDrawable(null); //상단 이미지 뷰에 이미지 없애기
topImage.setVisibility(View.INVISIBLE); //상단 이미지 뷰 감추기
bottomImage.setVisibility(View.VISIBLE);//하단 이미지 뷰 노출하기
bottomImage.setImageDrawable(dra); //하단 이미지 뷰에 가져온 이미지 셋팅하기
}else if(bottomImage.getVisibility() == View.VISIBLE){ //하단 이미지뷰의 보여주기 속성이 만약 VISIBLE이라면 실행해라
Drawable dra = bottomImage.getDrawable();
bottomImage.setImageDrawable(null);
bottomImage.setVisibility(View.INVISIBLE);
topImage.setVisibility(View.VISIBLE);
topImage.setImageDrawable(dra);
}else{
Log.d("test","두 이미지 모두 표시되고 있지 않습니다.");
}
}
});
}
}
(안드로이드) 레이아웃 인플레이션 및 인플레이터 (layout Inflation & inflator) (2) | 2019.01.28 |
---|---|
(안드로이드 미션) TextWatcher 글자 수 실시간 표시하기 (0) | 2019.01.28 |
(안드로이드) 애플리케이션 다국어화 예제 (0) | 2019.01.28 |
(안드로이드) 문자열 리소스 (안드로이드 string.xml) (0) | 2019.01.28 |
(안드로이드) 안드로이드 리소스 (Android Resource) (0) | 2019.01.28 |