Objectives

1. Android Boot Camp for Developers Using Java, Comprehensive: A Guide to Creating Your First Android Apps Chapter 9: Customize! Navigating with a Master/Detail Flow Activity on a Tablet Android Boot Camp for Developers Using Java, 2nd Ed.

2. Objectives In this chapter, you learn to: • Understand responsive design for Android apps • Create an Android tablet project using an application template • Understand the Master/Detail Flow template • Modify the Master/Detail Flow template • Add a WebView widget Android Boot Camp for Developers Using Java, 2nd Ed.

3. Objectives (continued) • Display a Web browser within a tablet app • Add an Internet permission to the Android Manifest • Customize the content of the sample template file • Display a custom layout in the details pane Android Boot Camp for Developers Using Java, 2nd Ed.

4. Understanding Responsive Design • Responsive design • Anapproach to designing apps and Web sites that provide an optimal viewing experience across as many devices as possible Android Boot Camp for Developers Using Java, 2nd Ed.

5. Using Application Templates • Application templates • Used to create basic Android applications that can immediately be run and test on an Android device of any size • Android templates are available when you create a new Android project Android Boot Camp for Developers Using Java, 2nd Ed.

6. Using Application Templates (Continued) Understanding the Structure of the Master/Detail Flow Template • Several Java and XML layout resource files have been created automatically Android Boot Camp for Developers Using Java, 2nd Ed.

7. Using Application Templates (Continued) SRC Files • ItemDetailActivity.java • The purpose of this class is to display the activity_item_detail.xml layout file if a smartphone is detected • ItemDetailFragment.java • The purpose of this class is to display the fragment_item_detail.xml layout file • ItemListActivity.java • The purpose of this initial Activity is to display the master list in a two-pane mode if a tablet device is detected or to launch a second Activity to display the detailed items if a smaller device is detected • ItemListFragment.java • The purpose of this class is to display the activity_item_list.xml layout file • DummyContent.java • The purpose of this Java file is to provide sample code you customize to suit your specific app content. Android Boot Camp for Developers Using Java, 2nd Ed.

8. Using Application Templates (Continued) Layout Files • activity_item_detail.xml • When a smartphone is detected, the app uses this layout to display the FrameLayout instance • activity_item_list.xml • When a smartphone is detected, the app uses this layout to display the master list fragment • activity_item_twopane.xml • When a tablet is detected, the app is displayed in a two-pane layout containing both the master item list fragment and the item detail container • fragment_item_detail.xml • When a smartphone or a tablet is detected, this layout file displays the detail pane using the onCreateView( ) method Android Boot Camp for Developers Using Java, 2nd Ed.

9. Using Application Templates (Continued) • Adding Images to the Drawable Folder • If necessary, expand the src and layout folders in the Package Explorer • Drag the image files to the drawable-hdpi folder until a plus sign pointer appears Android Boot Camp for Developers Using Java, 2nd Ed.

10. Designing an XML TableLayout • The Strings table is responsible for the text displayed in the app • The first string is displayed in the title bar of the tablet, and the second string is displayed in the title bar of a smaller device such as a smartphone Android Boot Camp for Developers Using Java, 2nd Ed.

11. Designing an XML TableLayout (continued) Android Boot Camp for Developers Using Java, 2nd Ed.

12. Designing an XML TableLayout (continued) Android Boot Camp for Developers Using Java, 2nd Ed.

13. Designing an XML TableLayout (continued) Android Boot Camp for Developers Using Java, 2nd Ed.

14. Creating a TextView XML Layout for the Second List Item Android Boot Camp for Developers Using Java, 2nd Ed.

15. Creating a WebView XML Layout for the Third List Item • Webview • A View widget object that displays Web pages • Permission • A restriction limiting access to a part of the code or to data on the device Code Syntax android:permission="android.permission.INTERNET" Android Boot Camp for Developers Using Java, 2nd Ed.

16. Creating a WebView XML Layout for the Third List Item (continued) Android Boot Camp for Developers Using Java, 2nd Ed.

17. Creating a WebView XML Layout for the Third List Item (continued) Android Boot Camp for Developers Using Java, 2nd Ed.

18. Creating a WebView XML Layout for the Third List Item (continued) • A fragment is a piece of an application’s user interface or behavior that can be placed in an Activity • Fragments are essentially a sub-Activity hosted inside another Activity • To determine if two String objects match exactly: • Use the .equals method, and not the == operator • The == operator compares if two objects are exactly the same object. • Two strings may be different objects, but have the same exact characters • The .equals() method is used to compare strings for equality Android Boot Camp for Developers Using Java, 2nd Ed.

19. Creating a WebView XML Layout for the Third List Item (continued) Android Boot Camp for Developers Using Java, 2nd Ed.

20. Creating a WebView XML Layout for the Third List Item (continued) Android Boot Camp for Developers Using Java, 2nd Ed.

21. Running and Testing the Application • Tap or click Run on the menu bar • Select Android Application from the dialog box • Save all the files when prompted • Unlock the emulator (if necessary) • Test each tab to ensure it works as intended • You must have Internet connectivity to open the Web page and enough memory available to handle the app connection to the Web Android Boot Camp for Developers Using Java, 2nd Ed.

22. Summary • Responsive design is an approach to designing apps and Web sites that provide an optimal viewing experience across as many devices as possible • Android templates are available when you create a new Android project and are used to create basic Android applications that you can run and test on an Android device of any size • A tablet app created with the Master/Detail Flow template displays a Master list of items in a narrow vertical pane along the left edge of the screen • To display the detail content for the first list item in the Bike and Barge app, you provide images and text descriptions in an XML TableLayout. Each row in the TableLayout displays an ImageView and TextView control Android Boot Camp for Developers Using Java, 2nd Ed.

23. Summary (continued) • To display the detail content for the second list item, you code two TextView controls in a Linear layout that include the tour details • To display the detail content for the third list item, you customize the default fragment_item_detail.xml layout to use a WebView object instead of a TextView object • After including a WebView object in the XML layout of an app, you must add the INTERNET permissions to the Android Manifest file so the app can access the Internet and load Web pages Android Boot Camp for Developers Using Java, 2nd Ed.

24. Summary (continued) • To associate the content displayed in the detail pane with each list item in the left pane, you customize the DummyContent.java class file by adding code to the addItem statement so it references three String objects: the id, the item list string, and the Web site URL • To handle the responses to user selections, you add conditional statements to the ItemDetailFragment.java file Android Boot Camp for Developers Using Java, 2nd Ed.