Create the NodeDetailActivity user interface

This task describes how to add the NodeDetailActivity user interface elements.

In this task you will create the user interface components necessary to display the node detail information. The following pieces of information will be displayed:

Node name
Title
Description
Created by
Created at
Identifier
Type
A boolean indicating whether or not the node is a folder
A boolean indicating whether or not the node is a document

A table layout can be used with each table row containing a text view representing the label denoting the information type, for example Description, and then another text view component to represent the information's value, for example, the string representing the node's description.

In the Package Explorer expand TestApp1 and open the res folder.
In the res folder open the layout folder and double click on activity_node_detail.xml to load it into Eclipse.
If the file is displayed in Graphical Layout view, you can click the activity_node_detail.xml tab to display the actual XML.

Edit the XML to the following:

            
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:shrinkColumns="1"
    tools:context=".NodeDetailActivity" >

    <TableRow>

        <TextView android:text="@string/node_name" />

        <TextView android:id="@+id/node_name_value" />
    </TableRow>

    <TableRow>

        <TextView android:text="@string/node_title" />

        <TextView android:id="@+id/node_title_value" />
    </TableRow>

    <TableRow>

        <TextView
            android:text="@string/node_description" />
    
        <TextView 
            android:id="@+id/node_description_value" />
    </TableRow>

    <TableRow>

        <TextView android:text="@string/node_created_by" />

        <TextView android:id="@+id/node_created_by_value" />
    </TableRow>

    <TableRow>

        <TextView android:text="@string/node_created_at" />

        <TextView android:id="@+id/node_created_at_value" />
    </TableRow>

    <TableRow>

        <TextView android:text="@string/node_identifier" />

        <TextView android:id="@+id/node_identifier_value" />
    </TableRow>

    <TableRow>

        <TextView android:text="@string/node_type" />

        <TextView android:id="@+id/node_type_value" />
    </TableRow>

    <TableRow>

        <TextView android:text="@string/node_is_folder" />

        <TextView android:id="@+id/node_is_folder_value" />
    </TableRow>

    <TableRow>

        <TextView android:text="@string/node_is_document" />

        <TextView android:id="@+id/node_is_document_value" />
    </TableRow>

</TableLayout>

Attention: You will have a number of errors as you also need to add the string resources into your project. You will do that next.

In the Package Explorer expand the res folder and then expand the values folder.
Double click on the file strings.xml in the values folder to load the XML file into Eclipse.

Add the following string resources:

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

    <string name="app_name">TestApp1</string>
    <string name="menu_settings">Settings</string>
    <string name="action_settings">Settings</string>
    <string name="title_activity_node_detail">NodeDetailActivity</string>
    <string name="node_name">Name:</string>
    <string name="node_title">Title:</string>
    <string name="node_description">Description:</string>
    <string name="node_created_by">Created By:</string>
    <string name="node_created_at">Created At:</string>
    <string name="node_identifier">Identifier:</string>
    <string name="node_type">Type:</string>
    <string name="node_is_folder">isFolder:</string>
    <string name="node_is_document">isDocument:</string>
    
</resources>

You have now added the necessary user interface to display the node's details in the NodeDetailActivity activity.

Search form

Search form

You are here

Create the NodeDetailActivity user interface