Как реализовать TextSwitcher в Android?

Опубликовано: 10 Января, 2023

В Android TextSwitcher может быть очень полезен для демонстрации текстов в анимированной манере. TextSwitcher можно рассматривать как специальную версию ViewSwitcher. Его дочерние элементы имеют только тип TextView. TextSwitcher помогает нам добавлять переходы на метки. Следовательно, это элемент виджета перехода. Всякий раз, когда вызывается метод setText(CharSequence) , TextSwitcher быстро анимирует вывод текущего текста и ввод нового текста. Эту операцию можно выполнить с помощью как одной, так и нескольких кнопок. Для одной кнопки нам нужно циклически посещать массив. В этой статье мы реализуем TextSwitcher, используя его.

Что мы собираемся построить в этой статье?

Мы создадим простое приложение, в котором будем реализовывать TextSwitcher. После нажатия на кнопку «Далее» мы заметим, что текст начинает меняться последовательно.

TextSwitcher is available in Android from version Android 1.6+.

Пошаговая реализация

Шаг 1. Создайте новый проект в Android Studio.

Чтобы создать новый проект в Android Studio, обратитесь к разделу «Как создать/запустить новый проект в Android Studio». Код для этого был предоставлен как на Java, так и на языке программирования Kotlin для Android.

Шаг 2: Работа с файлами XML

Перейдите к приложению > res > layout > activity_main.xml и добавьте приведенный ниже код в этот файл. Ниже приведен код файла activity_main.xml .

XML




<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
  
    <TextSwitcher
        android:id="@+id/textSwitcher"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="80dp"
        android:inAnimation="@anim/slide_in_right"
        android:outAnimation="@anim/slide_out_left"/>
  
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Next"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"/>
</RelativeLayout>

Перейдите к app> res и создайте новый каталог ресурсов Android и добавьте в него следующие файлы анимации. Обратитесь к разделу Как добавить анимацию слайдов между действиями в Android?

XML




<?xml version="1.0" encoding="utf-8"?>
    <!-- slide_in_right animation file -->
    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromXDelta="100%p"
        android:toXDelta="0" />
</set>

XML




<?xml version="1.0" encoding="utf-8"?>
      <!-- slide_out_left animation file -->
    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />
</set>

Шаг 3: Работа с файлом MainActivity

Перейдите в файл MainActivity и обратитесь к следующему коду. Ниже приведен код файла MainActivity. Комментарии добавляются внутри кода, чтобы понять код более подробно.

Java




import android.graphics.Color;
import android.os.Bundle;
import android.view.Gravity;
import android.widget.Button;
import android.widget.TextSwitcher;
import android.widget.TextView;
import androidx.appcompat.app.AppCompatActivity;
  
public class MainActivity extends AppCompatActivity {
  
    // Declaration of variables
    private TextSwitcher textSwitcher;
    private Button nextButton;
    private int stringIndex = 0;
  
    // Initialization of string array to store the text
    // which is to be displayed on layout
    private String[] row = {"Hi!", "Welcome", "to", "Geeks", "for", "Geeks"};
    private TextView textView;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        textSwitcher = findViewById(R.id.textSwitcher);
        nextButton = findViewById(R.id.button);
  
        // Setting a click listener on the NEXT button
        nextButton.setOnClickListener(v -> {
            // Adding condition to revisit the array
            if (stringIndex == row.length - 1) {
                stringIndex = 0;
                textSwitcher.setText(row[stringIndex]);
            } else {
                // otherwise display next string in array
                textSwitcher.setText(row[++stringIndex]);
            }
        });
  
        // Creating textView for the textSwitcher
        textSwitcher.setFactory(() -> {
            textView = new TextView(MainActivity.this);
  
            // Defining attributes for the text to be displayed
            textView.setTextSize(60);
            textView.setGravity(Gravity.CENTER_HORIZONTAL);
  
            // #0F9D58 is GFG"s applied theme colour
            textView.setTextColor(Color.parseColor("#0F9D58"));
            return textView;
        });
        textSwitcher.setText(row[stringIndex]);
    }
}

Kotlin




import android.graphics.Color
import android.os.Bundle
import android.view.Gravity
import android.widget.Button
import android.widget.TextSwitcher
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity
  
class MainActivity : AppCompatActivity() {
  
    // Declaration of variables
    private lateinit var textSwitcher: TextSwitcher
    private lateinit var nextButton: Button
    private var stringIndex = 0
  
    // Initialization of string array to store the text
    // which is to be displayed on layout
    private val row = arrayOf("Hi!", "Welcome", "to", "Geeks", "for", "Geeks")
    private lateinit var textView: TextView
  
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
  
        textSwitcher = findViewById(R.id.textSwitcher)
        nextButton = findViewById(R.id.button)
  
        // Setting a click listener on the NEXT button
        nextButton.setOnClickListener {
            // Adding condition to revisit the array
            if (stringIndex == row.size - 1) {
                stringIndex = 0
                textSwitcher.setText(row[stringIndex])
            } else {
                // otherwise display next string in array
                textSwitcher.setText(row[++stringIndex])
            }
        }
  
        // Creating textView for the textSwitcher
        textSwitcher.setFactory {
            textView = TextView(this)
  
            // Defining attributes for the text to be displayed
            textView.textSize = 60f
            textView.gravity = Gravity.CENTER_HORIZONTAL
  
            // #0F9D58 is GFG"s applied theme colour
            textView.setTextColor(Color.parseColor("#0F9D58"))
            textView
        }
        textSwitcher.setText(row[stringIndex])
    }
}

Выход: