Hacker News Reader- Facebook Style

In my quest to learn Android programming I joined Udacity Android Developer Nanodegree Program and it culminated in a capstone project of choice. Being a frequent visitor of Hacker News. I decided to code a hacker news reader app with the styling of Facebook newsfeed. Will showcase the app here and elaborate on the image extraction logic.

Features

The main features of the app are

• Displays the hacker news feed in Facebook style cards
• Has a detail view to show the curated content
• Dynamic card re-ordering based on ranking change at the host end
• Periodic background updates of the data so that user always gets the latest data
• Bookmark favorite news and separate view to read them
• Widgets for easier access from home screen

Demo Video (No Sound)

Extracting Image from Link

Wrote an image extraction class and dependent procedure. This parses a given link using jsoup and extracts the main image from the link and return it back. It consisted of a simple two steps:-

• A simple extraction using og metedata

public String getMainImage(){

        Elements metaImg=doc.select("meta[property=og:image]");
        Elements metaTitle=doc.select("meta[property=og:description]");
     //   System.out.println(metaImg);

        if (metaImg.toString().equals("")){
            return getImageFromBody();
        }
        else{
            return metaImg.attr("content");
        }
    }

• Can’t emphasize enough the need for metadata in all webpages. If the image was not found in the metadata then things git bit tricky
• Loop and read first 10 img tags from the page
• Then from the image tags see if any of them is of appropiate size

if (width > 300 && height>width/2) {
  return linkSt;
}else if (width > 300 && height>200){
  finalLink=linkSt;

}

• Going back to the cursor adapter if image url is found as null, then override the news tile with color and letter first name.

  if (!(imageUrl.equals("invalid")||imageUrl.equals(""))) {
      //  System.out.println(imageUrl);
        viewHolder.newsImage.setBackgroundColor(Color.WHITE);
        Picasso.with(mContext).load(imageUrl).into(viewHolder.newsImage);
        viewHolder.newsImage.setTag(imageUrl);
        viewHolder.floatingText.setText("");
    }else{
        viewHolder.floatingText.setText(title.substring(0,1));
        viewHolder.newsImage.setImageBitmap(null);
        viewHolder.newsImage.setTag("invalid");
        viewHolder.newsImage.setBackgroundColor(Color.parseColor(colors[i1]));
    }

Libraries Used

• Hacker News API
• Jsoup- To parse the weblinks and enable extraction of main image from the link.
• Picasso- For image processing in Image views.
• Okhttp- For web network calls.
• Simonvt.Schematic- For content provider setup.

Google Services Used

• GCM (Google Task Service)- For periodic task to load data and keep the app news feed updated in backend.
• Google Analytics- To measure user activity to named screens

Code can be compiled from: https://github.com/abhrajitmukherjee/Hacker-News-Reader