Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube
JC Mouse Bolivia
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.

proyecto android

Herramientas

  • Android Studio

Paso 1: El proyecto

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

decbin

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

min SDK

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

blank activity

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.

view

Paso 2: Interfaz de Usuario

Nuestra interfaz tendrá la siguiente forma:

mockup android

DRAWABLE

Y los recursos que usaremos son:

ic_line_h

ic_line_v

ic_ok

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

en la misma carpeta desde Android Studiodrawable” → clic derechoNew → 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);
    }
}

Si no tenemos errores, nuestro proyecto debe lucir de la siguiente forma

proyecto free

Ejecuta y prueba.

Enjoy!!!

Tags

Si te ha gustado podrías compartirlo o dejar un comentario. ¡Muchas gracias!
Autor: JC Mouse

Yo soy yo :) JC Mouse, Soy orgullosamente boliviano soy fundador y CEO de la web jc-Mouse.net uno de las pocas web en emprendimiento y tecnología en Bolivia.

Toda la información que encuentres en este sitio es y sera completamente gratis siempre, puedes copiar, descargar y re-publicar si así lo deseas en otros blogs o sitios web, solo te pido a cambio que dejes una referencia a esta web. Esto nos ayuda a crecer y seguir aportando. Bye

Enjoy! :)

También Te Podría Interesar

MVC Java y Base de Datos Tutorial

MVC Java y Base de Datos Tutorial

En post pasados [Ejemplo práctico de MVC java Swing con Netbeans, 3 en raya java con MVC y Netbeans , MVC: Modelo, Vista...

Crear web multi-lenguaje con php

Crear web multi-lenguaje con php

En este tutorial realizaremos un proyecto web de un “sitio multi lenguaje” o “web multi idiomas”...

Hola Mundo con Firebase

Hola Mundo con Firebase

Firebase es la plataforma para el desarrollo de aplicaciones web y aplicaciones móviles de Google el cual se centra en e...

Paso de parámetros entre dos Activity

Paso de parámetros entre dos Activity

En este tutorial veremos como pasar parámetros de un activity a otro activity, no hay mucho que decir así que manos a la...

Empaquetar aplicación android para su distribución

Empaquetar aplicación android para su distribución

Cuando tenemos nuestra aplicación android terminada, lo siguiente es distribuirla ya sea en el Google Play o independien...

JSCRUM .:. Gestor de Proyectos

JSCRUM .:. Gestor de Proyectos

¿Qué es SCRUM? SCRUM es un modelo de referencia que define un conjunto de prácticas y roles, y que puede tomarse como pu...

Deja un comentario

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

*

Comparte lo que sabes

Categorias

Últimas entradas

MAUS es una aplicación para dispositivos móviles con el Sistema Operativo Android que te permite realizar exámenes desde...

En este post crearemos una aplicación en Android Studio para conectarnos con nuestra base de datos de Firebase y leer al...

Firebase es la plataforma para el desarrollo de aplicaciones web y aplicaciones móviles de Google el cual se centra en e...

Si bien se puede hacer uso de archivos de imagen (jpg, png, bmp, etc) en las aplicaciones java, también este te permite...

Android Bolivia

Bandera en Alto