Magic Button, es un botón animado para android bajo licencia del MIT desarrollado por Bloder (Brasil), el proyecto esta disponible en GitHub.
A continuación, implementaremos este Magic Button en un proyecto de Android Studio.
Partimos de un proyecto vacío con las siguientes características:
Paso 1. Gradle
Abrimos el archivo build.gradle (Module: App) y agregamos :
compile ‘com.github.bloder:magic:1.1’
a la sección de dependencias, es decir:
Paso 2. Layout
El código XML del botón mágico es el siguiente:
<br.com.bloder.magic.view.MagicButton android:id="@+id/magic_button" android:layout_width="wrap_content" android:layout_height="wrap_content" app:magic_button_size="50dp" app:button_icon="@drawable/your_icon" app:button_icon_width="25dp" app:button_icon_height="25dp" app:hide_text="Hi Mom!" app:hide_text_size="15dp" app:hide_text_color="@android:color/black" app:icon_button_color="button_icon_color" app:expandable_area_color="that_expandable_button_part_color"/>
Este código lo agregamos en el layout donde queramos mostrar el botón, para nuestro ejemplo:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" 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" tools:context="org.example.botonmagico.MainActivity"> <br.com.bloder.magic.view.MagicButton android:id="@+id/magic_button" android:layout_width="wrap_content" android:layout_height="wrap_content" app:magic_button_size="50dp" app:button_icon="@drawable/ic_launcher" app:button_icon_width="25dp" app:button_icon_height="25dp" app:hide_text="Hola Mundo!" app:hide_text_size="8dp" app:hide_text_color="@android:color/white" app:icon_button_color="#ff0000" app:expandable_area_color="#9c0000"/> </RelativeLayout>
Modificamos los valores a nuestro gusto, usaremos tambien el icono por defecto de android ic_launcher
Paso 3: Código
De nada nos sirve un botón si no podemos ejecutar una acción al presionarlo, para ello, modificamos nuestro clase MainActivity de la siguiente manera:
package org.example.botonmagico; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; public class MainActivity extends AppCompatActivity { private br.com.bloder.magic.view.MagicButton magicButton; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); magicButton = (br.com.bloder.magic.view.MagicButton) findViewById(R.id.magic_button); magicButton.setMagicButtonClickListener(new View.OnClickListener() { @Override public void onClick(View v) { //Codigo a ejecutar } }); } }
Y nuestro resultado
En este tutorial crearemos shapes en tiempo de ejecución y ademas les daremos un poco de movimiento. Para realizar corre[...]
Driver.js es una librería Open Source de JavaScript ligera y altamente personalizable, esta escrita en TypeScript no tie[...]
Desde que Google anuncio de que dejara de dar soporte al plugin de Eclipse y se concentrara en Android Studio, quienes t[...]
El IDE Netbeans al igual que Eclipse :), nos permite personalizar el espacio de trabajo y añadir funcionalidades que nos[...]
En este segundo post sobre Android y SQLite, veremos el uso de los métodos de gestión de base de datos más utilizados, e[...]
Cuando se inicia el aprendizaje de un lenguaje de programación, nunca debe faltar el clásico «Hola Mundo» 🙂 en Android n[...]
