Create a Live News APP in Android | In 5 Simple Steps

In this article, we are going to create a simple News App in Android. Users would be able to read live news articles from different news sources in this APP. You should have basic knowledge of Java, OPPs, Activity, Fragment, anyone networking library, Layouts, and Recycler view in order to grasp this article.

We are going to follow these 5 steps to create this App.

1. Collect news APIs.
2. Create the main Activity.
3. Create Fragments with the Tab for different news sources
4. Create a Recycler View for each Fragment to display a list of the news articles.
5. When a user clicks on a news article, redirect to the next Activity.

You can have a look at the following video to know what we are going to create by the end of this blog.

News App

Except for the first step rest of the four steps are divided into Java classes. We will discuss each step one by one.

Let’s discuss each step in detail now.

1. Collecting News APIs

Our first step is to collect news data through News APIs. As you have seen in the video I am displaying news title, author name, publish date, an image of the article, and a button (that will redirect you in the next activity) in form of recycler view (repeatable) with each fragment.

For this, we have to collect the data from the News API. And we will display this data on the UI. As you have seen above video, we are displaying the 10 news articles in 10 Tabs (each tab for one news source). For this, you have to set the API according to news sources. First, read this news API documentation and generate your API key.

I am using the below API. And you can use the below API according to your preferred news sources. You will get the list of news sources from this API.

https://newsapi.org/v2/top-headlines?sources=news-24&apiKey=(your generated api key)

Now suppose that you want to data from a news-24 news source, for this you have to pass a parameter source=news-24 in the API.

Note

To fetch data from the API, I am using the ion library. You can use any one of your choice.

When you will hit the above API that I have written, you will get the following data in the form of a list.

{
    sources:    {...},
    author:     {...},
    title:      {...},
    discription:{...},
    URL:        {...},
    urlToImage: {...},
    publishedAt:{...},
    content:    {...}
},

We will display author, title, urlToImage, publishedAt, and a Button(Read in Detail) on the screen in a form of recyclerView. URL will get used in the next activity when the user will click on the article.

For that, we will make objects of a class named modelItem that will store these data fields. And every object will be stored on the ArrayList. Look at the below modelItem class.

ModelItem

ArrayList<modelItem> items;

And items variable will store an array of objects. After that, we will set this variable in the adapter of recyclerView in each fragment.

adapter = new ItemAdapter(getActivity(), items); recyclerView.setAdapter(adapter);

And this adapter will be used in step 4 in a fragment class with a recycler view.

2. MainActivity class

In this step, we will have MainActiviy.java and activity_main.xml file by default.

In the activity_main.xml file, there will be TabLayout and ViewPager layout. ViewPager is used for the side-scrolling pages. So we can go to any news source either by clicking on the tab or by side-scrolling the pages.

activity_main.xml

MainActivity.java

In this class, we are creating an adapter of MyPagerAdapter class. this adapter will be set on the TabLayout and ViewPager.

Look at step 3 why we are creating MyPageAdapter class.

3. Create class MyPageAdapter

We will extend FragmentStatePagerAdapter class from this class because this class allows us to create multiple number of fragments. And each fragment will be attached with a Tab (source of news).

This class will provide methods to be overridden, and here we need to override getItem, getCount, and getPageTitle methods.

The getCount() method will define how many fragments we want to create and The getPageTittle() method will be used for the title in the tab. We will be using the news source name as the title. And we will call news API to get the data from a particular new source and we will store these fetched data in items variable.

The getItem() method will be used to create a fragment when the user will be clicking on a tab or side-scrolling a page, then the pointer of the program will go to the fragment class. look at below the MyPageAdapter class.

MyPageAdapter.java

4. The Fragment Class with recyclerView.

Our fragment class is responsible for loading all the data that is coming from the backend and we have already discussed how we will store backend data in the items variable which is nothing but an array of objects.

This is a normal fragment class. in this class, we will use a recyclerView. According to the news source positions, we will call those APIs and Data will be stored in items variable in the form of an object.

After that, we will make an adapter that will store items variable and their position on the screen, and this adapter will be set on the recyclerView in this fragment class. Look at the code below of fragment class.

fragment.java

When the user will click on any article, then we have to move on to the next activity with a URL.

In the method of onBindViewHolder of the recyclerView, we can get a URL of a clicked article from the items variable (this is an array list of objects). And then we will send this URL to the next activity(DetailsActivity) where this activity will load the full URL page of a clicked article. Look at the code below to understand how I am using a recyclerView as ItemAdapter class.

In the above class, the news.xml file is inflating in recycler view in onCreateViewHoder(….) method. news.xml file contains the position of each View. You can get this news.xml file from my Github repository.

5. DetailsActivity class

In DetailsActivity.java class, we have to only load an article page by using URL. This URL we will get from the intent.

You can find the full project on GitHub.

v-prashant/News_App