آموزش TextSwitcher در کوتلین

سلام دوستان در این سری از آموزش برنامه نویسی اندروید به آموزش TextSwitcher در کوتلین می پردازیم TextSwitcher یک Subclass از ViewSwitcher است و شبیه همان کار می کند و کار آن ایجاد یک اسلایدر از متن مورد استفاده قرار می گیرد در ادامه می توانید پیش نمایشی از TextSwitcher را مشاهده کنید.

به علت حجم سنگین فایل gif از لینک زیر استفاده کنید.
لینک پیش نمایش
ابتدا برخی از Attribute های مربوط به TextSwitcher که بیشتر مورد استفاده قرار می گیرد را مورد بررسی قرار می دهیم.
android:inAnimation : انیمیشن مریوط به هنگام ورود به view بعدی.
android:outAnimation :انیمیشن مربوط به هنگام خروجی از view قبلی.
android:elevation : به منظور تعیین shadow مورد استفاده قرار میگیرد.
android:id : به منظور تعیین یک آیدی منحصر به فرد مورد استفاده قرار می گیرد.

ابتدا وارد فایل strings.xml شده در مسیر res/values قرار دارد و رشته های زیر را در آن تعریف کنید.

<resources>
    <string name="app_name">TextSwitcher</string>
    <string name="next">Next</string>
</resources>

<string name="app_name">TextSwitcher</string>

</resources>

بعد از اینکار در یک layout مثلا ما در اینجا از activity_main.xml استفاده کردیم وارد آن شده و کدهای زیر را در آن قرار دهید.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="40dp"
        android:text="@string/next"/>
    <TextSwitcher
        android:id="@+id/textSwitcher"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"/>
</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical">

<Button

android:id="@+id/button"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center"

android:layout_marginTop="40dp"

android:text="@string/next"/>

<TextSwitcher

android:id="@+id/textSwitcher"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_marginTop="20dp"/>

</LinearLayout>

در بالا یک TextSwitcher و یک دکمه قرار دادیم از دکمه به منظور switch کردن بین text ها استفاده می شود.
بعد از اینکار در اکتیویتی مربوط به به همان layout که در اینجا MainActivity.kt است کدهای زیر را قرار دهید.

package ir.programchi.textswitcher
import android.graphics.Color
import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import android.view.Gravity
import android.view.animation.AnimationUtils
import android.widget.Button
import android.widget.TextSwitcher
import android.widget.TextView
class MainActivity : AppCompatActivity() {
    private val textList = arrayOf("Panda", "Tiger", "Zebra", "Lion", "Deer", "Goat", "Ape", "Monkey", "Human")
    private var index = 0
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val textSwitcher = findViewById<TextSwitcher>(R.id.textSwitcher)
        textSwitcher.setFactory {
            val textView = TextView(this@MainActivity)
            textView.gravity = Gravity.TOP or Gravity.CENTER_HORIZONTAL
            textView.textSize = 32f
            textView.setTextColor(Color.RED)
            textView
        }
        textSwitcher.setText(textList[index])
        val `in` = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left)
        textSwitcher.inAnimation = `in`
        val out = AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right)
        textSwitcher.outAnimation = out
        val button = findViewById<Button>(R.id.button)
        button.setOnClickListener {
            index = if (index + 1 < textList.size) index + 1 else 0
            textSwitcher.setText(textList[index])
        }
    }
}

package ir.programchi.textswitcher

import android.graphics.Color

import android.os.Bundle

import android.support.v7.app.AppCompatActivity

import android.view.Gravity

import android.view.animation.AnimationUtils

import android.widget.Button

import android.widget.TextSwitcher

import android.widget.TextView

class MainActivity : AppCompatActivity() {

private val textList = arrayOf("Panda", "Tiger", "Zebra", "Lion", "Deer", "Goat", "Ape", "Monkey", "Human")

private var index = 0

override fun onCreate(savedInstanceState: Bundle?) {

super.onCreate(savedInstanceState)

setContentView(R.layout.activity_main)

val textSwitcher = findViewById<TextSwitcher>(R.id.textSwitcher)

textSwitcher.setFactory {

val textView = TextView(this@MainActivity)

textView.gravity = Gravity.TOP or Gravity.CENTER_HORIZONTAL

textView.textSize = 32f

textView.setTextColor(Color.RED)

textView

}

textSwitcher.setText(textList[index])

val `in` = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left)

textSwitcher.inAnimation = `in`

val out = AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right)

textSwitcher.outAnimation = out

val button = findViewById<Button>(R.id.button)

button.setOnClickListener {

index = if (index + 1 < textList.size) index + 1 else 0

textSwitcher.setText(textList[index])

}

ابتدا یک آرایه از رشته درست کردیم و یک متغیر به نام index گرفتیم (این متغیر در هربار کلیک بروی دکمه اضافه خواهد شد و view را switch می کند تا تمامی متن ها نمایش داده شوند.) برای اینکه یک متن در textSwitcher نمایش داده شود باید یک TextView داینامیک بسازیم و از AnimationUtils نیز به منظور اضافه کردن انیمیشن برای ورود و خروج به هر عکس استفاده کردیم.

این آموزش هم به پایان رسید.
موفق و پیروز باشید.

مطالعه بیشتر