How to Create Marquee Text in Android? - Coding

In this article, we are going to create Marquee Text in Android Studio. Marquee is a scrolling piece of text that is displayed either horizontally or vertically. It is used to show some important notices or headlines. It makes the app UI much more attractive.

Note that we are going to use Java as the programming language.

Step-by-Step Implementation

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that you have to select Java as the programming language.

Step 2: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. TextView is used here to add the text which we want to display on the screen. Here we have used android:ellipsize=”marquee” to add a marquee to our text and android:singleLine=”true” so that our text will show only in one line. Also, we have used android:marqueeRepeatLimit=”marquee_forever” so that marquee will repeat infinitely and one more attribute that I have used here is android:scrollHorizontally=”true” so that text will scroll horizontally.

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    
    <!--
    Textview is used here to add the text which we want to display on the screen.Here important attributes are:
    i)   android:singleLine="true"... so that our text will show only in one line
    ii)  android:ellipsize="marquee"... to add marquee to our text
    iii) android:marqueeRepeatLimit="marquee_forever"...so that marquee will repeat infinitely
    iv)  android:scrollHorizontally="true"... so that text will scroll horizontally
    -->
    <TextView
        android:id="@+id/marqueeText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="25sp"
        android:ellipsize="marquee"
        android:marqueeRepeatLimit="marquee_forever"
        android:padding="10dp"
        android:scrollHorizontally="true"
        android:singleLine="true"
        android:text="Hello guys !! Welcome to GeeksforGeeks Portal !!"
        android:textSize="20sp"
        android:textStyle="bold" />
    
</RelativeLayout>

Step 3: Working with the MainActivity.java file

Go to MainActivity.java Class. We have called the setSelected() method and passing the boolean value as true so that our marquee will get started. Below is the code for the MainActivity.java file.

Java

import android.os.Bundle;
import android.widget.TextView;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {
    
    TextView txtMarquee;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // casting of textview
        txtMarquee = (TextView) findViewById(R.id.marqueeText);
        
        // Now we will call setSelected() method
        // and pass boolean value as true
        txtMarquee.setSelected(true);
    }
}

Step 4: Working with colors.xml file

Navigate to the app > res > values > colors.xml. You can add as many colors as you need for your app. You have to just give a color code and put the color name. In this app, we have kept the app bar color as green with the color-code “#0F9D58”.

XML

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="Green">#0F9D58</color>
    <color name="purple_500">#FF6200EE</color>
    <color name="purple_700">#FF3700B3</color>
    <color name="teal_200">#FF03DAC5</color>
    <color name="teal_700">#FF018786</color>
    <color name="black">#FF000000</color>
    <color name="white">#FFFFFFFF</color>
</resources>

Step 5: Working with themes.xml

Navigate to the app > res > values > themes.xml and choose the theme of your choice. We have used parent=”Theme.MaterialComponents.DayNight.DarkActionBar” that is DayNight theme with dark ActionBar. You can add parent=”Theme.AppCompat.Light.DarkActionBar” to get light theme with dark action bar and parent=”Theme.AppCompat.Light.DarkActionBar” for light theme with dark action bar.

XML

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.MarqueeText"
        parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/Green</item>
        <item name="colorPrimaryVariant">@color/Green</item>
        <item name="colorOnPrimary">@color/white</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
    </style>
</resources>

Step 6: Working with strings.xml

Navigate to the app > res > values > strings.xml. Here you can add an app bar title. We have set “GFG | MarqueeText” as a title.

XML

<resources>
    <string name="app_name">GFG | MarqueeText</string>
</resources>

Output:

Reffered: https://www.geeksforgeeks.org

Android

Related
Add OnTouchListener to ImageView to Perform Speech to Text in Android
Android Animation using Android Studio
How to Add a Library Project to Android Studio?
What is Application Hardening ?
Different Ways to Fix "Configuration with name 'default' not found" in Android Studio

Type:	Geek
Category:	Coding
Sub Category:	Tutorial
Uploaded by:	Admin
Views:	11