Text Switcher is a widget in android that contains multiple text views and we can display one text at a time in it. In this article, we will take a look at How to implement a Dynamic Text Switcher in Android. A sample video is given below to get an idea about what we are going to do in this article.
Note: This Android article covered in both Java and Kotlin languages.
Step by Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio.
Step 2: Working with the activity_main.xml file
Navigate to app > res > layout > activity_main.xml and add the below code to it. Comments are added in the code to get to know in detail.
<? xml version = "1.0" encoding = "utf-8" ?>
<!--on below line we are creating our linear layout--> < LinearLayout
android:id = "@+id/idLLContainer"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:layout_centerInParent = "true"
android:layout_gravity = "center"
android:gravity = "center"
android:orientation = "vertical"
tools:context = ".MainActivity" >
</ LinearLayout >
|
Step 3: Working with the MainActivity file
Navigate to app > java > your app’s package name > MainActivity file and add the code below. Comments are added in the code to get to know in detail.
package com.gtappdevelopers.kotlingfgproject
import android.graphics.Color
import android.graphics.Typeface
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
class MainActivity : AppCompatActivity() {
// on below line creating a variable.
lateinit var containerLL: LinearLayout
val languages = arrayOf( "Java" , "C" , "Kotlin" , "C++" )
var index = 0
override fun onCreate(savedInstanceState: Bundle?) {
super .onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// on below line we are initializing our variables.
containerLL = findViewById(R.id.idLLContainer)
// on below line we are creating layout
// params for text view.
// and specifying width as match parent
// and height as wrap content
val txtLayoutParam = LinearLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
)
// on below line we are creating our dynamic text view
val headingTV = TextView( this )
// on below line we are setting for our text view.
headingTV.text = "Dynamic Text Switcher in Android"
// on below line we are updating text size.
headingTV.textSize = 20f
// on below line we are updating text color and font
headingTV.setTextColor(resources.getColor(R.color.black))
headingTV.typeface = Typeface.DEFAULT_BOLD
// on below line we are adding padding
headingTV.setPadding( 20 , 20 , 20 , 20 )
// on below line we are specifying text alignment.
headingTV.textAlignment = TextView.TEXT_ALIGNMENT_CENTER
// on below line we are adding layout
// param for heading text view.
headingTV.layoutParams = txtLayoutParam
// on below line we are creating a simple text switcher.
val textSwitcher = TextSwitcher( this )
// on below line we are setting factor for our text switcher.
textSwitcher.setFactory {
// on below line we are adding a text view in our text switcher.
val textView = TextView( this @MainActivity )
// on below line we are adding gravity for our text
textView.gravity = Gravity.TOP or Gravity.CENTER_HORIZONTAL
// on below line we are adding a text size
textView.textSize = 32f
// on below line we are adding a padding,
textView.setPadding( 100 , 100 , 100 , 100 )
// on below line we are setting color for our text
textView.setTextColor(Color.BLACK)
textView
}
// on below line we are setting text for text switcher.
textSwitcher.setText(languages[index])
// on below line we are creating a variable
// for our slide in animation
val textIn = AnimationUtils.loadAnimation(
this , android.R.anim.slide_in_left
)
// on below line we are setting
// animation to our text switcher.
textSwitcher.inAnimation = textIn
// on below line we are creating a variable
// for slide out animation
val textOut = AnimationUtils.loadAnimation(
this , android.R.anim.slide_out_right
)
// on below line we are setting out
// animation for text switcher
textSwitcher.outAnimation = textOut
// on below line we are creating a
// layout params for button
val buttonParam = LinearLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
)
// on below line we are adding margin for buttons.
buttonParam.setMargins( 10 , 10 , 10 , 10 )
// on below line we are creating a previous button
// and adding text and style to it on below line
val prevBtn = Button( this )
prevBtn.text = "Previous"
prevBtn.isAllCaps = false
// on below line setting params to it.
prevBtn.layoutParams = buttonParam
// on below line we are setting text color to it.
prevBtn.setTextColor(resources.getColor(R.color.white))
// on below line we are adding background color to it.
prevBtn.setBackgroundColor(resources.getColor(R.color.purple_200))
// on below line we are adding click listener
prevBtn.setOnClickListener {
// on below line we are updating index
index = if (index - 1 >= 0 ) index - 1 else 3
textSwitcher.setText(languages[index])
}
// on below line we are creating a next button
// and adding text and style to it on below line
val nextBtn = Button( this )
nextBtn.text = "Next"
nextBtn.isAllCaps = false
// on below line setting params to it.
nextBtn.layoutParams = buttonParam
// on below line we are setting text color to it.
nextBtn.setTextColor(resources.getColor(R.color.white))
// on below line we are adding background color to it.
nextBtn.setBackgroundColor(resources.getColor(R.color.purple_200))
// on below line we are adding click listener
nextBtn.setOnClickListener {
// on below line we are updating index
index = if (index + 1 < languages.size) index + 1 else 0
textSwitcher.setText(languages[index])
}
// on below line we are adding our views
// to container linear layout
containerLL.addView(headingTV)
containerLL.addView(textSwitcher)
containerLL.addView(prevBtn)
containerLL.addView(nextBtn)
}
} |
package com.gtappdevelopers.kotlingfgproject;
import android.graphics.Color;
import android.graphics.Typeface;
import android.os.Build;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.TextSwitcher;
import android.widget.TextView;
import android.widget.ViewSwitcher;
import androidx.annotation.RequiresApi;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
// on below line we are creating variables.
private LinearLayout containerLL;
String languages[] = { "Java" , "C" , "Kotlin" , "C++" };
int index = 0 ;
@RequiresApi (api = Build.VERSION_CODES.JELLY_BEAN_MR1)
@Override
protected void onCreate(Bundle savedInstanceState) {
super .onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// on below line we are initializing our variables.
containerLL = findViewById(R.id.idLLContainer);
// on below line we are creating layout params for text view.
// and specifying width as match parent and height as wrap content
LinearLayout.LayoutParams txtLayoutParam = new LinearLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
);
// on below line we are adding gravity
txtLayoutParam.gravity = Gravity.CENTER;
// on below line we are creating our dynamic text view
TextView headingTV = new TextView( this );
// on below line we are setting for our text view.
headingTV.setText( "Dynamic Text Switcher in Android" );
// on below line we are updating text size.
headingTV.setTextSize(20f);
// on below line we are updating text color and font
headingTV.setTextColor(getResources().getColor(R.color.black));
headingTV.setTypeface(Typeface.DEFAULT_BOLD);
// on below line we are adding padding
headingTV.setPadding( 20 , 20 , 20 , 20 );
// on below line we are specifying text alignment.
headingTV.setTextAlignment(View.TEXT_ALIGNMENT_CENTER);
// on below line we are adding layout param
// for heading text view.
headingTV.setLayoutParams(txtLayoutParam);
// on below line we are creating a simple text switcher.
TextSwitcher textSwitcher = new TextSwitcher( this );
// on below line we are setting factor for our text switcher.
textSwitcher.setFactory( new ViewSwitcher.ViewFactory() {
@Override
public View makeView() {
// on below line we are adding a text view in our text switcher.
TextView textView = new TextView(MainActivity. this );
// on below line we are adding gravity for our text
textView.setGravity(Gravity.CENTER_HORIZONTAL);
// on below line we are adding a text size
textView.setTextSize(32f);
// on below line we are adding a padding,
textView.setPadding( 100 , 100 , 100 , 100 );
// on below line we are setting color for our text
textView.setTextColor(Color.BLACK);
return textView;
}
});
// on below line we are setting text for text switcher.
textSwitcher.setText(languages[index]);
// on below line we are creating a variable
// for our slide-in animation
Animation textIn = AnimationUtils.loadAnimation(
this , android.R.anim.slide_in_left
);
// on below line we are setting animation
// to our text switcher.
textSwitcher.setInAnimation(textIn);
// on below line we are creating a variable
// for slide out animation
Animation textOut = AnimationUtils.loadAnimation(
this , android.R.anim.slide_out_right
);
// on below line we are setting out
// animation for text switcher
textSwitcher.setOutAnimation(textOut);
// on below line we are creating a layout params for button
LinearLayout.LayoutParams buttonParam = new LinearLayout.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
);
// on below line we are adding margin for buttons.
buttonParam.setMargins( 10 , 10 , 10 , 10 )
// on below line we are creating a previous button
// and adding text and style to it on below line
Button prevBtn = new Button( this );
prevBtn.setText( "Previous" );
prevBtn.setAllCaps( false );
// on below line setting params to it.
prevBtn.setLayoutParams(buttonParam);
// on below line we are setting text color to it.
prevBtn.setTextColor(getResources().getColor(R.color.white));
// on below line we are adding background color to it.
prevBtn.setBackgroundColor(getResources().getColor(R.color.purple_200));
// on below line we are adding click listener
prevBtn.setOnClickListener( new View.OnClickListener() {
@Override
public void onClick(View v) {
// on below line we are updating index
if (index - 1 >= 0 ) {
index = index - 1 ;
} else {
index = 3 ;
}
textSwitcher.setText(languages[index]);
}
});
// on below line we are creating a next button
// and adding text and style to it on below line
Button nextBtn = new Button( this );
nextBtn.setText( "Next" );
nextBtn.setAllCaps( false );
// on below line setting params to it.
nextBtn.setLayoutParams(buttonParam);
// on below line we are setting text color to it.
nextBtn.setTextColor(getResources().getColor(R.color.white));
// on below line we are adding background color to it.
nextBtn.setBackgroundColor(getResources().getColor(R.color.purple_200));
// on below line we are adding click listener
nextBtn.setOnClickListener( new View.OnClickListener() {
@Override
public void onClick(View v) {
// on below line we are updating index
if (index + 1 < languages.length) {
index = index + 1 ;
} else {
index = 0 ;
}
textSwitcher.setText(languages[index]);
}
});
// on below line we are adding our views
// to container linear layout
containerLL.addView(headingTV);
containerLL.addView(textSwitcher);
containerLL.addView(prevBtn);
containerLL.addView(nextBtn);
}
} |
Now run your project to see the output of the application.
Output: