TTTK2323 MOBILE DEVELOPMENT

FOODIUKM REPORT

SEMESTER 1 2023/2024

0.1 PROJECT DESCRIPTION

FoodiUKM is a project that is aimed to provide an application to users who search for the delicious myriads of delicacies in UKM Bangi. This can include students, staff, and even people living around the area. Users can view the options, and order the food for themselves and their friends. There is even a choice of order now or self-pickup later to receive the food they ordered.

1.0 INTRODUCTION

The National University of Malaysia (Malay: Universiti Kebangsaan Malaysia, abbreviated as  UKM)  is  a  public  university  located  in  Bandar  Baru  Bangi,  Hulu  Langat  District, Selangor,   Malaysia.   There    are    17,500   undergraduate   students    enrolled,   and    5,105 postgraduate students of which 1,368 are foreign students from 35 countries. Students of this university either live in the provided college dormitories or nearby housing areas but many still go to the university for classes every single day. Due to difficulty in distance between their class and living space, most just stay in the university while waiting in between classes and have their meals or snacks for breakfast to re-energise.

With the university having to handle so many students on a daily basis for this matter, almost every faculty and college dorm has a cafeteria for students to gather and have their meals. Just within the biggest and main UKM campus in Bangi itself, there are a total of 8 faculties and 10 college dormitories in which all knowledge of each cafeteria is only able to be spread around through word of mouth. This issue causes individuals to be uncertain and afraid to venture out to other cafeterias in fear certain information will turn out to be false. Students would even opt to just buy food delivery to their dormitories even if the additional cost was too high just to avoid the hardship of searching for the food themselves.

2.0 SYSTEM COMPARISON

The comparison

Figure 2.0 : Use Case Diagram

2.1 Comparison

3.0 APP UI/WIREFRAME

4.0 LIST OF FUNCTIONS AND RELEVANT ANDROID COMPONENT

5.0 TECHNICAL DETAILS CODE FOR CORE FUNCTIONS & EXPLANATION

1. User Registration and Login: Firebase Authentication

●   Users  can  register  as  either  a  user  or restaurant  owner by providing  a username, password, email, and phone number.

- fAuth.createUserWithEmailAndPassword:  Firebase  Authentication  method  attempts to create a new user with the provided information. It returns an AuthResult if successful.

- OnSuccessListener: If the user creation is successful, this listener is triggered and shows a "User Account Created" toast message and then creates a user document in Firestore.

- DocumentReference   userDocument =  fStore.collection("User").document(user.get Uid()): This line creates a reference to the Firestore document for the newly created user. The UID of the user is used as the document ID.

- userDocument.set(userInfo):  This  method  sets  the  user  information  (e.g.,  password, user category, email, etc.) in the Firestore document.

2. Restaurant Browsing: Fragment and Nested RecycleView

● Users can browse restaurants by categories such as Western, Chinese, Thai, etc.

● The restaurants are listed with their names and a visual indication of their category.

- TabLayout  and ViewPager  Setup: The TabLayout is  a UI component that provides a horizontal  layout  to  display  tabs,  and  the  ViewPager2  is  used  to  swipe  between fragments. In this code, tabs for "Location" and "Category" are added to the TabLayout.

- ViewPagerAdapter:  The  ViewPagerAdapter  manages  the  fragments  displayed  in  the ViewPager2. It is initialised with the FragmentManager and is set as the adapter.

- addOnTabSelectedListener: Used to handle tabselection events. When a tab is selected, it sets the current item in the ViewPager2 to the position of the selected tab.

- registerOnPageChangeCallback: Used to synchronise changes in the ViewPager2 with the selected tab in the TabLayout.

3. Menu Exploration and Ordering: RecyclerView

●   Users can view the menu of a selected restaurant, with options including dishes like chicken chop, lamb chop, etc.

●    They  can  select dishes and  specify the quantity for each dish and can then add the selected items to a cart.

- onCreateViewHolder: inflates the layout for individual items.

- onBindViewHolder: binds data to the UI components,  sets up an OnClickListener  for item clicks, and navigates to the MenuDetailsUser activity.

- getItemCount: returns the total number of items in the RecyclerView.

4. Cart and Checkout: RecyclerView

● Users can review their order summary in the cart.

- List filteredList: The method takes a list of OrderDetails as a parameter and filters it based on the user's ID and whether the order is checked out.

- LinearLayoutManager: It  sets the layout manager for the RecyclerView to control the arrangement of items. In this case, it uses a vertical orientation.

- addToCartAdapter: It creates  a new  adapter instance  and sets it to the RecyclerView. The adapter is responsible for creating views for items and managing the data.

- notifyDataSetChanged(): It notifies the adapter that the underlying data has changed

5. Map Direction: 3rd Party API (Google Maps)

● Users can view the direction to go to their desired restaurant

● System will detect the location of the restaurant

- RouteDrawing Class:  This  class  is  used  for obtaining route information between two waypoints and is a part of the third-party library (com.codebyashish.googledirectionapi).

- RouteDrawing.Builder: The method  starts by creating an instance, configuring various parameters using a builder pattern. Then context(ViewMap.this) is passed to the builder. travelMode(AbstractRouting.TravelMode.DRIVING) specifies  the  travel  mode  for route  calculation.  Here,  it's  set  to  driving  mode. withListener(this) sets  the  current activity  as  a  listener  for  route-related  callbacks. alternativeRoutes(true) specifies whether to include alternative routes.

- waypoints(start, end): Defines the starting and ending points (waypoints) for which the route needs to be calculated.

- routeDrawing.execute(): Initiates the execution of the route calculation.

- RouteListener : The ViewMap class implements the interface, which includes methods onRouteStart, onRouteSuccess,   onRouteFailure,   and onRouteCancelled.   These methods are callbacks triggered during the route calculation process.

- Polyline: In the onRouteSuccess method, the code receives a list of route information and draws a polyline on the Google Map using the obtained points.

5. Payment:

● The application redirects to a payment gateway for transaction processing.

- FirebaseAuth:  Used  for  user  authentication.  It  provides  methods  for  managing  user sign-in states.

- Implicit Intent: An implicit intent is used to invoke components of the Android system. In this code, it's used to open the Maybank2u website in a web browser.

- Query and DocumentReference (Firestore):   Query   and   DocumentReference   are Firestore components used for querying data. A Query represents a query over the data, and a DocumentReference refers to a specific document in the database.

- EventListeners:  EventListener  is  used  to  listen  for  changes  in Firestore data. In this code, it's used to dynamically update the UI when the user's wallet amount changes.

6. Order Completion and Feedback (RecyclerView):

● Upon order completion, users receive their order receipt.

●   Users are prompted to provide feedback on their experience, particularly on the dish they ordered.

- RecyclerView:  orderAdded  is  an  instance  of RecyclerView. It efficiently recycles  and reuses views as the user scrolls through a list.

- SharedPreferences: A way to store key-value pairs in Android. It's often used for storing small amounts of data persistently, such as user preferences.

- FirebaseFirestore: FirebaseFirestore is used to update the rating of the order user made

- RecyclerView Adapter (FeedbackAdapter):  A  custom  adapter  (FeedbackAdapter)  is used  to  adapt  the  data  to  the RecyclerView.  It  extends  RecyclerView.Adapter  and manages the data and how it's displayed in the RecyclerView.

- LayoutManager:  Responsible  for positioning items in  a RecyclerView. In this case, a LinearLayoutManager is used to arrange items in a vertical list.

7.Navigation Bar

●   Users may  select options from the navigation bar whether to view restaurants, view profile,wallet or log out of the app.

- setupToolbar: The Toolbar is an essential component for creating a navigation bar. It is set  up  using  the  setupToolbar  method  in  the  ToolbarHandler  class.  This  method  is responsible for setting up the Toolbar with the specified ID and enabling the "Up" button for navigation.

- inflateMenu:  This  method  is  used  to  inflate  the  menu  items  into  the  Toolbar.  This method inflates the menu specified by menuResId into the Toolbar.

- handleMenuItemClick: This method is crucial for handling click events on menu items. It checks the ID of the selected menu item and performs actions accordingly. In your case, it shows a logout confirmation dialog or handles other menu items.

6.0 CONCLUSION

The myriad of foods at UKM is an exciting journey for students to explore during their studies  at  the  university.  However,  with  most  students  not  having  transportation  and knowledge of what exactly is around the university, it can be rather difficult to take a step out of their rooms. Having such an application can help students with this issue, especially first year students. With users being anyone who wants to eat UKM’s culinary expertise, this has a lot of potential for increasing its customer reach. Providing ease such as this to people who want to eat in UKM can increase the university’s prestige among those around the area.

With the majority of people having mobile phones in this modern era, there is an increase in mobile applications that provide all kinds of ease into the lives of users. Due to many  reasons  supported  by  the  requirements  elicitation  conducted  during this project,  it supports the importance of FoodiUKM in the lives of people who stay around UKM with the objective of providing information on the eateries in this university. Not only does the list of objectives stated in this document aim to provide a solution to a common problem that many people face, but it is backed up by all the information that was gathered.

The  system  models  that  were  designed  were  made  in  order  to  give  a  visual representation of our system before we continue to develop it in the near future. All models have different functions and angles in understanding the system, and with this information that they provide, the development process will be easier as we know all the requirements needed by the application.

7.0 REFERENCE

Firebase. (2016, May 18). Introducing cloud storage for Firebase [Video]. YouTube. https://www.youtube.com/watch?v=_tyjqozrEPY

Firebase.  (2018,  October  24). How to Structure Your  Data   |  Get  to  know Cloud Firestore #5 [Video]. YouTube. https://www.youtube.com/watch?v=haMOUb3KVSo

Fireship.   (2022,    February    17). Firebase    in    100   seconds [Video].   YouTube.

https://www.youtube.com/watch?v=vAoB4VbhRzM

Practical Coding. (2021, October 22). RecyclerView  | Everything  You  need to know [Video]. YouTube. https://www.youtube.com/watch?v=Mc0XT58A1Z4