¿Cómo construir una aplicación de Android Bitcoin Tracker?

En este artículo, construiremos un proyecto de aplicación Bitcoin Tracker utilizando Java y XML en Android. La aplicación mostrará las tasas actuales de Bitcoin en diferentes países utilizando la API de Bitcoin. Hay muchas API gratuitas disponibles y, para este proyecto, utilizaremos la API de Coinlayer. La API devolverá un JSON que analizaremos según nuestras necesidades. Habrá una sola actividad en esta aplicación. qué

Build a Bitcoin Tracker Android App Sample GIF

Implementación paso a paso

Paso 1: Crear un nuevo proyecto

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Tenga en cuenta que seleccione Java como lenguaje de programación.

Paso 2: antes de ir a la sección de codificación, primero debe hacer una tarea previa

Permiso: agregue permiso de Internet en el archivo AndroidManifest.xml

<usos-permiso android:name=”android.permission.INTERNET”/>

Cambie el estilo a NoActionBar en el archivo themes.xml: 

<nombre de estilo=”AppTheme” parent=”Theme.AppCompat.NoActionBar”>

Obtenga la clave API: debe crear una cuenta gratuita en Coinlayer y obtener una clave API para este proyecto.

Añadir dependencia: 

Necesitamos agregar esta dependencia en el archivo gradle de la aplicación para realizar requests HTTP

implementación ‘com.loopj.android:android-async-http:1.4.9’

Agregue la lista de divisas en string.xml:

Necesitamos agregar la lista de todas las monedas en strings.xml . Desde aquí lo mostraremos en la actividad a los usuarios. Agregue el siguiente código en el archivo strings.xml .

XML

<resources>
    <string name="app_name">Am I Rich?</string>
    <string name="label_default_text">304.74</string>
    <string name="label_error_text">Error</string>
    <string name="base">Base Currency</string>
    <string name="imageview_desc">Bitcoin Logo</string>
  
    <string-array name="currency_array">
        <item>AUD</item>
        <item>BRL</item>
        <item>CAD</item>
        <item>CNY</item>
        <item>EUR</item>
        <item>GBP</item>
        <item>HKD</item>
        <item>JPY</item>
        <item>PLN</item>
        <item>RUB</item>
        <item>SEK</item>
        <item>USD</item>
        <item>ZAR</item>
    </string-array>
      
</resources>

Paso 3: trabajar con el archivo activity_main.xml

Los códigos XML se utilizan para construir la estructura de la actividad, así como su parte de estilo. Contiene un ImageView en la parte superior de la actividad para mostrar el logotipo de la aplicación. Luego contiene un TextView para mostrar la tasa de bitcoin en el centro de la actividad. Por último, tenemos un Spinner en la parte inferior de la actividad para mostrar la lista de monedas entre las que el usuario puede elegir. Esta es una aplicación de una sola actividad. A continuación se muestra el código para el archivo activity_main.xml .

XML

<?xml version="1.0" encoding="utf-8"?>
<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"
    android:background="@color/bkgndColour"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.example.bitcointracker.MainActivity">
  
    <TextView
        android:id="@+id/priceLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/label_default_text"
        android:textColor="@color/fontColour"
        android:textSize="45sp"
        android:textStyle="bold" />
  
    <ImageView
        android:id="@+id/logoImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:contentDescription="@string/imageview_desc"
        android:src="@drawable/bitcoin_image" />
  
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/priceLabel"
        android:gravity="center_vertical|center_horizontal"
        android:orientation="horizontal">
  
        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:text="@string/base"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textSize="30sp"
            android:textStyle="bold" />
  
        <Spinner
            android:id="@+id/currency_spinner"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:dropDownSelector="@color/fontColour"
            android:gravity="center_horizontal"
            android:spinnerMode="dropdown" />
          
    </LinearLayout>
  
</RelativeLayout>

Paso 4: Crear nuevos archivos de recursos de diseño

Para que el control giratorio muestre la lista, también necesitamos crear un diseño XML del elemento del control giratorio, así como el diseño de su elemento para el adaptador. Agregue los siguientes códigos en app> res > layout > spinner_dropdown_item.xml .

XML

<?xml version="1.0" encoding="utf-8"?>
<CheckedTextView 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    style="?android:attr/spinnerDropDownItemStyle"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/listPreferredItemHeight"
    android:background="@drawable/color_selector"
    android:ellipsize="marquee"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:singleLine="true"
    android:text="@string/label_error_text"
    android:textColor="@color/black"
    android:textSize="30sp" />

archivo spinner_item.xml:

XML

<?xml version="1.0" encoding="utf-8"?>
<TextView 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="start"
    android:padding="10dip"
    android:text="@string/label_error_text"
    android:textColor="@color/black"
    android:textSize="30sp"
    android:textStyle="bold" />

Paso 5: trabajar con el archivo MainActivity.java

En el archivo java, crearemos una función que realizará requests HTTP desde la URL. La URL consistirá en la clave API, la URL base y el código de moneda de destino. Primero, crearemos un adaptador para la lista de todas las monedas y lo configuraremos en la vista Spinner en la actividad principal. Luego llamaremos a la función onItemSelectedListener y obtendremos el código de moneda seleccionado. Agregaremos este código a la URL junto con sus otras partes. Luego llamaremos a la función que hace requests HTTP para obtener un JSON . Analizaremos el objeto JSON para obtener la tasa requerida del bitcoin de la moneda seleccionada. A continuación se muestra el código del archivo MainActivity.java. Se agregan comentarios dentro del código para comprender el código con más detalle.

Java

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.TextView;
  
import androidx.appcompat.app.AppCompatActivity;
  
import com.loopj.android.http.AsyncHttpClient;
import com.loopj.android.http.JsonHttpResponseHandler;
  
import org.json.JSONException;
import org.json.JSONObject;
  
import java.io.IOException;
  
import cz.msebera.android.httpclient.Header;
  
public class MainActivity extends AppCompatActivity {
  
    // Constants:
    // TODO: Create the base URL
    private final String BASE_URL = "http://api.coinlayer.com/live?access_key=";
  
    // Member Variables:
    TextView mPriceTextView;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        mPriceTextView = (TextView) findViewById(R.id.priceLabel);
        Spinner spinner = (Spinner) findViewById(R.id.currency_spinner);
  
        // Create an ArrayAdapter using the String array and a spinner layout
        final ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this,
                R.array.currency_array, R.layout.spinner_item);
  
        // Specify the layout to use when the list of choices appears
        adapter.setDropDownViewResource(R.layout.spinner_dropdown_item);
  
        // Apply the adapter to the spinner
        spinner.setAdapter(adapter);
  
        // TODO: Set an OnItemSelected listener on the spinner
        spinner.setOnItemSelectedListener(new OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) {
                String publicKey = "cd9ebbd0c5c20340b9d638e409f41fb1";
                String finalUrl = BASE_URL + publicKey + "&TARGET=" + adapterView.getItemAtPosition(i) + "&symbols=BTC";
                Log.d("Clima", "Request fail! Status code: " + finalUrl);
                try {
                    letsDoSomeNetworking(finalUrl);
                } catch (IOException e) {
                    e.printStackTrace();
                } catch (JSONException e) {
                    e.printStackTrace();
                }
            }
  
            @Override
            public void onNothingSelected(AdapterView<?> adapterView) {
            }
        });
    }
  
    // TODO: complete the letsDoSomeNetworking() method
    private void letsDoSomeNetworking(String url) throws IOException, JSONException {
        AsyncHttpClient client = new AsyncHttpClient();
        client.get(url, new JsonHttpResponseHandler() {
  
            @Override
            public void onSuccess(int statusCode, Header[] headers, JSONObject response) {
                // called when response HTTP status is "200 OK"
                Log.d("Clima", "JSON: " + response.toString());
                try {
                    JSONObject price = response.getJSONObject("rates");
                    String object = price.getString("BTC");
                    mPriceTextView.setText(object);
                } catch (JSONException E) {
                    E.printStackTrace();
                }
            }
  
            @Override
            public void onFailure(int statusCode, Header[] headers, Throwable e, JSONObject response) {
                // called when response HTTP status is "4XX" (eg. 401, 403, 404)
                Log.d("Clima", "Request fail! Status code: " + statusCode);
                Log.d("Clima", "Fail response: " + response);
                Log.e("ERROR", e.toString());
            }
        });
    }
}

Producción:

Enlace GitHub: https://github.com/namanjha007/BitcoinTracker

Publicación traducida automáticamente

Artículo escrito por namanjha10 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *