Building a Flutter Employee Salary Calculator App

Posted on Mar 8, 2026 in Computer Engineering

Flutter Employee Salary Management System

This example demonstrates how to create a simple Flutter application to manage employee data and calculate gross salary based on specific criteria.

1. Core Data Model

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: EmployeeEntryScreen());
  }
}

class Employee {
  String name, id, designation;
  double basicSalary;
  Employee(this.name, this.id, this.designation, this.basicSalary);
}

List<Employee> employeeList = [];

2. Employee Entry Screen

The EmployeeEntryScreen allows users to input employee details and save them to a global list.

class EmployeeEntryScreen extends StatefulWidget {
  @override
  State<EmployeeEntryScreen> createState() => _EmployeeEntryScreenState();
}

class _EmployeeEntryScreenState extends State<EmployeeEntryScreen> {
  TextEditingController name = TextEditingController();
  TextEditingController id = TextEditingController();
  TextEditingController desig = TextEditingController();
  TextEditingController salary = TextEditingController();
  String message = "";

  void saveEmployee() {
    if (name.text.isEmpty || id.text.isEmpty || desig.text.isEmpty || salary.text.isEmpty) {
      setState(() { message = "All fields are required"; });
      return;
    }
    employeeList.add(Employee(name.text, id.text, desig.text, double.parse(salary.text)));
    name.clear(); id.clear(); desig.clear(); salary.clear();
    setState(() { message = "Employee Saved Successfully"; });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Employee Entry")),
      body: Padding(
        padding: EdgeInsets.all(16.0),
        child: Column(
          children: [
            TextField(controller: name, decoration: InputDecoration(labelText: "Employee Name")),
            TextField(controller: id, decoration: InputDecoration(labelText: "Employee ID")),
            TextField(controller: desig, decoration: InputDecoration(labelText: "Designation")),
            TextField(controller: salary, keyboardType: TextInputType.number, decoration: InputDecoration(labelText: "Basic Salary")),
            SizedBox(height: 20),
            ElevatedButton(onPressed: saveEmployee, child: Text("Save Employee")),
            ElevatedButton(onPressed: () {
              Navigator.push(context, MaterialPageRoute(builder: (context) => SalaryCalculationScreen()));
            }, child: Text("Go To Salary Calculation")),
            SizedBox(height: 20),
            Text(message, style: TextStyle(color: Colors.red)),
          ],
        ),
      ),
    );
  }
}

3. Salary Calculation Logic

The SalaryCalculationScreen retrieves employee data by ID and calculates HRA, TA, and Gross Salary.

class SalaryCalculationScreen extends StatefulWidget {
  @override
  State<SalaryCalculationScreen> createState() => _SalaryCalculationScreenState();
}

class _SalaryCalculationScreenState extends State<SalaryCalculationScreen> {
  TextEditingController searchId = TextEditingController();
  String result = "";

  void calculateSalary() {
    if (searchId.text.isEmpty) {
      setState(() { result = "Please enter Employee ID"; });
      return;
    }
    Employee? emp;
    for (var e in employeeList) { if (e.id == searchId.text) { emp = e; break; } }
    if (emp == null) { setState(() { result = "Employee Not Found"; }); return; }

    double basic = emp.basicSalary;
    double hra = 0, ta = 0;

    if (basic > 15000) { hra = basic * 0.12; ta = basic * 0.14; }
    else if (basic >= 8000) { hra = basic * 0.10; ta = basic * 0.08; }
    else { hra = basic * 0.07; ta = basic * 0.07; }

    double gross = basic + hra + ta;
    setState(() { result = "Name: ${emp!.name}\nBasic: $basic\nHRA: $hra\nTA: $ta\nGross Salary: $gross"; });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Salary Calculation")),
      body: Padding(
        padding: EdgeInsets.all(16.0),
        child: Column(
          children: [
            TextField(controller: searchId, decoration: InputDecoration(labelText: "Enter Employee ID")),
            SizedBox(height: 20),
            ElevatedButton(onPressed: calculateSalary, child: Text("Calculate Salary")),
            SizedBox(height: 20),
            Text(result, style: TextStyle(fontSize: 16)),
          ],
        ),
      ),
    );
  }
}