Learn Android Development For Beginners

Android Application’s Folder Structure

It is very important to understand the files and directories structure of the Android Application. If you are developing application in the Eclipse your application will have some extra folders which are not available when you work in Android Studio. This chapter focuses on the folder structure of the Android Studio.

Android studio places all the modules in the src folder. The main modules of the Android application is

  1. Source File
  2. Resource File
  3. Manifest File

1. Source File

Src/main/java contains the all java source files those are associated to the project. For example the MainActivity.java file generated by Android Studio is stored in this directory under the package name “com.example.mycommoncontrols” you specified in the wizard. You can add more packages for your application e.g. com.example.Fragments, com.example.CommonClasses etc.

2. Resource File

/Src/main/res contains all the resource files those are associated to your application. All the graphical element, string and layout of application exists one of the sub folder of the res. The images, string, layout file should be separate from the code, because it allows you to provide resources that supports specific devices configuration such as different languages, screen size etc.

/Drawable folder contains the images those are used in your application. E.g “ic_launcher.png” image inside the drawable folders is the application icon. There are many drawable folders drawable-ldpi, drawable-mdpi, and drawable-hdpi which contain the images for different density. The Android system picks the image from folder that matched the density of the device otherwise it picks default folder.

/Layout folder contains the layout recourses. In Android, the view of the screen loaded from an XML files as a resource. A layout resource is a key resource used in Android UI programming. In Previous chapters we have used layout resource in every example.

/Menu folder contains the menu resource to define Menu items using XML. You can also define menu items through code but preferred way is to create using XML. This folder can have several menus in application.

/Values folder contains the resources of different type such as string, dimensions, integer and other values.

3. Manifest File

AndroidManifest.xml file describes the functionality and requirement of application to Android. It is the most important file in the android application and every application must have an AndroidManifest.xml file in its root directory.

You can learn more about Android Manifest file here.

Write a Program to Access Resources

Create a new project in Android Studio and name it “MyResourceTest”.

Add String Resource

Go to the res/values folder and open the strings.xml file.

Android studio by default adds values in string.xml file when create new project. The string resource provides the strings for your application. Add new string resources in the string.xml file

 <?xml version="1.0" encoding="utf-8"?>
 <resources>
    <string name="app_name">MyResourceTest</string>
    <string name="action_settings">Settings</string>
    <string name="action_close">Close</string>
    <string name="title1">Title 1</string>
    <string name="title2">Title 2</string>
 </resources>

<string> element defines the string resource for the application and name attribute uniquely identifier for the resource.

Add Color Resource

Now define some color resources. Go to the res/values folder and open the color.xml file if it exists otherwise right click on the values folder and click on the new -> values resource file to add new resource file.

Enter the file name as "color.xml” and press ok button.

Color.xml is a resource in which you can define color as resource that can be later use in different layout files. This is the one of the best use of resources that can use in different location that gives easy to use, update facility same as CSS (Cascade Style Sheet). Open the newly created file color.xml and add two color resources for orange and white color.

 <?xml version="1.0" encoding="utf-8"?>
 <resources>
    <color name="orange">#ff5500</color>
    <color name="white">#ffffff</color>
 </resources>

<color> element defines the color resource for the application and name attribute uniquely identifier for the resource. The value of the color resource always starts with the “#” symbol and then followed by Alpha-Red-Green-Blue information.

Add Style

Go to res/values folder and open “styles.xml” file. Add the style for heading in this file.

 <style name="heading">
        <item name="android:padding">8dp</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:textColor">#ffffff</item>
        <item name="android:textStyle">bold</item>
        <item name="android:textSize">24dp</item>
 </style>

Create a style using <style> element and set name that uniquely identifies the style. Then add <item> element for each property of that style. The name attribute of the <item> represent the style property e.g. for text color use “android:textColor”. Then set the value of that property inside the <item> element.

Add Images

Adding image resource in Android application is bit simpler than other resources. Copy the image into the Drawable folder. Android allows to adding images for different size or density of the screens. Copy the image in appropriate folder and default image should be in Drawable folder

Copy the button_bg.png image into the Drawable folder and if there is different image for different screen size then copy it into the relevant folder.

Use Resources in the Layout file

It is easy to access the resources in the XML and code file. In code file use the R class to access the resource. R class contains the static subclasses for each resource type and in that class you can get specific resource. Here is the syntax to use resource in your code file.

 [<package_name>.]R.<resource_type>.<resource_name>

<package_name> is the name of the package in which the resource is located. It is not required when referencing resources from the same package. <resource_type> is the R subclass for the resource type. <resource_name> is the name of the resource. Here are some examples to access some resources in code file

 R.color.orange
 R.style.heading
 R.string.title1

In XML file access the resource starting with at-symbol (@), then write resource type name and then write resource identifier that you need to access. Here is the syntax to reference resource in XML file.

 @[<package_name>:]<resource_type>/<resource_name>

<package_name> is the name of the package and It is not required when referencing resources from the same package. <resource_type> is the R subclass for the resource type. <resource_name> is the name of the resource. Here are some examples to access some resources

@string/title1
@color/orange
@style/heading

Open the “activity_main.xml” layout file and create linear layout. We will learn about different types of layout in Android in next chapters. Our focus here in this chapter is how to use resources in layout. Add the two linear layout and TextView inside to each layout for the two Titles. See the XML below.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="${packageName}.${activityClass}">

    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:background="@color/orange">

        <TextView
            android:text="@string/title1"
            style="@style/heading" />
    </LinearLayout>

    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:background="@drawable/button_bg"
        android:layout_marginTop="14dp">

        <TextView
            android:text="@string/title2"
            style="@style/heading" />

    </LinearLayout>

</LinearLayout>

Save the file and run the application. The output of the application will look like this

Let’s see how first title “Title 1” is being shown. Set the background of the LinearLayout by setting android:background="@color/orange” attribute in the layout XML file. Here the orange color resource is being used for the background. Set the text of the TextView from string resource using android:text="@string/title1" and set the style using style="@style/heading".

    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:background="@color/orange">

        <TextView
            android:text="@string/title1"
            style="@style/heading" />
    </LinearLayout>

In the second title the only difference is the background of the Linear Layout is image. Set image resource as a background using statement android:background="@drawable/button_bg".

    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:background="@drawable/button_bg"
        android:layout_marginTop="14dp">

        <TextView
            android:text="@string/title2"
            style="@style/heading" />

    </LinearLayout>

Download Source Code

You can get the source code. Download Source Code

;