Showing posts with label Tutorial. Show all posts
Showing posts with label Tutorial. Show all posts
6:54 PM

How to create the Qur'an app on Android

by , in

Create the Qur'an application on Android-yes this time I will share a tutorial on how to create your own Quran application. Sometimes we as Muslims often lazy to read the Quran (including writers) because of the busyness or the self-employed in work or other things. Sometimes while we are on the way we want to read the Qur'an but near us there is no Qur'an. Therefore, I took the initiative to make or enter the Qur'an in our Android phone. So there is no more reason for us to lazy read al-Quran because the Qur'an is already in our grasp 

Actually there are many Quran apps based on Android in Play store. For those who do not like programming is recommended direct download only in the Play store with the keyword ' Qur'an ', insyaAllah has a lot of popping list2 Quran-based applications of Android from the free and extraordinary. For those who like to challenge programming let's bareng2 we make our own Quran Android application with our own hands. Although not as good and interesting application in Playstore, at least Kalo Bikinin itself it feels gmn ya... Arguably ' masterpiece ' 😀

A. Create a Project
Make sure you have Android Studio installed.
Make a new project, for example we named My Qur'an.
Then select the Empty Activity template, then love the Activitynya name with the MainActivity and its layout with the name Main_layout.
B. Create the Look
We make the first look at main_layout. XML, we make an autocompletetext and ListView, where the AutoComplete will contain NAMA2 letters and listviews are verses from the AutoComplete that we select later.

<?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="match_parent">

    <AutoCompleteTextView
        android:id="@+id/autocomplete"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5sp" />

    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/autocomplete"
        android:background="#ffffff"
        android:cacheColorHint="@android:color/transparent"
        android:divider="#efefef"
        android:dividerHeight="2sp"
        android:listSelector="@android:color/transparent" />

</RelativeLayout>

C. Database Setting
Download The database Qur'an, the database I get from the site http://www.qurandatabase.org/, for those who want to herd again please visit the site and improvisation by yourself.
Then we download the database and change the database to Quran. SQL, then we create a raw folder, which will be executed in order to insert it into the database when the application runs for the first time.

Then we'll create a crud on their Android consisting of (DBHelper. Java, QuranDAO. Java, and QuranVO. Java), DMN Dbhelper is the syntax for CREATE DATABASE, QuranDao for the INSERT, UPDATE, delete, select, and QuranVo syntax as a class The object or its getters.

import android.content.Context;
import android.database.sqlite.SQLiteDatabase;
import android.database.sqlite.SQLiteOpenHelper;

/**
 * Created by imam-pc.
 */
public class DBHelper extends SQLiteOpenHelper {

    protected static final String DATABASE_NAME = "myalquran";
    protected static final String TABLE_NAME = "quran";
    private static final int DATABASE_VERSION = 1;

    public DBHelper(Context context) {
        super(context, DATABASE_NAME, null, DATABASE_VERSION);
        //context.deleteDatabase(DATABASE_NAME); //untuk delete database
    }

    @Override
    public void onCreate(SQLiteDatabase db) {
        String sql = " CREATE TABLE IF NOT EXISTS 'Quran' (" +
                " 'ID' INTEGER PRIMARY KEY," +
                " 'DatabaseID' SMALLINT NOT NULL," +
                " 'SuratID' INTEGER NOT NULL," +
                " 'VerseID' INTEGER NOT NULL," +
                " 'AyatText' TEXT CHARACTER" +
                "); ";
        db.execSQL(sql);
    }

    @Override
    public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {
        String sql = "DROP TABLE IF EXISTS " + TABLE_NAME + "";
        db.execSQL(sql);
        onCreate(db);
    }
}

/**
 * Created by imam-pc.
 */
public class QuranVO {

    private Integer id, databaseId, suratId, verseId;
    private String ayatText;

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public Integer getDatabaseId() {
        return databaseId;
    }

    public void setDatabaseId(Integer databaseId) {
        this.databaseId = databaseId;
    }

    public Integer getSuratId() {
        return suratId;
    }

    public void setSuratId(Integer suratId) {
        this.suratId = suratId;
    }

    public Integer getVerseId() {
        return verseId;
    }

    public void setVerseId(Integer verseId) {
        this.verseId = verseId;
    }

    public String getAyatText() {
        return ayatText;
    }

    public void setAyatText(String ayatText) {
        this.ayatText = ayatText;
    }
}


import android.content.Context;
import android.database.Cursor;
import android.database.sqlite.SQLiteDatabase;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by imam-pc.
 */
public class QuranDAO extends DBHelper {

    private Context ctx;

    public QuranDAO(Context context) {
        super(context);
        ctx = context;
    }

    public List<QuranVO> getListDataWhereCriteria(String table, Integer value) {
        List<QuranVO> recordsList = new ArrayList<>();
        String sql = "SELECT * FROM " + TABLE_NAME + " where " + table + " = '" + value + "'";
        SQLiteDatabase db = this.getWritableDatabase();
        Cursor cursor = db.rawQuery(sql, null);
        if (cursor.moveToFirst()) {
            do {
                Integer suratId = cursor.getInt(cursor.getColumnIndex("SuratID"));
                Integer verseId = cursor.getInt(cursor.getColumnIndex("VerseID"));
                String ayatText = cursor.getString(cursor.getColumnIndex("AyatText"));

                QuranVO dataObj = new QuranVO();
                dataObj.setSuratId(suratId);
                dataObj.setVerseId(verseId);
                dataObj.setAyatText(ayatText);
                recordsList.add(dataObj);

            } while (cursor.moveToNext());
        }
        cursor.close();
        db.close();
        return recordsList;
    }
}

D. Create a MainActivity
Then lastly we make the MainActivity. Java, in this class we enter the data nama2 Qur'an letter to Autocompletetextview. And when typing the name of the letter in this AutoComplete then automatically exit the mail nama2 then and when on click it will automatically listview to be filled with ayat2 from the letter we selected earlier.

import android.app.ProgressDialog;
import android.content.Context;
import android.content.SharedPreferences;
import android.database.sqlite.SQLiteDatabase;
import android.os.AsyncTask;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.AutoCompleteTextView;
import android.widget.ListView;

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private SQLiteDatabase db;
    private ListView listview;
    private AutoCompleteTextView autoCompleteTextView;
    private String[] surahName = {"Al-Fatihah", "Al-Baqarah", "AliImran", "An-Nisaa", "Al-Maidah", "Al-An'am", "Al-A'raf", "Al-Anfaal", "At-Taubah", "Yunus", "Huud", "Yusuf", "Ar-Ra'd", "Ibrahim", "Al-Hijr", "An-Nahl", "Al-Israa'", "Al-Kahfi", "Maryam", "Thaahaa", "Al-Anbiyaa", "Al-Hajj", "Al-Mu'minuun", "An-Nuur", "Al-Furqaan", "Asy-Syu'araa", "An-Naml", "Al-Qashash", "Al-'Ankabuut", "Ar-Ruum", "Luqman", "As-Sajdah", "Al-Ahzab", "Saba'", "Faathir", "YaaSiin", "Ash-Shaaffat", "Shaad", "Az-Zumar", "Al-Mu'min", "Fushshilat", "Asy-Syuura", "Az-Zukhruf", "Ad-Dukhaan", "Al-Jaatsiyah", "Al-Ahqaaf", "Muhammad", "Al-Fat-h", "Al-Hujuraat", "Qaaf", "Adz-Dzaariyat", "Ath-Thuur", "An-Najm", "Al-Qamar", "Ar-Rahmaan", "Al-Waaqi'ah", "Al-Hadiid", "Al-Mujaadilah", "Al-Hasyr", "Al-Mumtahanah", "Ash-Shaff", "Al-Jumuah", "Al-Munaafiqun", "At-Taghaabun", "Ath-Thalaaq", "At-Tahriim", "Al-Mulk", "Al-Qalam", "Al-Haaqqah", "Al-Ma'aarij", "Nuh", "Al-Jin", "Al-Muzzammil", "Al-Muddatstsir", "Al-Qiyaamah", "Al-Insaan", "Al-Mursalaat", "An-Naba'", "An-Naazi'aat", "'Abasa,42", "At-Takwiir", "Al-Infithaar", "Al-Muthaffif", "Al-Insyiqaaq", "Al-Buruuj", "Ath-Thaariq", "Al-A'laa", "Al-Ghaasyiyah", "Al-Fajr", "Al-Balad", "Asy-Syams", "Al-Lail", "Adh-Dhuhaa", "Al-Insyirah", "At-Tiin", "Al-'Alaq", "Al-Qadr", "Al-Bayyinah", "Az-Zalzalah", "Al-'Aadiyaat", "1Al-Qaari'ah", "At-Takaatsur", "Al-'Ashr", "Al-Humazah", "Al-Fiil", "Quraisy", "Al-Maa'uun", "Al-Kautsar", "Al-Kaafiruun", "An-Nashr", "Al-Lahab", "Al-Ikhlash", "Al-Falaq", "An-Naas"};

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

        listview = (ListView) findViewById(R.id.listview);
        autoCompleteTextView = (AutoCompleteTextView) findViewById(R.id.autocomplete);

        autoCompleteTextView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                String selection = (String) adapterView.getItemAtPosition(i);
                int pos = -1;

                for (int j = 0; j < surahName.length; j++) {
                    if (surahName[j].equals(selection)) {
                        pos = j;
                        break;
                    }
                }

                List<QuranVO> listData = new QuranDAO(MainActivity.this).getListDataWhereCriteria("SuratID", pos + 1);
                String[] ayat = new String[listData.size()];
                for (int j = 0; j < listData.size(); j++) {
                    ayat[j] = listData.get(j).getAyatText();
                }
                ArrayAdapter<String> adapter = new ArrayAdapter<>(MainActivity.this,
                        android.R.layout.simple_list_item_1, android.R.id.text1, ayat);
                listview.setAdapter(adapter);
            }
        });

        //init data pas pertama kali buka android saja
        SharedPreferences settings = getSharedPreferences("myalqruan", 0);
        if (settings.getBoolean("firsttime", true)) {
            initData();
            settings.edit().putBoolean("firsttime", false).commit();
        }
        setToListView();
    }

    private void initData() {
        DBHelper dbHelper = new DBHelper(this);
        db = dbHelper.getWritableDatabase();
        new doBackground().execute();
    }

    class doBackground extends AsyncTask<Void, Integer, Void> {

        ProgressDialog progressDialog = new ProgressDialog(MainActivity.this);

        @Override
        protected void onPreExecute() {
            super.onPreExecute();
            progressDialog.setIndeterminate(false);
            progressDialog.setCancelable(false);
            progressDialog.setMessage("Loading Data");
            progressDialog.show();
        }

        @Override
        protected Void doInBackground(Void... voids) {
            insertFromFile(MainActivity.this, R.raw.quran);
            return null;
        }

        @Override
        protected void onPostExecute(Void aVoid) {
            super.onPostExecute(aVoid);
            if (progressDialog != null && progressDialog.isShowing()) {
                progressDialog.dismiss();
            }
        }
    }

    public void insertFromFile(Context context, int resourceId) {
        try {
            InputStream insertsStream = context.getResources().openRawResource(resourceId);
            BufferedReader insertReader = new BufferedReader(new InputStreamReader(insertsStream));

            db.beginTransaction();

            while (insertReader.ready()) {
                String insertStmt = insertReader.readLine();
                db.execSQL(insertStmt);
            }

            db.setTransactionSuccessful();
            db.endTransaction();

            insertReader.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    private void setToListView() {
        ArrayAdapter<String> adapter = new ArrayAdapter<>(this,
                android.R.layout.simple_dropdown_item_1line, surahName);
        autoCompleteTextView.setAdapter(adapter);
    }
}

After that try we run and see the results 🙂
So a little tutorial on how to create the Qur'an application on Android. Jazakallaah.