JSS MAHAVIDYAPEETHA

Mini Project / Internship Assessment

Subject Name: Mini project / Internship Assessment

Subject Code : KCS-354

COURSE: B.Tech.
SEMESTER: III

by
Harshit Garg -2000910100075

Department of Computer Science and Engineering

JSS ACADEMY OF TECHNICAL EDUCATION
C-20/1, SECTOR-62, NOIDA
 INDEX

S No. CONTENT PAGE NO.

1. Vision And Mission 1

2. Program Outcomes (Pos) 2

3. Program Educational Outcomes (PEOs) 3

4. Course Outcomes (Cos) 4

5. Declaration 5

6. Certificate 6

7. Acknowledgement 7

8. Flutter 8-10

9. Dart 11-12

10. Firebase 13-15

11. Flutter Working With Animations 16-17

12. Firebase Cloud 18-20

13. Firebase Authentication 20

14. Android Creating a Splash Screen 21-23

15. JSSATE LOGIN APP 24-25

1. Main Page
2. User ID Page
3. Features Page
4. Attendance Calendar
5. Subject’s Page
6. College Location Map
7. Class Time Table

16. Reference 26
 VISION AND MISSION

VISION OF THE INSTITUTE

JSS Academy of Technical Education Noida aims to become an Institution of excellence in

imparting quality Outcome Based Education that empowers the young generation with
Knowledge, Skills, Research, Aptitude and Ethical values to solve Contemporary
Challenging Problems.

MISSION OF THE INSTITUTE

Develop a platform for achieving globally acceptable level of intellectual acumen and
technological competence

Create an inspiring ambience that raises the motivation level for conducting quality research

Provide an environment for acquiring ethical values and positive attitude

VISION OF THE DEPARTMENT

“To spark the imagination of the Computer Science Engineers with values, skills
and creativity to solve the real-world problems.”

MISSION OF THE DEPARTMENT

To inculcate creative thinking and problem-solving skills through effective teaching,

learning and research.
To empower professionals with core competency in the field of Computer Science and
Engineering.
To foster independent and lifelong learning with ethical and social responsibilities.

1.
PROGRAM OUTCOMES (POs)

Engineering Graduates will be able to:

PO1: Engineering knowledge: Apply the knowledge of mathematics, science, engineering
fundamentals, and an engineering specialization to the solution of complex engineering
problems.
PO2: Problem analysis: Identify, formulate, review research literature, and analyze complex
engineering problems reaching substantiated conclusions using first principles of
mathematics, natural sciences, and engineering sciences.
PO3: Design/development of solutions: Design solutions for complex engineering problems
and design system components or processes that meet the specified needs with appropriate
consideration for the public health and safety, and the cultural, societal, and environmental
considerations.
PO4: Conduct investigations of complex problems: Use research-based knowledge and
research methods including design of experiments, analysis and interpretation of data, and
synthesis of the information to provide valid conclusions.
PO5: Modern tool usage: Create, select, and apply appropriate techniques, resources, and
modern engineering and IT tools including prediction and modeling to complex engineering
activities with an understanding of the limitations.
PO6: The engineer and society: Apply reasoning informed by the contextual knowledge to
assess societal, health, safety, legal and cultural issues and the consequent responsibilities
relevant to the professional engineering practice.
PO7: Environment and sustainability: Understand the impact of the professional
engineering solutions in societal and environmental contexts, and demonstrate the knowledge
of, and need for sustainable development.
PO8: Ethics: Apply ethical principles and commit to professional ethics and responsibilities
and norms of the engineering practice.
PO9: Individual and team work: Function effectively as an individual, and as a member or
leader in diverse teams, and in multidisciplinary settings.
PO10: Communication: Communicate effectively on complex engineering activities with
the engineering community and with society at large, such as, being able to comprehend and
write effective reports and design documentation, make effective presentations, and give and
receive clear instructions.
PO11: Project management and finance: Demonstrate knowledge and understanding of the
engineering and management principles and apply these to one’s own work, as a member and
leader in a team, to manage projects and in multidisciplinary environments.
PO12: Life-long learning: Recognize the need for, and have the preparation and ability to
engage in independent and life-long learning in the broadest context of technological change.

2.
PROGRAM EDUCATIONAL OUTCOMES (PEOs)

PEO1: To empower students with effective computational and problem-solving skills.

PEO2: To enable students with core skills for employment and entrepreneurship.

PEO3: To imbibe students with ethical values and leadership qualities.

PEO4: To foster students with research-oriented ability which helps them in analyzing
and solving real life problems and motivate them for pursuing higher studies.

PROGRAM SPECIFIC OUTCOMES (PSOs)

PSO1: An ability to apply foundation of Computer Science and Engineering, algorithmic

principles and theory in designing and modeling computation-based systems.

PSO2: The ability to demonstrate software development skills.

3.
COURSE OUTCOMES (COs)

C224.1 Undertake problem identification, formulation and design a solution

C224.2 Solve the real-world problems effectively and adapt with real life working
environment.
C224.3 Acquire skills and knowledge on latest tools and technologies
C224.4 Develop effective communication skills for presentation of project related
activities
C224.5 Effectively communicate solution to problems through technical reports

CO-PO-PSO MAPPING

PO PO PO PO PO PO PO PO PO PO PO PO PSO PSO
1 2 3 4 5 6 7 8 9 10 11 12 1 2

C224.1 3 3 3 3 2 3 3 3 3 3 2 3 3 3
C224.2 3 3 3 3 3 3 3 3 3 2 3 3 3 3
C224.3 2 2 3 3 3 2 3 3 3 1 2 3 3 3
C224.4 2 2 2 2 2 2 2 2 2 3 2 3 2 2
C224.5 2 2 2 2 2 2 2 2 2 3 2 3 2 2
C224 2. 2.4 2.6 2.6 2.4 2.4 2.6 2.6 2.6 2.40 2.20 3.00 2.60 2.60
40 0 0 0 0 0 0 0 0

4.
 DECLARATION

I hereby declare that this submission is my own work and that, to the best
of my knowledge and belief, it contains no material previously published
or written by another person nor material which to a substantial extent has
been accepted for the award of any other degree or diploma of the
university or other institute of higher learning, except where due
acknowledgment has been made in the text.

Signature:

Name : Harshit Garg

Roll No.: 2000910100075
Date: 17.02.2022

5.
 CERTIFICATE

This is to certify that Mini Project/Internship Assessment Report entitled “JSSATE LOGIN”
which is submitted by “HARHSIT GARG” in partial fulfillment of the requirement for the
award of degree B. Tech. in Department of Computer Science and Engineering of Dr. APJ
Abdul Kalam Technical University, Uttar Pradesh, Lucknow is a record of the candidate’s own
work carried out by them under my supervision. The matter embodied in this report is original
and has not been submitted for the award of any other degree.

Supervisor: Mr. Sur Singh Rawat

Date: 17.02.2022

6.
 ACKNOWLEDGEMENT

In the accomplishment of completion of my project “JSSATE LOGIN” I

would like to convey my special gratitude to my supervisor Mr. Sur Singh
Rawat, of Department of Computer Science and Engineering and as
well as Dr Gurulingappa M Patil principal of JSSATE

Your valuable guidance and suggestions helped me in various phases of

the completion of this project. I will always be thankful to you in this regard.

Name : Harshit Garg

Roll No.: 2000910100075

7.
 FLUTTER

Flutter | An introduction to the open source SDK by Google

Flutter is Google’s Mobile SDK to build native iOS and Android, Desktop
(Windows, Linux, macOS), Web apps from a single codebase. When building
applications with Flutter everything towards Widgets – the blocks with which
the flutter apps are built. They are structural elements that ship with a bunch
of material design-specific functionalities and new widgets can be composed
out of existing ones too. The process of composing widgets together is called
composition. The User Interface of the app is composed of many simple
widgets, each of them handling one particular job. That is the reason why
Flutter developers tend to think of their flutter app as a tree of widgets.

Types of widgets:
 Stateless Widgets
 Stateful Widgets

Flutter, Dart and equivalent technologies

8.
Widgets in Flutter:
Flutter is Google’s UI toolkit for crafting beautiful, natively compiled iOS and
Android apps from a single code base. To build any application we start with
widgets – The building block of flutter applications. Widgets describe what their
view should look like given their current configuration and state. It includes a
text widget, row widget, column widget, container widget, and many more.

Widgets: Each element on a screen of the Flutter app is a widget. The view
of the screen completely depends upon the choice and sequence of the
widgets used to build the app. And the structure of the code of an app is a tree
of widgets.

Category of Widgets: There are mainly 14 categories in which the flutter

widgets are divided. They are mainly segregated on the basis of the
functionality they provide in a flutter application.

1. Accessibility: These are the set of widgets that make a flutter app
more easily accessible.
2. Animation and Motion: These widgets add animation to other
widgets.
3. Assets, Images, and Icons: These widgets take charge of assets
such as display images and show icons.
4. Async: These provide async functionality in the flutter application.
5. Basics: These are the bundle of widgets which are absolutely
necessary for the development of any flutter application.
6. Cupertino: These are the ios designed widgets.
7. Input: This set of widgets provide input functionality in a flutter
application.
8. Interaction Models: These widgets are here to manage touch events
and route users to different views in the application.
9. Layout: This bundle of widgets helps in placing the other widgets on
the screen as needed.
10. Material Components: This is a set of widgets that mainly follow
material design by Google.
11. Painting and effects: This is the set of widgets which apply visual
changes to their child widgets without changing their layout or shape.
12. Scrolling: This provides sacrollability of to a set of other widgets
that are not scrollable by default.
13. Styling: This deals with the theme, responsiveness, and sizing of
the app.
14. Text: This display text.

9.
Description of the Widgets Used:
 Scaffold – Implements the basic material design visual layout
structure.
 AppBar – To create a bar at the top of the screen.
 Text To write anything on the screen.
 Container – To contain any widget.
 Center – To provide center alignment to other widgets.

The biggest selling point of Flutter Tech are two things:

1. High-Performance App: The Apps developed using Flutter are

highly expressive and have flexible UI. Its fast development due to
hot reloading brings the app to life and its expressiveness provides
features that are keened for native end-user experiences.
2. Expressive and Flexible UI: Flutter lets developers build beautiful
looking apps with ease by using prebuild material widgets. Even
though many widgets are prebuilt still flutter enables full
customization of the widget.
3. Fast Development & Hot Reloading: Hot Reloading refers to
injection of new versions of the files that you edited at runtime while
keeping the app running.

The Pros and Cons of Flutter:

Pros:
 Flutter uses a single codebase, called, Dart for both platforms,
Android and iOS which is a simple language ensuring type safety.
 Both Flutter language and community are developing with great
speed, releasing new features, widgets and add-ons.
 Flutter has its own set of widgets rather than using the widgets
provided by the host operating system which means the user
provides its own gesture recognition model, thus, having greater
control over the precise rendering or customization of the widgets.
 The hot-reloading is a game-changer in the productivity of the
development process. It gives a lively effect to the app under
development, thus making the whole development cycle more
exciting for the UI/UX developer using Flutter.
Cons:
 In reality, there are no cons to flutter because there isn’t any other
framework as effective and elaborate as flutter. Even though if we
have to list any it would be related to Dart programming language as
while converting dart to JavaScript there are some bugs to be fixed,
dart doesn’t have a framework for backend, etc.

10.
 DART

Introduction to Dart Programming Language

Dart is the open-source programming language originally developed by
Google. It is meant for both server side as well as the user side. The Dart SDK
comes with its compiler – the Dart VM and a utility dart2js which is meant for
generating Javascript equivalent of a Dart Script so that it can be run on
those sites also which don’t support Dart.

Dart is Object-oriented language and is quite similar to that of Java

Programming. Dart is extensively use to create single-page websites and
web-applications. Best example of dart application is Gmail.

First Code in Dart:

In dart main() function is predefined method and acts as the entry point to the
application. A dart script needs the main() method for execution of the code.
The program code goes like this:

Output:
Welcome to GeeksForGeeks

The print() command is predefined function that prints the specific string or
value to the standard input.
Execution of program:
1. Online Compiler: The online compiler which support Dart is Dart
Pad.
2. IDE: The IDEs which support Dart are WebStorm, Intellij, Eclipse,
etc. Among them WebStorm from Jetbrains is available for Mac OS,
Windows and Linux.
3. The dart program can also be compile through terminal by executing
the code dart file_name.dart.

11.
Dart – Common Collection Methods:
List, Set, and Map share common functionality found in many collections.
Some of this common functionality is defined by the Iterable class, which List
and Set implement.

1. isEmpty() or isNotEmpty:

Use isEmpty or isNotEmpty to check whether a list, set, or map has items:

2. forEach():

To apply a function to each item in a list, set, or map, you can use forEach():

3.where():

Use Iterable’s where() method to get all the items that match a condition. Use
Iterable’s any() and every() methods to check whether some or all items match
a condition.

Dart – Getters and Setters:

Getters and Setters, also called accessors and mutators, allow the program
to initialize and retrieve the values of class fields respectively.
 Getters or accessors are defined using the get keyword.
 Setters or mutators are defined using the set keyword.
A default getter/setter is associated with every class. However, the default
ones can be overridden by explicitly defining a setter/ getter. A getter has no
parameters and returns a value, and the setter has one parameter and does
not return a value.

Dart – Functions:
Function is a set of statements that take inputs, do some specific computation
and produces output. Functions are created when certain statements are
repeatedly occurring in the program and a function is created to replace them.
Functions make it easy to divide the complex program into smaller sub-groups
and increase the code reusability of the program.

12.
 FIREBASE
Firebase – Introduction
Firebase is a product of Google which helps developers to build, manage, and
grow their apps easily. It helps developers to build their apps faster and in a
more secure way. No programming is required on the firebase side which
makes it easy to use its features more efficiently. It provides services to
android, ios, web, and unity. It provides cloud storage. It uses NoSQL for the
database for the storage of data.

Features of Firebase:
Mainly there are 3 categories in which firebase provides its services.

13.
Build better applications

This feature mainly includes backend services that help developers to build
and manage their applications in a better way. Services included under this
feature are :
 Realtime Database: The Firebase Realtime Database is a cloud-
based NoSQL database that manages your data at the blazing speed
of milliseconds. In simplest term, it can be considered as a big JSON
file.

 Cloud Firestore: The cloud Firestore is a NoSQL document

database that provides services like store, sync, and query through
the application on a global scale. It stores data in the form of objects
also known as Documents. It has a key-value pair and can store all
kinds of data like, strings, binary data, and even JSON trees.

14.
 Authentication: Firebase Authentication service provides easy to use
UI libraries and SDKs to authenticate users to your app. It reduces the
manpower and effort required to develop and maintain the user authen-
tication service.

 Remote Config: The remote configuration service helps in

publishing updates to the user immediately. The changes can range
from changing components of the UI to changing the behaviour of
the applications. These are often used while publishing seasonal
offers and contents to the application that has a limited life.

 Hosting: Firebase provides hosting of applications with speed and

security. It can be used to host Static or Dynamic websites and
microservices. It has the capability of hosting an application with a
single command.
 Firebase Cloud Messaging(FCM): The FCM service provides a
connection between the server and the application end users, which
can be used to receive and send messages and notifications. These
connections are reliable and battery-efficient.

15.
 Flutter – Working with Animations
Whenever building an app animation plays a vital role in designing the
experience of the user. People tend to like an app that has a smooth flow and
a slick design. The Flutter Package provides a variety of methods to create
and use animation in our app. We will be discussing the inbuilt Flutter widgets
to handle animation.

As the flow chart shows to handle animation in Flutter the framework provides
widgets of different capacity and implementation. The basic property that is
present in all the animation widget is the Duration and Curve. The Duration
is the time for which the widget animates and the Curve defines the way the
object animates and from beginning to end (The flow of the animation from
start to end). The built-in animation widgets in flutter can be divided into two
main categories.
Implicit Widgets:
These are the simplest widget provided by flutter. These widgets can be
implemented without much work from the developer. These are very basic
animation techniques, so they don’t have many options available to be
changed. They have one-way animation which is not continuous. The implicit
widgets can in turn be categorized into two as

 AnimatedXYZ: Here XYZ is a specific widget available to be

animated. These are animated versions of the basic widgets
available in Flutter. Here are some of the Implicit AnimatedXYZ of
existing XYZ widgets.
 Align → AnimatedAlign
 Container → AnimatedContainer
 DefaultTextStyle → AnimatedDefaultTextStyle
 Padding → AnimatedPadding
 Positioned → AnimatedPositioned

16.
  TweenAnimationBuilder: These widgets animate a given widget
from an initial value (Tween.begin) to a final value (Tween.end). This
widget can be used to animate a custom widget for a simple
animation. It takes in a builder property that builds the Animation
based on the value provided in its parameter. We can also provide
what needs to be done when the animation completes with the help
of onEnd callback.

Explicit Widget:

These widgets provide a more granular control on the animated widget. They
have the properties to control the repetition and movement of the widget.
These widgets require an AnimationController for the granular control they
provide. This controller can be defined in the initState and
the dispose of states for better usage. The explicit widget can be categorized
as
 XYZTransition: Here XYZ is a specific widget available as
Transition. These are built-in transition which provides more control
over the implicit animation. They can be thought of as an extension
of the AnimatedXYZ widget. Some explicit XYZTransition available
are:
 SizeTransition
 FadeTransition
 AlignTransition
 RotationTransition
 PositionedTransition
 DecoratedBoxTransition

 AnimatedBuilder/ AnimatedWidget: When there are no widgets

available from the predefined XYZTransition which already define a
variety of Animation then we can use
the AnimatedBuilder/ AnimatedWidget. They apply to a custom
widget that we want to explicitly animate. If we can define the
animation in the same widget then we can use the AnimatedBuilder
otherwise if we define a while new widget we can extend the defined
widget with the Animated Widget.

17.
 FIREBASE CLOUD
How to Push Notification in Android using Firebase Cloud
Messaging?
Firebase Cloud Messaging is a real-time solution for sending notifications to
client apps without any kind of charges. FCM can reliably transfer notifications
of up to 4Kb of payload. In this article, a sample app showing how this service
can be availed is developed. Though FCM also allows sending out
notifications using an app server, here Firebase admin SDK is used. Follow
the complete article to implement an example of FCM.

Firebase: Cloud Storage

Cloud Storage is built for application developers who need to store and
serve user-generated content, usually big files like photos or videos. It is
mostly used or developed for photos and videos, but we might use this for
other things like text files.

A powerful, cost-effective, and simple object storage service built to scale:

1. Google security, when uploading or downloading files from our

firebase apps.
2. We can store images, audio, video, or other user-generated content.
3. We can use Google Cloud Storage to access the same files on the
server.

It is a technology which allows for storing and managing various media

content generated by mobile app users. It is a cloud computing model
which stores data on the internet through a cloud computing provider who
manages and operates data storage as a service. It is delivered on-
demand with just-in-time costs and capacity. It eliminates buying and
managing our own data storage infrastructure. It provides us agility,
durability, global scale with "anywhere, anytime" data access.

18.
 Key Capabilities
Firebase Cloud Storage is capable of performing the following things:
Robust Operations:
Reliability is one of the biggest advantages of the Cloud Firestore. Firebase SDKs
perform uploads and downloads regardless of network quality. Downloads and
uploads both are robust. Robust means from where it stopped, will restart from there,
and save the user time and bandwidth.

Strong security:
For providing simple and intuitive authentication to the developer, Firebase SDKs for
Cloud Storage integrate with Firebase Authentication. For allowing access based on
filename, size, content type, and other metadata, we can use declarative security
model.

High Scalability:
Cloud Storage is built for the Exabyte scale when our app goes viral. Easily grow from
prototype to production using the same structure that powers Spotify and Google
Photos.

How does it work?

Cloud storage is purchased from third-party cloud vendors that own and operate data
storage capacity and distribute it over the internet in a pay-as-you-go model. These
cloud storage vendors manage security, capacity, and stability to make data
accessible to our applications worldwide.

19.
Applications use cloud storage through traditional storage protocols or directly through
an API. Many vendors provide complementary services designed to help collect,
secure, manage, and analyze data on a large scale.Cloud Storage stores our files in
the Google Cloud Storage bucket and makes them accessible through both Firebase
and Google Cloud. It allows us to upload and download files from mobile clients
through the Firebase SDKs, and perform server-side processing such as image
filtering or video transcoding using the Google Cloud Platform. Cloud Storage scales
automatically. It means that there is no need to migrate to any other provider.

Firebase Cloud Storage is a powerful yet easy-to-use tool for storing all types of
objects. With its help, we can store videos, images, audio, and other types of user
content. Firebase Cloud Storage allows us to easily switch from app prototyping to a
complete product, thanks to its ability to be highly-scalable and process exabytes of
data.

FIREBASE AUTHENTICATION

Firebase Authentication with Phone Number OTP in Android

Many apps require their users to be authenticated. So for the purpose of
authenticating the apps uses phone number authentication inside their apps.
In phone authentication, the user has to verify his identity with his phone
number. Inside the app user has to enter his phone number after that he will
receive a verification code on his mobile number. He has to enter that
verification code and verify his identity. So this is how phone authentication
works. Firebase provides so many ways for authentication users such as
Google, Email and Password, Phone, and many more. In this article, we will
take a look at the implementation of Phone Authentication inside our App using
Firebase.

Step by Step Implementation:

Step 1: Create a New Project

Step 2: Connect your app to Firebase
Step 3: Verify that dependency for Firebase authentication is added inside
Your app
Step 4: Working with the activity_main.xml file
Step 5: Add permissions for the internet in your Manifest.xml file
Step 6: Create a new Activity for our Home Page
Step 7: Working with the MainActivity.java file
Step 8: Working on Home Activity
Step 9: Enable Firebase Phone Authentication in our Firebase Console

20.
An intuitive splash screen maker:
What is a splash screen?

Splash screens—commonly known as opening screens or startup screens—are a

popular feature of many mobile apps, appearing immediately after the user opens the
app and before it is fully functional. Regardless of how quickly an app loads, any short
delay can feel like a hiccup from the user perspective. A splash screen helps to smooth
over those delays for what feels like a perfectly seamless experience.

Most splash screens show the app’s logo as a short animation. The splash screen may
include a current version number or a loading progress bar as well.

Although the primary purpose of an iOS or Android splash screen is to provide a smooth
transition into the app while it’s loading, there’s obviously a limit to how long users will
wait. We recommend keeping a splash screen animation under 3 seconds to keep
people from bouncing.

Why app splash screens matter?

YouTube splash screens before videos), a splash screen is effectively a way of buying
time while the full app loads. However, ideally, it should go much further than this, by
also making a strong impact on UX.

Simply put, first impressions count. A sleek, stylish, and seamless app splash screen will
raise expectations(and likely also perceptions) of your app among users. This will help
to reinforce the image of your app as a high quality, well-designed, and supremely usable
bit of software.

Get your splash screen right, and users will enjoy being greeted by it each time they load
the app. Get it wrong, and they’ll see it as a waste of their precious time.

Best practices for creating splash screens:

The following are some best practices to adhere to when making an app splash screen.
Follow these guidelines and half the battle is already won.

● Keep the duration to under 3 seconds.

● Reduce this to 1 second for apps that users are likely to open several times per day.

21.
● When evaluating splash screen designs, go for simple and bold over complex and
intricate.

● The same for animation; overly complicated sequences will only appear showy, and
likely make users feel that their time isn’t valued.

● A strong background color or even a background image can be good options. However,
if your splash screen features an animation, a basic solid or gradient background will
likely work better, providing a clean canvas against which the action can take place.

● Ask a developer what’s the absolute minimum number of tasks an app must carry out
on boot-up, and they’ll likely provide you with a list as long as your arm. Stay firm, and
insist that this be reduced to only a handful of key tasks, with all the others taking place
once the app is running.

● If you really want to produce a more complex intro sequence with flashy animation and
special effects, keep this for only the first time that the user starts up the app, switching
to a more simple version for all subsequent occasions.

Android | Creating a Splash Screen

A splash screen is mostly the first screen of the app when it is opened. It is a
constant screen which appears for a specific amount of time, generally shows
for the first time when the app is launched. The Splash screen is used to
display some basic introductory information such as the company logo,
content, etc just before the app loads completely.

Creating Splash screen using handler in Android:

Here we created two activities MainActivity showing the Splash Screen and
SecondActivity in order to switch from MainActivity to SecondActivity. The main
program is written in MainActivity, you can change activities as per your need.
 To remove the ActionBar, you need to make following changes in your
styles.xml file.
 style name="AppTheme"
parent="Theme.AppCompat.Light.NoActionBar"
 ...

 Use colors which is suitable for your application.

 No need to make any changes in your manifest file.

22.
 Flutter – Animated Splash Screen

The Animated Splash screen is used for a startup screen in a Flutter

application. More or less all applications use them generally to show the logo
of the institution and its creators awareness. This although holds no
functionality but it can be great to increase product awareness and
promotion.
Let’s look deep into the implementation of the Animated Splash screen with
the help of a simple application. To build so, follow the below steps:
 Add the dependency in pubspec.yaml file
 Import the dependency to the main.dart file
 Add the asset (logo) to the asset folder for use in the application
 Add the asset to the pubspec.yaml file
 Create the Homepage for which to transition after the splash screen

Create a splash screen in Framer:

In Framer you can make a splash screen by using the out-of-the-box Video Default
Component. Start by creating two screens using the Screen tool. The first screen is
where your video will play, and the second will be the screen to which it transitions. Next,
insert the Video component from the Insert Menu. Place the Video component on the
first screen and upload a video from your computer or link one from a URL.

With the Video component selected, set the controls to Autoplay: Yes, and Loop: No. Set
the Interaction of the Video component to transition when the video ends, then set the
Transition type to Magic Motion. Now your splash screen is ready to go!

23.
 JSSATE LOGIN APP

1.Main Page 2. User ID Page

3.Features Page 4.Attendance Calendar

24.
5.Subject’s Page 6. College Location Map

7.Class Time Table

25.
Reference:
 https://www.geeksforgeeks.org/introduction-to-android-
development/
 https://developer.android.com/guide

26.