1

Group Member:

Haris Adi Nugroho – 001202000168 (Leader)

Lexi anugrah – 001202000069

Bernardus Ariel Dimas Efendi - 001202000086

Ropandi Ritonga - 001202000077

Alvin Sengkey - 001202000115

I Made Shakta Satwika – 001202000119

Professor Name: Dea Rachman

Subject Name: Wireless and Mobile Programming

04 September 2021

Project Mobile Programming: Simple Notes App

In this project the whole group has been decided to create a simple notes app for the users

to create, edit, and delete notes for personal uses, for business and others. It can be used to jot

down quick thoughts, brainstorm ideas, list to-dos, and compose drafts of messages you'll send

down the line.

FUNCTION

The function of the app can be divided into 3 separate part which is add notes, list the

notes, and delete the notes. They can be explained in the following list.
 2

- Add notes: Users can add notes by pressing the “Add New Note”, which then taken into

the note creation section which the users can fill both the title of the note and the content

of the note. Once they’re done they can click on the “Save Note” button with promptly

save the finished note that they’re created

 3

- List Notes: Listing all the notes that made in this app. Note that the list sorts from the

most recent in the top, to the oldest to the bottom.

 4

- Delete Notes: Users can delete unwanted notes by holding down the notes, and press the

delete button. Note that this action can cause permanent note deletion, so best to choose

carefully what notes the users want to delete.

5
 6

CODE INTEGRATION & EXPLANATIONLAYOUT & DESIGN

- Activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#00B0FF"
    android:padding="10dp"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/notestitle"
        android:text="NOTES"
        android:textSize="20dp"
        android:textColor="@color/white"
        android:textStyle="bold"/>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/addnewnotebtn"
        android:layout_below="@id/notestitle" />

    <com.google.android.material.button.MaterialButton
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Add new note"
        android:id="@+id/addnewnotebtn"
        android:textColor="#00B0FF"
        android:backgroundTint="@color/white"
        android:layout_alignParentBottom="true"/>

</RelativeLayout>

This is the main menu of the note’s application

 7

- Activity_add_note.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#00B0FF"
    android:padding="20dp"
    tools:context=".AddNoteActivity">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/titletextview"
        android:text="Add new note"
        android:textColor="@color/white"
        android:textSize="25dp"
        android:textStyle="bold"
        android:gravity="center"
        android:layout_margin="20dp"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="10dp"
        android:layout_margin="10dp"
        android:background="@drawable/rounded_corner">
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/titleinput"
            android:hint="Title"
            android:background="#3000B0FF"
            android:padding="10dp"
            android:layout_margin="10dp"/>
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/descriptioninput"
            android:hint="Decription"
            android:background="#3000B0FF"
 8

            android:padding="10dp"
            android:layout_margin="10dp"
            android:lines="10"
            android:gravity="top"/>

    </LinearLayout>

    <com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/savebtn"
        android:text="SAVE NOTE"
        android:layout_gravity="center"
        android:backgroundTint="@color/white"
        android:textColor="#00B0FF"/>

</LinearLayout>
This is the layout to create / add new notes into the note list
 9

- item_view.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:layout_marginBottom="10dp"
    android:background="@drawable/rounded_corner"
    xmlns:tools="http://schemas.android.com/tools">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/titleoutput"
        android:textSize="20dp"
        android:textColor="@color/black"
        tools:text="My title"/>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/descriptionoutput"
        android:layout_below="@id/titleoutput"
        android:textColor="#393939"
        tools:text="My long long long descrption"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/timeoutput"
        android:layout_below="@id/descriptionoutput"
        android:textSize="12dp"
        android:gravity="end"
        android:textColor="#858484"
        tools:text="Jan 21 2020 "/>

</RelativeLayout>
 10

JAVA CLASSES

- Note.Java

public class Note extends RealmObject {

    String title;
    String description;
    long createdTime;

    public String getTitle() {

        return title;
    }

    public void setTitle(String title) {

        this.title = title;
    }

    public String getDescription() {

        return description;
    }

    public void setDescription(String description) {

        this.description = description;
    }

    public long getCreatedTime() {

        return createdTime;
    }

    public void setCreatedTime(long createdTime) {

        this.createdTime = createdTime;
    }
}
Explanation

This class is used as a Main Structure and reference point using Realm Database Object

to be able to search the data and use it easier later. Most of the function is just a getter and a

setter referenced using “this”.

 11

- MainActivity.java

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        MaterialButton addNoteBtn = findViewById(R.id.addnewnotebtn);

        addNoteBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                startActivity(new
Intent(MainActivity.this,AddNoteActivity.class));
            }
        });

        Realm.init(getApplicationContext());
        Realm realm = Realm.getDefaultInstance();

        RealmResults<Note> notesList =
realm.where(Note.class).findAllSorted("createdTime", Sort.DESCENDING);

        RecyclerView recyclerView = findViewById(R.id.recyclerview);

        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        MyAdapter myAdapter = new MyAdapter(getApplicationContext(),notesList);
        recyclerView.setAdapter(myAdapter);

        notesList.addChangeListener(new
RealmChangeListener<RealmResults<Note>>() {
            @Override
            public void onChange(RealmResults<Note> notes) {
                myAdapter.notifyDataSetChanged();
            }
        });
    }
}
 12

Explanation:

In the main activity most of the codes are defining objects and using a variable which was

defined in the layout. In this case, Material button was used to create a modern looking button,

and then we set a click listener to the button and then make it as a trigger to start another activity

which was AddNoteActivity.java

After defining and setting the listener to the button we then initiate a local database by

using external library called Realm, we initialized the database based on the application context

and then retrieve all data saved before (if exist) by matching it with the Note class we created

before. We used to find all function, searched local Notes data and sort it into descending

(oldest) order.

Then we used recycler view for displaying all the Notes data we searched before as a list

of Notes. If there isn’t any data, then we displayed empty list (invisible). Because Note list is still

a raw data object and we cannot display it to the recycler view, we must convert it into recycler

view data object, so we create a new adapter and used the adapter for the recycler view to

populate the recycler view.

We want to make the data to refresh and re display any new notes we created, so we add

a new ChangeListener into the Notes data which functions as a reloader every time a new data

was added. We also create a simple notification every time a new data has been added.
 13

- AddNoteActivity.java

public class AddNoteActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_add_note);

        EditText titleInput = findViewById(R.id.titleinput);

        EditText descriptionInput = findViewById(R.id.descriptioninput);
        MaterialButton saveBtn = findViewById(R.id.savebtn);

        Realm.init(getApplicationContext());
        Realm realm = Realm.getDefaultInstance();

        saveBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String title = titleInput.getText().toString();
                String description = descriptionInput.getText().toString();
                long createdTime = System.currentTimeMillis();

                realm.beginTransaction();
                Note note = realm.createObject(Note.class);
                note.setTitle(title);
                note.setDescription(description);
                note.setCreatedTime(createdTime);
                realm.commitTransaction();
                Toast.makeText(getApplicationContext(),"Note
saved",Toast.LENGTH_SHORT).show();
                finish();
            }
        });
    }
}
 14

Explanation

This activity is to create or add a new note into the notes list. To add a new note into the

list we first need to define all the variable used in the layout (title input, description input and the

save button). After we defined all the variables, we need to define the database so we can save

the data into the database. Then we add a listener to the save button to trigger a save action into

the database. We then get all the strings inputted via the layout, create a new Note object and

save it to the realm database, after we successfully created the notes, we create a simple toast to

notify the user that the Notes has been successfully created.
 15

CONCLUSION

Thank you for taking your time for reading this report paper on how to use this app. We

hope that you have a pleasant experience for using this simple app for your personal and business

ventures.