Hacker News Reader- Facebook Style

Fork me on GitHub

App Mobile Main Image

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.


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)

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();
            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){

  • 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);

Widget Screenshot

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

comments powered by Disqus