Flutter – Palindrome Checker App

A palindrome is a word or sequence of characters that reads the same forward and backwards. In other words, it remains the same when its characters are reversed. Here are a few examples of palindromes:

GFG
LEVEL
CTC
NOON

In this article, we are going to make an app in Flutter that can check if the input String is palindrome or not if the String is palindrome then it will display “Given String is Palindrome” otherwise it will display “Given String is not Palindrome. A sample video 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 in Android Studio

To set up Flutter Development on Android Studio please refer to Android Studio Setup for Flutter Development, and then create a new project in Android Studio please refer to Creating a Simple Application in Flutter.

Step 2: Import the Package

First of all import material.dart file.

import 'package:flutter/material.dart';

Step 3: Execute the main Method

Here the execution of our app starts.

Dart

void main() {
  runApp(PalindromeCheckerApp());
}

Step 4: Create PalindromeCheckerApp Class

In this class we are going to implement the MaterialApp , here we are also set the Theme of our App.

Dart

class PalindromeCheckerApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        // Set the app's primary theme color
        primarySwatch: Colors.green,
      ),
      debugShowCheckedModeBanner: false,
      title: 'Palindrome Checker',
      home: PalindromeCheckerScreen(),
    );
  }
}

Step 5: Create PalindromeCheckerScreen Class

In this class we are going to implement the logic for checking if the String is palindrome or not. This class contains a userdefined method named as checkPalindrome() which is responsible for checking if a String is Palindrome or not. Comments are added for better understanding.

void checkPalindrome() {
    // Function to check if the input is a palindrome
    String cleanedText = inputText
        .replaceAll(RegExp(r'[^a-zA-Z0-9]'), '')
        .toLowerCase(); // Remove non-alphanumeric characters and convert to lowercase
    String reversedText =
        cleanedText.split('').reversed.join(''); // Reverse the cleaned text
    isPalindrome = cleanedText == reversedText; // Check if it's a palindrome
  }

Dart

class PalindromeCheckerScreen extends StatefulWidget {
  @override
  _PalindromeCheckerScreenState createState() =>
      _PalindromeCheckerScreenState();
}

class _PalindromeCheckerScreenState extends State<PalindromeCheckerScreen> {
  String inputText = ''; // Store the input text from the user
  bool isPalindrome = false; // Flag to track if the input is a palindrome

  void checkPalindrome() {
    // Function to check if the input is a palindrome
    String cleanedText = inputText
        .replaceAll(RegExp(r'[^a-zA-Z0-9]'), '')
        .toLowerCase(); // Remove non-alphanumeric characters and convert to lowercase
    String reversedText =
        cleanedText.split('').reversed.join(''); // Reverse the cleaned text
    isPalindrome = cleanedText == reversedText; // Check if it's a palindrome
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Palindrome Checker'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.all(16.0),
              child: TextField(
                decoration: InputDecoration(labelText: 'Enter a string'),
                onChanged: (text) {
                  setState(() {
                    inputText = text; // Update the input text as the user types
                  });
                },
              ),
            ),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  checkPalindrome(); // Call the function to check for a palindrome
                });
              },
              child: Text('Check Palindrome'),
            ),
            SizedBox(height: 20),
            Text(
              isPalindrome
                  ? "Given String is Palindrome"
                  : "Given String is not a Palindrome", // Display the result
              style: TextStyle(fontSize: 20),
            ),
          ],
        ),
      ),
    );
  }
}

Here is the full Code of main.dart file

Dart

import 'package:flutter/material.dart';

void main() {
  runApp(PalindromeCheckerApp());
}

class PalindromeCheckerApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.green, // Set the app's primary theme color
      ),
      debugShowCheckedModeBanner: false,
      title: 'Palindrome Checker',
      home: PalindromeCheckerScreen(),
    );
  }
}

class PalindromeCheckerScreen extends StatefulWidget {
  @override
  _PalindromeCheckerScreenState createState() =>
      _PalindromeCheckerScreenState();
}

class _PalindromeCheckerScreenState extends State<PalindromeCheckerScreen> {
  String inputText = ''; // Store the input text from the user
  bool isPalindrome = false; // Flag to track if the input is a palindrome

  void checkPalindrome() {
    // Function to check if the input is a palindrome
    String cleanedText = inputText
        .replaceAll(RegExp(r'[^a-zA-Z0-9]'), '')
        .toLowerCase(); // Remove non-alphanumeric characters and convert to lowercase
    String reversedText =
        cleanedText.split('').reversed.join(''); // Reverse the cleaned text
    isPalindrome = cleanedText == reversedText; // Check if it's a palindrome
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Palindrome Checker'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.all(16.0),
              child: TextField(
                decoration: InputDecoration(labelText: 'Enter a string'),
                onChanged: (text) {
                  setState(() {
                    inputText = text; // Update the input text as the user types
                  });
                },
              ),
            ),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  checkPalindrome(); // Call the function to check for a palindrome
                });
              },
              child: Text('Check Palindrome'),
            ),
            SizedBox(height: 20),
            Text(
              isPalindrome
                  ? "Given String is Palindrome"
                  : "Given String is not a Palindrome", // Display the result
              style: TextStyle(fontSize: 20),
            ),
          ],
        ),
      ),
    );
  }
}

Output: