[android : kotlin] 코틀린 ViewFlipper 사용방법 및 예제
ViewFlipper를 사용하는 방법에 대해 알아봅니다. ViewFlipper는 ViewAnimator 클래스의 확장 버전의 위젯 뷰입니다.
화면 전환시 애니메이션 효과를 적용하기 위해 사용합니다. ViewFlipper는 startFlipping() 및 stopFlipping() 및 showPrevious() 및 showNext() 등 4개의 메서드를 제공합니다 . ViewFlipper를 사용하여 비디오나 이미지를 탐색할 수 있습니다. 이미지를 지정한 초 단위로 자동 보여주는 기능을 구현할 때 유용합니다. 혹은 광고성 텍스트에 애니메이션 효과를 주어 텍스트를 계속 변경하는 방법으로도 사용할 수 있습니다. flipInterval 메서드는 뷰 전환 간격 시간을 지정합니다. 기본값은 3초입니다.
ViewFlipper는 화면의 꺼짐유무를 확인하는 BroadcastReceiver를 가지고 있습니다. 화면이 꺼지면 뷰 전환이 자동으로 멈춥니다. 화면이 켜지면 다시 뷰 전환이 시작됩니다.
[activity_main.xml]
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:gravity="center"
android:text="ViewFlipper 사용 예제"
android:textAppearance="@style/TextAppearance.AppCompat.Display1" />
<ViewFlipper
android:id="@+id/viewFlipper1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inAnimation="@android:anim/slide_in_left"
android:outAnimation="@android:anim/slide_out_right"
android:layout_below="@+id/textView1"
android:layout_above="@+id/bottom_layout">
</ViewFlipper>
<Switch
android:id="@+id/switch1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
android:text="자동 슬라이딩 켜기"/>
<LinearLayout
android:id="@+id/bottom_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_margin="10dp"
android:orientation="horizontal">
<Button
android:id="@+id/previous_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="이전" />
<Button
android:id="@+id/next_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="다음" />
</LinearLayout>
</RelativeLayout>
[MainActivity.kt]
package edu.kotlin.study
import android.os.Bundle
import android.view.Gravity
import android.view.ViewGroup
import android.view.animation.AnimationUtils
import android.widget.*
import androidx.appcompat.app.AppCompatActivity
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
//var position = 0
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val titleArr = arrayOf("광고 타이틀1", "광고 타이틀2", "광고 타이틀3", "광고 타이틀4")
var imageList = intArrayOf(
android.R.drawable.ic_dialog_map,
android.R.drawable.ic_dialog_email,
android.R.drawable.ic_delete,
android.R.drawable.ic_btn_speak_now
)
//var viewFlipper1: ViewFlipper = findViewById(R.id.viewFlipper1)
viewFlipper1.inAnimation = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left)
viewFlipper1.outAnimation =
AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right)
//동적으로 이미지뷰를 추가합니다.
for (image in imageList) {
//var intNum = 1
val imageView = ImageView(this)
val layoutParams = FrameLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
)
layoutParams.setMargins(30, 30, 30, 30)
layoutParams.gravity = Gravity.CENTER
imageView.layoutParams = layoutParams
imageView.setImageResource(image)
//imageView.tag = "IMG$intNum"
viewFlipper1.addView(imageView)
// intNum++
}
// 뷰플리퍼에 텍스트뷰 4개 동적으로 추가
// for (String in titleArr) {
// var tempText: TextView = TextView(this)
// tempText.gravity = Gravity.CENTER_HORIZONTAL
// tempText.text = String
// viewFlipper1.addView(tempText)
// }
previous_btn.setOnClickListener {
viewFlipper1.setInAnimation(this, android.R.anim.slide_in_left)
viewFlipper1.setOutAnimation(this, android.R.anim.slide_out_right)
viewFlipper1.showPrevious()
}
next_btn.setOnClickListener {
viewFlipper1.setInAnimation(this, android.R.anim.slide_in_left)
viewFlipper1.setOutAnimation(this, android.R.anim.slide_out_right)
viewFlipper1.showNext()
// textView1.text =
// viewFlipper1.getChildAt(0).tag as CharSequence?
}
//자동으로 이미지 전환 방법1
//viewFlipper1.isAutoStart = true
//자동으로 이미지 전환 방법2
//viewFlipper1.flipInterval = 2000 //간격 2초
//viewFlipper1.startFlipping()
// switch1.setOnCheckedChangeListener { _, isChecked ->
// if (isChecked) {
// viewFlipper1.flipInterval = 2000
// viewFlipper1.startFlipping()
// } else {
// viewFlipper1.stopFlipping()
// }
// }
}
}
[build.gradle(Module:app)]
apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'
apply plugin: 'kotlin-android-extensions'
android {
compileSdkVersion 29
defaultConfig {
applicationId "edu.kotlin.study"
minSdkVersion 22
targetSdkVersion 29
versionCode 1
versionName "1.0"
testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
implementation 'androidx.core:core-ktx:1.3.1'
implementation 'androidx.appcompat:appcompat:1.2.0'
implementation 'androidx.constraintlayout:constraintlayout:2.0.1'
implementation 'androidx.legacy:legacy-support-v4:1.0.0'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'androidx.test.ext:junit:1.1.2'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.3.0'
}
[build.gradle(Project)]
// Top-level build file where you can add configuration options common to all sub-projects/modules.
buildscript {
ext.kotlin_version = "1.3.72"
repositories {
google()
jcenter()
}
dependencies {
classpath "com.android.tools.build:gradle:4.0.1"
classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
// NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
}
}
allprojects {
repositories {
google()
jcenter()
}
}
task clean(type: Delete) {
delete rootProject.buildDir
}
[연관 자료]