The following is the first few sections of a chapter from The Busy Coder's Guide to Android Development, plus headings for the remaining major sections, to give you an idea about the content of the chapter.


Tutorial #9 - Starting Our Fragments

Much of the content of a digital book to be viewed in EmPubLite will be in the form of HTML and related assets (CSS, images, etc.). Hence, we will eventually need to render our content in a WebView widget, for best results with semi-arbitrary HTML content.

To do this, we will set up fragments for the bits of content:

Right now, we will focus on just setting up some of the basic classes for these fragments — we will load them up with content and display them over the next few tutorials.

This is a continuation of the work we did in the previous tutorial.

You can find the results of the previous tutorial and the results of this tutorial in the book’s GitHub repository:

Step #1: Create a SimpleContentFragment

Android has a WebViewFragment for the native API Level 11+ implementation of fragments, designed to show some Web content in a WebView. In this step, we will create a subclass of WebViewFragment that adds in a bit of EmPubLite-specific business logic.

Right-click over the com.commonsware.empublite package in your java/ directory and choose New > “Java Class” from the context menu. That will bring up a new-class dialog:

Android Studio New Class Dialog
Figure 254: Android Studio New Class Dialog

Fill in SimpleContentFragment for the name and android.app.Fragment for the superclass. Then, click OK to create this class.

Then, replace the contents of the fragment class with the following code:

package com.commonsware.empublite;

import android.annotation.SuppressLint;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebViewFragment;

public class SimpleContentFragment extends WebViewFragment {
  private static final String KEY_FILE="file";

  static SimpleContentFragment newInstance(String file) {
    SimpleContentFragment f=new SimpleContentFragment();

    Bundle args=new Bundle();

    args.putString(KEY_FILE, file);
    f.setArguments(args);

    return(f);
  }

  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setRetainInstance(true);
  }

  @SuppressLint("SetJavaScriptEnabled")
  @Override
  public View onCreateView(LayoutInflater inflater,
                           ViewGroup container,
                           Bundle savedInstanceState) {
    View result=
      super.onCreateView(inflater, container, savedInstanceState);

    getWebView().getSettings().setJavaScriptEnabled(true);
    getWebView().getSettings().setSupportZoom(true);
    getWebView().getSettings().setBuiltInZoomControls(true);
    getWebView().loadUrl(getPage());

    return(result);
  }

  private String getPage() {
    return(getArguments().getString(KEY_FILE));
  }
}

If you prefer, you can view this file’s contents in your Web browser via this GitHub link.

Step #2: Examining SimpleContentFragment

SimpleContentFragment is simple, with a total of four methods:

This means that anyone wanting to use SimpleContentFragment should use the factory method, to provide the path to the content to load. We will see why we implemented SimpleContentFragment this way in the next chapter.

In Our Next Episode…

The preview of this section is in an invisible, microscopic font.