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 notice or headlines. It makes app UI much attractive. Note that we are going to use Java as the programming language. A sample GIF is given below to get an idea about what we are going to do in this article.
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 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 Lazyroar 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
<!-- 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:
