Join David Gassner for an in-depth discussion in this video Creating the editor activity and layout, part of Building a Note-Taking App for Android (2013).
My note taking app will require two screens. The lists screen, which I've already created, and an editor or detail screen. When the user touches one of the notes in the list, they'll be taken to the editor screen. The text value of the selected note will be displayed, the user will be allowed to edit it and when they return to the list screen, their changes will be saved automatically. To create the second screen, you'll need to create two files. A layout and a Java class. I'll start with the layout.
I'm working on a version of the project called editor activity that continues from the previous exercise. I'll go to the layout folder within the resources section. I'll right-click on that folder, and select New > Android XML File. The Resource Type is Layout. And I'll set the file name to activity_note_editor.xml. The default route element for this new layout is a linear layout. I'm instead going to choose Relative layout.
This will allow me to more easily control the positioning of the contained object. Which will simply be a text editor object. I'll click finish and that creates the XML file. I'll then double click to open the XML file if it didn't open automatically, and that opens the file. If your file opened to the graphical interface as mine did, click on the XML tab at the bottom And you'll see that the starting layout is simply a root element of a relative layout. Now go back to the graphical layout and we'll add in a text field. Click on the text field section in the palette and then click and drag a plain text text field and then drop it into the activity. Don't worry about where you're dropping it initially. Or changes positioning and size when we get back to the raw XML view. Now go back to the raw XML view, and we'll make some changes. First change the ID.
The default is edit text one. Change it to note text. That's the ID we'll use in our Java code to address this object. Next, change both the width and height from wrap content to fill_parent. That will cause the edit text object to fill all available space. Then remove both align attributes that were generated for you. You don't need those. And also, remove the margins. Now, look at the object in graphical layout.
And you'll see that the object has expanded to fill all available space. Now we'll set some attributes that are needed. Place the cursor inside the beginning tag and we'll add these attributes, set single line to false, that will make sure that the user can add multiple lines to the note, including pressing a return button to add a line feed. Next, set the gravity attribute to top. This will cause the text to start at the top of the Edit Text control, regardless of how long it is.
Next, set the inputType attribute to textMultiLine, and that's it. Your layout is complete, and you can now use this layout in an activity. The next step is to create a Java class for the new activity. Go to the Source folder in your package explorer and go to the default package, right click and select New Class. Set the name of the class to note editor activity and then set the super class to activity.
Make sure you're using the activity class in the Android.app package. Click finish, and your new class has been created. Now, before we fill in any of this code. We need to register this class with the application manifest. Go to androidmanifest.xml. You'll find it at the bottom of the package explorer. Double-click to open it. And then, click on the Android manifest.xml tab at the bottom of the editor. I’ll expand to full screen. And then we just need to add a new activity element inside the application that ensures that our new activity class is loaded with the application. Place the cursor after the end tag of the existing activity. And add a new line.
Add a new activity tag, set its name attribute to dot, and then the name of your new job of class. NoteEditorActivity. Then, complete the tag with empty tag syntax. You don't need any other attributes, also, because I put a dot before the name of the class, I didn't need to include the entire package name. You can if you want to, but it's not required as it is with the main activity.
Save your changes to the manifest and now go back to the new java class. Note editor activity. As this activity comes to the screen it has to load its layout so we'll need to create an override of the on create method. That's the method that's called automatically, as the activity appears. Place the cursor inside the class declaration, type oncreate, press CTRL Space and choose the first item in the list. And that generates the onCreate method signature. Remove the to do comment, place the cursor after the call to super.onCreate and then call setContentView.
And passing the id of your new layout. R.layout,activity_note_editor. And now the two files are bound together. The Java class, the activity is registered in the application manifest and as the activity is opened. It loads its own way out. So far this activity isn't completely integrated into the application. There's no way to go to it yet. But we'll handle that in the next video, when I describe how the navigational pattern of this application is going to work.
Like its companions, this course will take you through building a complete mobile app from scratch; but this installment uses the Android SDK and Java to get the job done. Author David Gassner shows you how to install the SDK and the Android Developer Toolkit, create a project, save data on a device, build and control screen layouts, and create action bars and icons that control navigation.
These three related courses will use the same assets to develop the same app. (See Building a Note-Taking App for iOS and Building a Note-Taking App for Windows Phone 8 and Windows Store for more information.) Compare and contrast the different steps and discover the similarities and differences!
- Previewing the note-taking app
- Creating virtual devices for testing
- Unique concepts in Android
- Creating the Eclipse project
- Using local data storage
- Adding and retrieving data with the Shared Preferences API
- Creating screen designs
- Creating and editing notes
- Supporting older versions of Android with ActionBarSherlock