Index / Android / Conversor decimal a binario

Conversor decimal a binario

Autor jc mouse jueves, enero 28, 2016

Desde que Google anuncio de que dejara de dar soporte al plugin de Eclipse y se concentrara en Android Studio, quienes trabajábamos con el viejo Eclipse nos vimos forzados a migrar al mejorado Android Studio, pero el cambio no fue para mal y nada traumático, el IDE de Google trae consigo muchas mejoras en comparación con Eclipse y deja a este como un Notepad para Android (sin animo de ofender a los eclipseros – Notepad es poderoso en las manos correctas), en lo personal veo a Android Studio muchísimo más manejable que Eclipse, y encuentro muchas más semejanzas en su manejo con Netbeans y Visual Studio.

Si bien cuenta con herramientas de migración entre Eclipse y Android Studio, no son del todo correctas por lo que es mejor migrar manualmente los proyectos, más trabajo si, pero se aprende en el proceso 🙂

A continuación y para salir de la típica calculadora 🙂 un tutorial para crear un conversor de números decimales a binarios. El rango de conversión estará limitado a números entre el 1 y 255.

Herramientas

Android Studio

Paso 1: El proyecto

Crea un nuevo proyecto el nombre sera “DecBin255“, presiona el botón “Next”

En la siguiente ventana, elegiremos el tipo de dispositivo donde correrá nuestra aplicación, seleccionamos “Phone and Tablet” y también el SDK mínimo, elegiremos el API 16 para abarcar la mayor cantidad de dispositivos móviles. Presionamos “Next”

A continuación seleccionamos una plantilla para la actividad, seleccionamos “Blank Activity“, presionamos “Next”

Ya para terminar, debemos indicar el nombre para la activity y el layout, esta aplicación solo tiene una actividad por lo cual dejaremos con los nombres q tiene por defecto. Presionamos “Finish” para crear el proyecto.

Paso 2: Interfaz de Usuario

Nuestra interfaz tendrá la siguiente forma:

DRAWABLE

Y los recursos que usaremos son:

estas imágenes deben ir en la carpeta “drawable” (es decir: DecBin255\app\src\main\res\drawable)

en la misma carpeta desde Android Studio “drawable” → clic derecho → New → Drawable Resorce File y en File Name escribe “text_border“, OK para crear el archivo, reemplaza el contenido por:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#ffffff" />
    <stroke android:width="1dip" android:color="#ff9900" />
</shape>

Este código es para dar un borde al edittext.

LAYOUT

Clic derecho sobre “layout” → New → Layout Resorce File y en File Name escribe: “row_header” y reemplaza el código por:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:gravity="center_horizontal|center_vertical|clip_vertical|fill_vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <EditText
            android:id="@+id/tvIA"
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:clickable="false"
            android:cursorVisible="false"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:gravity="right"
            android:paddingLeft="8dp"
            android:paddingRight="8dp"
            android:paddingTop="4dp"
            android:paddingBottom="4dp"
            android:background="#00000000"
            android:inputType="numberDecimal" />

        <ImageView
            android:contentDescription=""
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:scaleType="fitXY"
            android:src="@drawable/ic_line_v" />


        <EditText
            android:id="@+id/tvIB"
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:clickable="false"
            android:cursorVisible="false"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:gravity="left"
            android:paddingLeft="8dp"
            android:paddingRight="8dp"
            android:paddingTop="4dp"
            android:paddingBottom="4dp"
            android:background="#00000000"
            android:inputType="numberDecimal" />

    </LinearLayout>

    <ImageView
        android:contentDescription=""
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scaleType="fitXY"
        android:src="@drawable/ic_line_h" />

</LinearLayout>

Clic derecho sobre “layout” → New → Layout Resorce File y en File Name escribe: “row” y reemplaza el código por:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:gravity="center_horizontal|center_vertical|clip_vertical|fill_vertical"
    android:layout_height="match_parent">

    <EditText
        android:id="@+id/tvA"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:clickable="false"
        android:cursorVisible="false"
        android:focusable="false"
        android:focusableInTouchMode="false"
        android:gravity="right"
        android:paddingLeft="8dp"
        android:paddingRight="8dp"
        android:paddingTop="4dp"
        android:paddingBottom="4dp"
        android:background="#00000000"
        android:inputType="numberDecimal" />

    <ImageView
        android:contentDescription="0"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/ic_line_v" />


    <EditText
        android:id="@+id/tvB"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:clickable="false"
        android:cursorVisible="false"
        android:focusable="false"
        android:focusableInTouchMode="false"
        android:gravity="left"
        android:paddingLeft="8dp"
        android:paddingRight="8dp"
        android:paddingTop="4dp"
        android:paddingBottom="4dp"
        android:background="#00000000"
        android:inputType="numberDecimal" />

</LinearLayout>

Clic derecho sobre “layout” → New → Layout Resorce File y en File Name escribe: “row_result” y reemplaza el código por:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:gravity="center_horizontal|center_vertical|clip_vertical|fill_vertical"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/tvResDec"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="en binario se escribe" />

    <TextView
        android:id="@+id/tvResBin"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</LinearLayout>

abre el archivo “content_main.xml” y reemplaza el código por:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="android.bolivia.decbin255.MainActivity"
    tools:showIn="@layout/activity_main">


    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">

        <EditText
            android:id="@+id/DecNum"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="number|text"
            android:gravity="center"
            android:textSize="22sp"
            android:ems="10"
            android:background="@drawable/text_border"
            android:hint="Escribe un número de 1 a 255"
            android:paddingTop="12dp"
            android:paddingBottom="12dp"
            android:layout_marginBottom="16dp"
            android:layout_gravity="center_horizontal" />

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <LinearLayout
                android:id="@+id/lyTable"
                android:orientation="vertical"
                android:layout_width="match_parent"
                android:layout_height="match_parent"></LinearLayout>
        </ScrollView>
    </LinearLayout>
</RelativeLayout>

para terminar con la interfaz, debemos cambiar el icono del botón flotante, abre el archivo “activity_main.xml” y busca “android.support.design.widget.FloatingActionButton” , cambia el android:src=”@android:drawable/ic_dialog_email” por android:src=”@drawable/ic_ok”

Paso 3: Código java

Abre el archivo “MainActivity.java” y reemplaza por:

package android.bolivia.decbin255;

import android.content.Context;
import android.content.res.ColorStateList;
import android.graphics.Color;
import android.graphics.Typeface;
import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.text.InputFilter;
import android.text.Spanned;
import android.view.View;
import android.view.Menu;
import android.view.MenuItem;
import android.view.inputmethod.InputMethodManager;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    private EditText DecNum;
    private LinearLayout lyTable;
    private FloatingActionButton fab;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        //
        DecNum = ((EditText)findViewById(R.id.DecNum));
        lyTable= ((LinearLayout)findViewById(R.id.lyTable));

        //cambiamos el color del boton flotante
        fab = ((FloatingActionButton)findViewById(R.id.fab));
        fab.setBackgroundTintList(new ColorStateList(new int[][]{new int[]{0}}, new int[]{Color.BLUE}));

        //Solo se permiten digitos del 0-9
        DecNum.setFilters(new InputFilter[] {
                new InputFilter() {
                    String numericCharacters = "0123456789";
                    @Override
                    public CharSequence filter(CharSequence source, int start, int end, Spanned dest, int dstart, int dend) {
                        if (source != null && !numericCharacters.contains((source.toString()))) {
                            return "";
                        }
                        return null;
                    }
                }
        });
        //

        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if(DecNum.getText().toString().length()>0){
                    int num = Integer.valueOf(DecNum.getText().toString());
                    if(num<=255 && num > 0){
                        convertDecimalToBinary(num);
                        //oculta keyboard
                        InputMethodManager imm = (InputMethodManager)getSystemService(Context.INPUT_METHOD_SERVICE);
                        imm.hideSoftInputFromWindow(view.getWindowToken(), 0);
                    }else{
                        Toast.makeText(MainActivity.this, "Solo números del 1 al 255",Toast.LENGTH_SHORT).show();
                    }
                }else{
                    Toast.makeText(MainActivity.this, "Debe escribir un número",Toast.LENGTH_SHORT).show();
                }
            }
        });

    }//onCreate:end

    /**
     * Metodo privado que convierte un numero decimal a binario mediante divisiones sucesivas
     * @param num
     * */
    public void convertDecimalToBinary(int num){

        String strBinaryNumber = "";
        String strDecimalNumber = num+"";
        lyTable.removeAllViews();//limpia layout

        //header
        LinearLayout lyIndex = (LinearLayout)getLayoutInflater().inflate(R.layout.row_header, null);
        EditText tvIA = (EditText) lyIndex.findViewById(R.id.tvIA);
        tvIA.setText(""+num);
        tvIA.setTextColor(Color.rgb(176,0,0));
        tvIA.setTypeface(null, Typeface.BOLD);
        EditText tvIB = (EditText) lyIndex.findViewById(R.id.tvIB);
        tvIB.setText("2");
        tvIB.setTextColor(Color.rgb(176,0,0));
        tvIB.setTypeface(null, Typeface.BOLD);
        lyTable.addView(lyIndex);

        //
        while(num>0){

            int quotient = num/2;//cociente
            int remainder = num%2;//residuo
            num = quotient;

            LinearLayout lyItems = (LinearLayout)getLayoutInflater().inflate(R.layout.row, null);
            EditText tvA = (EditText) lyItems.findViewById(R.id.tvA);
            EditText tvB = (EditText) lyItems.findViewById(R.id.tvB);

            if(quotient>0){
                tvA.setText(""+quotient);
                tvB.setText(""+remainder);
            }else{
                tvA.setText("");
                tvB.setTextColor(Color.rgb(176, 0, 0));
                tvB.setText(""+remainder);
            }
            strBinaryNumber += remainder;
            lyTable.addView(lyItems);

        }
        //resultado
        strBinaryNumber = new StringBuilder(strBinaryNumber).reverse().toString();
        LinearLayout lyRes = (LinearLayout)getLayoutInflater().inflate(R.layout.row_result, null);
        TextView tvResDec = (TextView) lyRes.findViewById(R.id.tvResDec);
        TextView tvResBin = (TextView) lyRes.findViewById(R.id.tvResBin);
        tvResDec.setText(strDecimalNumber);
        tvResBin.setText(strBinaryNumber);
        lyTable.addView(lyRes);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}