How To Make App Using Assets File In Android Studio - Androidpro.in

Here describe each steps  step by step we can learn and understand esiely this project and create our own a story app using HTML file using Assets folder.

Step -1 : Create a new project in Android Studio, go to File ⇒ New Project and ll all required details to create a new project. 

Step -2 : Add the following code to res ⇒ layout ⇒ 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"
    tools:context=".MainActivity">

    <ListView
        android:id="@+id/ListView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="5dp"
        android:layout_marginTop="10dp"
        android:background="#FFFDFD"     
        android:layout_marginStart="20dp"
        android:layout_marginEnd="20dp"/>

In the above code, we have taken a List view. When users click on the list, they can see the html le.

Step -3: Create a row to show the title list, so go to res ⇒ Right-click on layout ⇒ New ⇒Layout Resource File. Take le name row ⇒ Click on Ok.

Step -4 : Add the following code to row.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">

    <TextView
        android:id="@+id/row_txt"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Prasent Tense"
        android:textSize="25sp"
        android:padding="10dp"
        android:background="#80000000"
        android:textColor="#ffffff"
        android:gravity="center"
        android:layout_marginBottom="15dp"/>
</RelativeLayout>

Step -5 : Add the following code to res ⇒ values ⇒ strings.xml.

  •        Present Tense
  •        Past Tense
  •        Future Tense
<resources>
    <string name="app_name">Tense Hindi Me</string>
<string-array name="stories_names">
    <item>Present  Tense</item>
    <item>Past Tense</item>
    <item>Future Tense</item>
</string-array>
</resources

In the above code, we have stored title of the story.

Step -6 : Add the following code to MainActivity.java.

package com.example.tensehindime;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class MainActivity extends AppCompatActivity {

    ListView listView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        listView = findViewById(R.id.ListView);
        String[]
               storyNames = getResources().getStringArray(R.array.stories_names);
        ArrayAdapter<String> adapter = new
                ArrayAdapter<>
               (this, R.layout.row, R.id.row_txt, storyNames);
        listView.setAdapter(adapter);
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                Intent intent = new
                        Intent(MainActivity.this, MainActivity2.class);
                intent.putExtra("story_key", position);
                startActivity(intent);

            }
        });
    }
}

Step -7 : Create an assets folder so right click on app ⇒ New folder ⇒ asset folder ⇒ leave as it is and click on Finish. Next right click on assets and paste all your html file.

·       Present Tense

·       Past Tense

·       Future Tense

Step -8: Add the following code ⇒ Right-click on java ⇒ new ⇒ Activity ⇒ Empty Activity Leave as it is and click on Finish. Let assume you newly created Activity_main2.xml and Main2Activity.java.

Step -9 : Now add the following code to Activity_main2.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"
    tools:context=".MainActivity2">

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>

Step -10: Now add the following code to Main2Activity.java.

package com.example.tensehindime;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebView;

public class MainActivity2 extends AppCompatActivity {

    @Override

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);

        WebView webView;
        webView=findViewById(R.id.webview);
        int
                position=getIntent().getIntExtra("story_key",
                0);
        if (position==0){
            webView.loadUrl("file:///android_asset/The Greedy Lion.html");
        }
        else if (position==1){
            webView.loadUrl("file:///android_asset/The Old Man.html");
        }
        else if (position==2){
            webView.loadUrl("file:///android_asset/The Wise Man.html");

        }
    }
}

Now your app is ready to run app and test it!  

Output will show like this...



Tags