BMI Calculator App Development
BMI Calculator App Development
ACADEMIC YEAR-2023-24
COMPUTER
ENGINEERING
1|Page
TOPIC : Develop a Mobile application for simple needs (BMI App)
SUBMITTED BY :-
SUBMITTED TO –
Prof. Gauri Rao
2|Page
ACKNOWLEDGEMENT
At the outset of this project-based learning we want to extend our whole hearted gratitude to
all the faculty members without the help of whom this project couldn’t have been possible.
We want to extend our heartily regard to Prof.Gauri Rao, under the guidance of whom we
have completed this report and which also helped us in doing a lot of research and also we
have learned many new things .We would also like to thank other faculty members for their
whole hearted cooperation and valuable guidance. We would also like to thank our friends for
their valuable suggestions and guidance to make this report a successful one.
Teacher’s Signature:
3|Page
CONTENTS
1. Introduction 5
2. Background Research 7
3. Project Planning 9
4. Design Phase 11
5. Development Phase 12
6. Features 14
7. Code 16
8. Conclusion 26
4|Page
INTRODUCTION
The introduction sets the stage for the development of a BMI Calculator mobile application
using Flutter, outlining the project's objectives, framework choice, and the importance of
BMI in health monitoring.
The project aims to create a user-friendly mobile application that enables individuals to
easily calculate their Body Mass Index (BMI) - a widely used metric for assessing body
weight relative to height. By providing users with a tool to quickly determine their BMI, the
app contributes to promoting awareness of personal health and encouraging proactive health
management.
Flutter, chosen as the framework for mobile application development, offers several
advantages such as cross-platform compatibility, fast development cycles, and expressive UI
design capabilities. Its hot reload feature facilitates rapid iteration and experimentation,
allowing developers to efficiently create and refine the BMI calculator app across multiple
platforms.
BMI serves as a crucial indicator of overall health status, helping individuals and healthcare
professionals assess potential risks associated with weight-related conditions such as obesity
and underweight. Understanding one's BMI can guide lifestyle choices, such as diet and
exercise, and prompt early intervention if necessary. By integrating BMI calculation
functionality into a mobile app, users gain convenient access to this vital health assessment
tool, empowering them to make informed decisions about their well-being.
In summary, the project introduces the development of a BMI Calculator mobile application
using Flutter, emphasizing its objectives to provide users with a simple yet effective tool for
BMI calculation. Flutter's versatility as a development framework and BMI's significance in
health monitoring underscore the importance and relevance of this project in promoting
personal health awareness and well-being. The introduction sets the stage for the
development of a BMI Calculator mobile application using Flutter, outlining the project's
objectives, framework choice, and the importance of BMI in health monitoring.
The project aims to create a user-friendly mobile application that enables individuals to
easily calculate their Body Mass Index (BMI) - a widely used metric for assessing body
weight relative to height. By providing users with a tool to quickly determine their BMI, the
app contributes to promoting awareness of personal health and encouraging proactive health
management.
Flutter, chosen as the framework for mobile application development, offers several
advantages such as cross-platform compatibility, fast development cycles, and expressive UI
design capabilities. Its hot reload feature facilitates rapid iteration and experimentation,
5|Page
allowing developers to efficiently create and refine the BMI calculator app across multiple
platforms.
BMI serves as a crucial indicator of overall health status, helping individuals and healthcare
professionals assess potential risks associated with weight-related conditions such as obesity
and underweight. Understanding one's BMI can guide lifestyle choices, such as diet and
exercise, and prompt early intervention if necessary. By integrating BMI calculation
functionality into a mobile app, users gain convenient access to this vital health assessment
tool, empowering them to make informed decisions about their well-being.
In summary, the project introduces the development of a BMI Calculator mobile application
using Flutter, emphasizing its objectives to provide users with a simple yet effective tool for
BMI calculation. Flutter's versatility as a development framework and BMI's significance in
health monitoring underscore the importance and relevance of this project in promoting
personal health awareness and well-being.
6|Page
Background Research
Background research plays a pivotal role in the development of a BMI (Body Mass Index) calculator
mobile application using Flutter. This section involves a comprehensive review of existing BMI
calculator applications, an analysis of user requirements and expectations, and an examination of
Flutter's capabilities for mobile app development.
Firstly, conducting a literature review on existing BMI calculator applications provides valuable
insights into the features, functionalities, and user experiences offered by similar apps. This review
involves studying various BMI calculator apps available on different platforms such as iOS, Android,
and web-based applications. By examining the strengths and weaknesses of these existing solutions,
developers gain a deeper understanding of industry standards, best practices, and potential areas for
improvement.
1. User Interface (UI) and User Experience (UX): Evaluating the design, layout, and usability of BMI
calculator apps to identify intuitive and user-friendly features that enhance the overall user experience.
2. Functionality and Accuracy: Assessing the accuracy of BMI calculations and the availability of
additional features such as tracking historical data, providing health recommendations, or integrating
with wearable devices for enhanced functionality.
3. Platform Compatibility: Analyzing the compatibility of BMI calculator apps across different
devices, operating systems, and screen sizes to ensure seamless user access and interaction.
4. Customer Reviews and Feedback: Examining user reviews, ratings, and feedback on app stores and
online forums to understand user preferences, pain points, and areas requiring improvement.
Secondly, analyzing user requirements and expectations from a BMI calculator app involves gathering
insights from potential users to tailor the app's features and functionalities to meet their needs
effectively. This process may include conducting surveys, interviews, or focus group discussions to
understand user demographics, preferences, and usage scenarios. Key considerations during this
analysis phase include:
1. Ease of Use: Identifying user-friendly features and intuitive workflows that simplify the BMI
calculation process and enhance overall usability.
2. Customization Options: Understanding user preferences for customizable settings such as unit
conversions (metric vs. imperial), personalized health goals, or integration with fitness and nutrition
apps.
3. Privacy and Security: Addressing concerns related to data privacy and security by implementing
robust data encryption, secure authentication mechanisms, and transparent data handling practices.
4. Accessibility: Ensuring that the app is accessible to users with disabilities by adhering to
accessibility guidelines and providing options for adjustable font sizes, screen readers, and other
assistive technologies.
Finally, examining Flutter's capabilities for mobile app development involves assessing its suitability
for building a BMI calculator app that meets user requirements while delivering a seamless cross-
platform experience.
7|Page
Flutter, a popular open-source UI software development kit (SDK) developed by Google, offers
several advantages for mobile app development, including:
1. Cross-Platform Compatibility: Flutter enables developers to write code once and deploy it across
multiple platforms, including iOS, Android, web, and desktop, thereby reducing development time
and effort.
2. Fast Development Cycles: Flutter's hot reload feature allows developers to instantly preview
changes in real-time, facilitating rapid iteration, experimentation, and bug fixing during the
development process.
3. Expressive UI Design: Flutter provides a rich set of customizable widgets, animations, and design
tools that empower developers to create visually stunning and responsive user interfaces tailored to the
app's requirements.
4. Performance and Stability: Flutter's native compilation and GPU-accelerated rendering engine
contribute to high-performance, smooth animations, and consistent user experiences across different
devices and screen sizes.
In summary, background research plays a crucial role in informing the development of a BMI
calculator mobile application using Flutter. By conducting a literature review on existing BMI
calculator applications, analyzing user requirements and expectations, and examining Flutter's
capabilities, developers can gain valuable insights to design and implement a feature-rich, user-
friendly, and cross-platform BMI calculator app that meets the needs of its target audience effectively.
8|Page
Project Planning
Project Planning is a critical phase in the development of a BMI calculator mobile application using
Flutter. This phase involves defining the project scope and objectives, identifying key features and
functionalities, and creating a project timeline with milestones to ensure timely completion and
successful delivery of the app.
- Purpose: The primary objective of the BMI calculator app is to provide users with a
convenient tool to calculate their Body Mass Index (BMI) quickly and accurately,
promoting health awareness and encouraging proactive health management.
- Target Audience: The app targets individuals of all ages interested in monitoring their
weight and assessing their overall health status. It may also cater to healthcare
professionals seeking a reliable BMI calculation tool for patient assessments.
- Platforms: The app will be developed for both iOS and Android platforms to maximize
reach and accessibility for users across different devices.
- Features and Functionality: The scope includes essential features such as input fields
for height and weight, BMI calculation algorithm, result interpretation, and optional
features like user registration, history tracking, and settings customization.
- Legal and Regulatory Compliance: The app will comply with relevant privacy
regulations (e.g., GDPR, HIPAA) and adhere to industry standards for data security and
user privacy.
- Input Fields: User-friendly interfaces for entering height and weight data.
- BMI Calculation: Accurate calculation of BMI based on user input using validated
formulas such as the Quetelet Index formula.
- Result Interpretation: Clear interpretation of BMI results with categorization into
underweight, normal weight, overweight, and obese, along with health
recommendations.
- Unit Conversion: Option to switch between metric (e.g., kilograms, meters) and
imperial (e.g., pounds, inches) units based on user preference.
- History Tracking: Capability to store and display a history of previous BMI
calculations for tracking progress over time (optional).
- Settings Customization: Personalization options such as language preferences, theme
selection, and notification settings (optional).
- User Registration and Authentication: Secure user registration and login functionality
for accessing personalized features and data (optional).
9|Page
Creation of Project Timeline and Milestones:
Developing a project timeline with well-defined milestones helps track progress, allocate resources
efficiently, and ensure timely completion of the BMI calculator app. The timeline includes:
By defining the project scope and objectives, identifying key features and functionalities, and creating
a project timeline with milestones, the development team can effectively plan and execute the BMI
calculator app development process, ensuring a successful outcome that meets user expectations and
project requirements.
10 | P a g e
Design Phase
During the design phase, careful attention is given to crafting an intuitive and visually appealing user
interface (UI) for the BMI calculator app. Sketches and wireframes are created to outline the layout
and structure of each app screen, providing a blueprint for development. These sketches help visualize
the user flow and arrangement of elements such as input fields, buttons, and result displays.
In addition to layout design, the selection of color schemes, fonts, and visual elements is crucial for
creating a cohesive and engaging UI. Colors are chosen to convey meaning and evoke emotions, while
fonts are selected for readability and brand consistency. Visual elements such as icons and illustrations
are used to enhance user experience and communicate information effectively.
The design phase aims to strike a balance between functionality and aesthetics, ensuring that the BMI
calculator app is both user-friendly and visually appealing. By creating sketches, wireframes, and
selecting appropriate design elements, the development team lays the foundation for a well-designed
and visually appealing app interface that enhances the overall user experience.
11 | P a g e
Development Phase
The development phase of the BMI calculator app involves implementing the BMI
calculation algorithm, designing the user interface (UI), and conducting testing and
debugging to ensure smooth operation.
Furthermore, the algorithm may include additional logic to handle edge cases, such as
validating user input to ensure it falls within acceptable ranges (e.g., height cannot be
negative, weight must be greater than zero), and providing error messages or prompts for
correction if invalid data is entered. Robust error handling and input validation are
essential to enhance the reliability and accuracy of the BMI calculation process.
UI Development:
Concurrently with the implementation of the BMI calculation algorithm, the
development team focuses on designing and creating the app's user interface using Flutter
widgets. Flutter provides a rich set of customizable UI components, allowing developers
to design visually appealing and responsive app screens that align with the project's
design requirements.
The UI development process involves translating the sketches and wireframes from the
design phase into functional app screens. This includes arranging user input fields (e.g.,
height and weight), buttons (e.g., calculate BMI, reset), and result displays in a clear and
intuitive layout. The selected color schemes, fonts, and visual elements are applied
consistently across all screens to maintain a cohesive and branded look.
12 | P a g e
During testing, the development team systematically exercises the app's features,
inputting different combinations of height and weight values to verify that the BMI
calculation produces accurate results. Additionally, user interactions with the UI elements,
such as button clicks and text input, are tested to ensure smooth navigation and
responsiveness.
Any errors, glitches, or inconsistencies discovered during testing are logged, prioritized,
and addressed through debugging and code fixes. This iterative process may involve
revisiting the implementation of the BMI calculation algorithm, adjusting UI layouts, or
refining error handling mechanisms to improve the app's overall quality and user
experience.
In summary, the development phase of the BMI calculator app encompasses the
implementation of the BMI calculation algorithm, UI development using Flutter widgets,
and thorough testing and debugging to ensure functionality and reliability. By adhering to
best practices in software development and maintaining a focus on quality assurance, the
development team can deliver a high-quality BMI calculator app that meets user needs
and expectations.
13 | P a g e
Features
The features of the BMI calculator app are designed to provide users with a comprehensive
tool for monitoring their body mass index (BMI) and promoting health awareness. These
features include input fields for height and weight, calculation of BMI based on user input,
display of BMI result and interpretation, settings for units (metric or imperial), and feedback
and support options.
In conclusion, the BMI calculator app's features encompass essential functionalities for
calculating BMI, interpreting the results, and providing users with personalized feedback
and support options. By offering intuitive input fields, accurate BMI calculations,
informative result interpretations, customizable unit settings, and feedback channels, the app
empowers users to monitor their health and make informed decisions regarding their weight
and overall well-being.
15 | P a g e
CODE
In our project, we have developed two distinct files: main.dart and calculator.dart.
main.dart serves as the primary file responsible for executing the code. Within this file, we have
included and integrated calculator.dart, which holds the user interface (UI) components and
mathematical functionalities crucial for our project.
calculator.dart stands out as the pivotal file in our project due to its role in defining and implementing
the UI design and mathematical operations. It encapsulates the core features of our application,
making it the most significant file within our project structure.
Code:
main.dart:
import 'package:flutter/material.dart';
import 'calculator.dart';
@override
Widget build(BuildContext context)
{ return
MaterialApp( debugShowCheckedMode
Banner: false, theme: ThemeData(
brightness: Brightness.light,
primaryColor: Colors.blue
),
home: BMICalculator(),
);
}
}
16 | P a g e
calculator.dart:
import 'package:untitled/main.dart';
import 'package:flutter/material.dart';
@override
_BMICalculatorState createState() => _BMICalculatorState();
}
setState(() {
main_result.text = res.toStringAsFixed(2);
if(res<18.5){
myColor = Color(0xFF87B1D9);
}
else if(res>=18.5 && res<=24.9)
{ myColor = Color(0xFF3DD365);
}
else if(res>=25 && res<=29.9)
{ myColor = Color(0xFFEEE133);
}
else if(res>=30 && res<=34.9)
{ myColor = Color(0xFFFD802E);
}
else if(res>=35){
myColor = Color(0xFFF95353);
}
});
17 | P a g e
}
@override
Widget build(BuildContext context) {
18 | P a g e
double width = MediaQuery.of(context).size.width;
double height = MediaQuery.of(context).size.height;
return Scaffold(
body:
SingleChildScrollView( child:
Center(
child:
Container( height:
height,
decoration:
BoxDecoration( gradient:
LinearGradient(
colors: [
const Color(0xFF6DD5ED),
const Color(0xFF2193B0)
]
)
),
child:
Center( child:
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox( heigh
t: 100,
),
Text("BMI Calculator",style: TextStyle(fontWeight: FontWeight.bold,color:
Color(0xFF0038FF),fontSize: 25),),
SizedBox( heigh
t: 30,
),
Padding(padding: const EdgeInsets.only(left: 15,right: 15,top: 10),
child: TextField(
controller: weight_Controller,
keyboardType: TextInputType.numberWithOptions(decimal: true),
style: TextStyle(fontSize: 18,color: Colors.black),
decoration: InputDecoration(
filled: true,
fillColor: Colors.white,
hintText: "Enter your weight (kg)",
),
),),
Padding(padding: const EdgeInsets.only(left: 15,right: 15,top: 15),
child: TextField(
controller: height_Controller,
19 | P a g e
autofocus: false,
keyboardType: TextInputType.numberWithOptions(decimal: true),
style: TextStyle(fontSize: 18,color: Colors.black),
decoration: InputDecoration(
filled: true,
fillColor: Colors.white,
hintText: "Enter your height (m)",
20 | P a g e
),
),),
Padding(
padding: EdgeInsets.only(top: 50),
child: Center(
child:
SizedBox( width:
180,
height: 50,
child:
ElevatedButton( onPressed
: (){
CalCulate_BMI(weight_Controller.text, height_Controller.text);
},
child: Text("Calculate",style: TextStyle(fontSize: 18,fontWeight:
FontWeight.bold,color: Colors.white),),
style: ButtonStyle(
backgroundColor:
MaterialStateProperty.all(Color(0xFF0038FF)), shape:
MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15.0),
)
)
),
),
),
),
),
SizedBox( heigh
t: 80,
),
Center(
child:
Container( width:
300,
height: 100,
decoration:
BoxDecoration( color:
myColor,
borderRadius: BorderRadius.all(Radius.circular(12))
),
child: Center(child: Text("BMI: "+main_result.text,style: TextStyle(fontSize:
25,fontWeight: FontWeight.bold,color: Colors.white),)),
),
),
SizedBox( heigh
21 | P a g e
t: 80,
),
Center(child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
22 | P a g e
Container( heigh
t: 50,
width: 50,
decoration:
BoxDecoration( color:
Color(0xFF87B1D9), border:
Border.all(
color: Colors.black,
),
borderRadius: BorderRadius.all(Radius.circular(12))
),
),
Text("Underweight",style: TextStyle(fontSize: 15),)
],
),
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container( heigh
t: 50,
width: 50,
decoration:
BoxDecoration( color:
Color(0xFF3DD365), border:
Border.all(
color: Colors.black,
),
borderRadius: BorderRadius.all(Radius.circular(12))
),
),
Text("Normal",style: TextStyle(fontSize: 15),)
],
),
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container( heigh
t: 50,
width: 50,
decoration:
BoxDecoration( color:
Color(0xFFEEE133), border:
Border.all(
color: Colors.black,
),
borderRadius: BorderRadius.all(Radius.circular(12))
),
23 | P a g e
),
Text("Overweight",style: TextStyle(fontSize: 15),)
],
),
Column(
mainAxisAlignment: MainAxisAlignment.center,
24 | P a g e
children: [
Container( heigh
t: 50,
width: 50,
decoration:
BoxDecoration( color:
Color(0xFFFD802E), border:
Border.all(
color: Colors.black,
),
borderRadius: BorderRadius.all(Radius.circular(12))
),
),
Text("obese",style: TextStyle(fontSize: 15),)
],
),
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container( heigh
t: 50,
width: 50,
decoration:
BoxDecoration( color:
Color(0xFFF95353), border:
Border.all(
color: Colors.black,
),
borderRadius: BorderRadius.all(Radius.circular(12))
),
),
Text("Extreme",style: TextStyle(fontSize: 15),)
],
)
],
),)
],
),
),
),
),
),
);
}
}
25 | P a g e
CONCLUSION
In conclusion, the development of the BMI calculator mobile application using Flutter
has resulted in a user-friendly tool that empowers individuals to monitor their health and
make informed decisions about their weight management. The project successfully
achieved its objectives of providing users with an intuitive interface for calculating
BMI, interpreting the results, and offering customizable settings for a personalized
experience.
Looking ahead, there are several potential enhancements and expansions that could
further enhance the BMI calculator app's value and utility. These include:
26 | P a g e
In summary, the BMI calculator app represents a significant milestone in promoting
health awareness and empowering individuals to take proactive steps towards better
health management. Despite the challenges encountered during development, the
project's outcomes reflect a commitment to delivering a high-quality, user-centric
solution. By incorporating user feedback, embracing continuous improvement, and
exploring opportunities for expansion, the BMI calculator app has the potential to
evolve into a comprehensive health management platform that meets the diverse needs
of its users globally.
27 | P a g e