Hi,

I am back with another update. I am thinking of one/two weekly updates instead of every alternate day as that sounds more feasible.

The DelightfullDiscoveries blog has four major categories and other minor categories of posts. The four major ones are Experiment In Kitchen, Recipes, Books, and Thoughts. The minor ones are Awards, Travel, and InANutshell. Right now we fetch all the posts irrespective of their categories and display them. But I want to group posts by their category and display them. That’s why I decided to use TabLayout with each tab displaying posts of a particular category. This led to complete overhaul of the app developed till now. And I ran into some issues, so only added four tabs for now.

Prior to any changes, the app looked like this:

 

 

activity_main.xml

 

1. If you remember from Day 2 when we added the RecyclerView to the main activity along with the ProgressBar from Day 1. Today, I moved the RecyclerView, the ProgressBar, and the TextView to another Layout file called post_list.xml with FrameLayout as the root element.
2. Changed the root layout of activity_main.xml to linear layout with the vertical orientation and added TabLayout and ViewPager.

 

Fragments and FragmentPagerAdapter

 

1. Created Four Fragment classes: EIKFragment, BooksFragment, ThoughtsFragment and AwardsFragment which extends Fragment class and implemented the onCreateView method.
2. And moved the code handling the RecyclerView, ProgressBar and the TextView from MainActivity to each fragment. So basically what MainActivity was doing before, now each of these Fragments will do the same.
3. The first difference is in the URLs to get the posts (now the posts are accessed by category). Added another method in NetworkUtils called getUrlFromCategoryId(int id) to get posts with category “id”. And call this method from the AsyncTask class’s background method.
4. Having a different Loader ID (POST_LOADER_ID) for each fragment is necessary otherwise the fragments will get confused. Suppose the loader ID is same for EIKFragment and BooksFragment, we will see EIK’s posts in BooksFragment instead of EIKFragment. EIKFragment will go into infinite loop displaying only the ProgressBar.
5. Created CategoryAdapter which extends the FragmentPagerAdapter. FragmentPagerAdapter. This makes sure that each page represents a Fragment and that Fragment’s data remains in the FragmentManager so that user can come back afterward. The drawback here is with an increase in the number of posts with each category, the amount of data to be persisted will increase for each category resulting in the use of huge memory. Later, I might switch to FragmentStatePagerAdapter which deletes the fragment as soon as we switch to another fragment saving only the necessary data.
6. Another improvement that I can do is to reuse the fragment. All the four fragments have the same code. The only difference is the loader id and the URL to access the data. I am working on that right now.

 

MainActivity

 

1. Removed the menu implementation for now. Deleted the overridden methods of interfaces  PostAdapter.PostAdapterOnClickHandler and LoaderManager.LoaderCallbacks<Post[]>.
2. Added the code to handle TabLayout and ViewPager.

 

PostDetailActivity

 

1. While going through post JSON, I found a field URL in every post. Earlier, I was passing slug and using it to create the same URL which is already present in a post. Therefore, while parsing JSON, I now fetch the URL and store along with other data in a Post object. And this URL is passed as extra data now, whenever we click on a post in the RecyclerView.
2. No need to create the URL in PostDetailsActivity now, just use the incoming URL and display it in the WebView.

 

The app looks like this now:

 

 

Files Created

 

• EIKFragment.java
• BooksFragment.java
• ThoughtsFragment.java
• AwardsFragment.java
• CategoryAdapter.java
• post_list.xml

 

Files Modified

 

• MainActivity.java
• PostDetailActivity.java
• activity_main.xml
• DDJsonUtils.java
• NetworkUtils.java

 

Today’s task took 6 Pomodoros, ie, 2 hrs, 30 minutes.

You can follow the development progress by visiting the DD Application Development Daily Progress page.

That’s all for today. See you in the next post.