How To Build a Crypto History Explorer Android App - Hive Programmers

Greetings to my favorite Science Community Online, StemSocial.

It's @skyehi and in today's really special episode on my series Android App Development Tutorials for beginners, we're going to be building for the first time in the series, a crypto related App.

This tutorial is in a way dedicated to the Hive Blockchain, the community and it's token.

The reason is that Hive is a Blockchain based social media platform that has everything to do with cryptocurrency.

Original Image Source by Icons8_team from Pixabay

It has a reward system for its users by allowing curators and content creators to earn from their engagement or activities on the Blockchain.

Cryptocurrency is getting more and more popular and a lot of enthusiasts or investors always want to keep being up to date on news and stories regarding the crypto world.

The more information or knowledge you acquire about Crypto, the better you'll be at making the right crypto investment decisions and earn great incomes or profits.

This is why it's absolutely necessary to have a crypto history explorer App that provides a timeline of significant events in the crypto world.

With this App, users can also stay updated on news and stories in the crypto world.

• We're going to learn in today's tutorial or episode, how a crypto history explorer App can be developed.

I hope you're excited about this particular episode guys. Let's get started with today's work shall we

So stay tuned for more advanced and complex Android App development tutorials guys

Prerequisites

For the benefit of newcomers to Android App development or my series, I'll share with you the required softwares you need to be able to go through with this tutorial.

• Android Studio IDE - the platform on which we'll develop this and all other Android Apps.

• Java Development Kit, JDK - You need to install JDK correctly on your PC for your PC to be able to execute Java commands or codes.

• Physical Android Device or Emulator - After building the App, we'll need to test it either on an emulator or a physical Android device.

If you have all these checked out, you're absolutely ready to go through with this tutorial

Creating A New Project

To start building our Crypto History Explorer App, we need to open Android Studio application and create a new project.

So guys open the Android studio IDE and click on "Create A New Project". You'll be provided with a screen of project template options.

I'll recommend that you choose "Empty Activity" as the template of the project to jeep things simple.

When you're done with that click th3 "Next" but amd set your App name and package name.

Since we're still using Java as the programming language, please ensure that Java is selected and not Kotlin.

You can change the project configuration to suite your needs or preference.

When you're satisfied with the configuration of your project, click on the "Finish" Button to allow Android Studio to create your new App project Space.

Designing the Layout

It's now time to work in the frontend design or User Interface of our App. The crypto history explorer App would probably have news content about cryptocurrency.

These different news content would need to be displayed in the app through a scrollable RecyclerView element.

If you feel like using Cardview element for this, it's totally fine and it would look cool too

However, to keep this simple, we'll go with a simple RecyclerView.

That's basically it guys. Our Crypto History Explorer will only have to display a scrollable list of crypto related news the user can click and read.

Our User interface design code will be written inside the activity_main.xml file. So go ahead and open that file and let's start coding guys.

Here's how your layout design code should look like

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>

Create Data Model

Now since each crypto news that would be displayed inside our RecyclerView layout would need to have a title, a description and a date published, we would have to create a data Model for it.

It's very simple guys, and all you need to to is to create a new Java calss, name itCryptoEvent.java and create String variables for each data.

We're basically defining a class to represent a timeline event.

Here's how the data model class code should like

public class CryptoEvent {
    private String title;
    private String description;
    private String date;

    public CryptoEvent(String title, String description, String date) {
        this.title = title;
        this.description = description;
        this.date = date;
    }
    
    // Add getters and setters as needed
}

Implement RecyclerView Adapter

We created a RecyclerView in our design layout to display crypto news in our App.

This means we definitely have to create an adapter class that would bind the data to the layout so that we can actually see the crypto news displayed.

To do this, we need to create another Java class and name it CryptoAdapter.java .

In this Java class, we'll let CryptoAdapter extend the RecycleView and ViewHolder

Here's how your Adapter class should look like

public class CryptoAdapter extends RecyclerView.Adapter<CryptoAdapter.ViewHolder> {

    private List<CryptoEvent> events;

    public CryptoAdapter(List<CryptoEvent> events) {
        this.events = events;
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        // Define UI elements here

        public ViewHolder(View itemView) {
            super(itemView);
        }
    }

    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        // Inflate the item layout
        return null;
    }

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
        // Bind data to UI elements
    }

    @Override
    public int getItemCount() {
        return events.size();
    }
}

Initialize RecyclerView

It's now time to go into our MainActivity.java file and initialize the RecyclerView. This would ensure that our RecyclerView will actually show when the App launches.

We're going to work on the actual backend code that would fetch the crypto news content and display it inside the RecyclerView layout.

Of course right after this, we're going to open our build.gradle file and add the necessary dependencies or external libraries for crypto content and RecyclerView.

Here's how your logic code should look like in MainActivity.java

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        recyclerView = findViewById(R.id.recyclerView);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));

        CryptoAdapter adapter = new CryptoAdapter(new ArrayList<>());
        recyclerView.setAdapter(adapter);

        fetchData();
    }

    private void fetchData() {
        // Use Retrofit to fetch data from an API
        // Retrofit setup and API call code
        // Update the adapter with the fetched data
    }
}

Adding Libraries

Since we need our App to fetch crypto news and Data, we're going to need a library that offers that service.

For this project I'll choose Retrofit library.

So guys open your build.gradle file, add dependencies for RecyclerView and Retrofit.

implementation 'androidx.recyclerview:recyclerview:1.2.1'
implementation 'com.squareup.retrofit2:retrofit:2.9.0'
implementation 'com.squareup.retrofit2:converter-gson:2.9.0'

When you're done adding the dependencies, click on the Sync button and Android Studio will start downloading the library to integrate it into your project.

Fetch Data with Retrofit

In order to successfully fetch the crypto news data into our App, we're going to have to create a service interface for Retrofit.

This will be done in a separate Java Class. So we'll create a class and name it CryptoService.java.

Nothing toobcomplicated guys, all we're doing is creating an interface class for Crypto service.

Here's how the java class code should look like

public interface CryptoService {

    @GET("your_api_endpoint")
    Call<List<CryptoEvent>> getCryptoEvents();
}

Requesting Permissions

The final part of our App is to go into AndroidManifest file and request a couple of permissions.

Our Crypto History Explorer App would definitely need access to the Internet and also be able to check the network state of the Android device we'll run the App on.

So we'll have to request permission for the App to have access to internet service.

Here's how your permission request code should look like

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="your.package.name">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    (html comment removed:  Uncomment or add other necessary permissions as needed )

    <application>
        (html comment removed:  Application components and settings )
    </application>

</manifest>

Running The App

Congratulations guys, you have successfully developed your first ever Crypto History Explorer App. You can now run the App either on a physical Android Device or an emulator.

When the App launches, it should display inside a RecyclerView a list of crypto related news or content. Your Users can keep track of their crypto information now.

A Few Enhancements

I decided to briefly share with you a few things I believe you can do to really improve this particular App.

• Implement error handling and loading indicators.
• Securely store API keys if needed.
• Explore other libraries like Gson for JSON parsing.
• Other features like favorites or Bookmark

Thank you so much for taking the time to read today's blog. I hope you enjoyed the tutorial guys.

We have been able to include cryptocurrency as part of this series, I'm really proud of that.

As always, if you're having troubles installing the required softwares, writing the code, downloading the libraries or running the App, let me know in the comments.

Have A Great Day And Catch You Next Time On StemSocial. Goodbye 👨‍💻

You Can Follow Me @skyehi For More Like This And Others