Blog para desarrollo de aplicaciones en Android, aprende paso a paso como crear aplicaciones.

Usamos cookies propias y de terceros que entre otras cosas recogen datos sobre sus hábitos de navegación para mostrarle publicidad personalizada y realizar análisis de uso de nuestro sitio.
Si continúa navegando consideramos que acepta su uso. OK Más información | Y más

Como crear un Toast Custom ImageButton en Android

Android Toast Custom ImageButton Example


Hola amigos continuamos aprendiendo y en esta ocasión vamos a personalizar un Toast para mostrar mejor los mensajes utilizando un TextView y un ImageButton para
Android Studio - Toast Custom ImageButton

Crear Proyecto Android Toast Custom ImageButton Tutorial

Crearemos nuestro proyecto para desarrollar el ejemplo de nuestros mensajes Toast personalizados con ImageButton.
Android Studio - Toast Custom ImageButton

Diseño Toast Custom ImageButton Tutorial

Ahora vamos a crear el diseño de nuestra aplicación para ello vamos a crear una forma. (Shape) para dar un mejor estilo a nuestros mensajes Toast personalizados.
Android Studio - Toast Custom ImageButton
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<stroke
android:width="2dp"
android:color="#075F6B" />
<solid android:color="#fff"></solid>
<padding
android:bottom="2dp"
android:left="20dp"
android:right="20dp"
android:top="2dp" />
<corners android:radius="5dp" />
</shape>

Añadiremos el siguiente directorio.
Android Studio - Toast Custom ImageButton
Android Studio - Toast Custom ImageButton
Ahora crearmos nuestro toast_imageview.xml para nuestros mensajes Toast.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/style_toast_image"
android:orientation="horizontal"
android:padding="5dp">

<TextView
android:id="@+id/toast_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textColor="#000"
android:textStyle="bold"

android:layout_weight="1"/>
<ImageButton
android:id="@+id/toast_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="0"
android:background="#31708f"
android:padding="5dp" />
</LinearLayout>
Y ahora en nuestro activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
tools:context=".MainActivity">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Código MainActivity Toast Custom ImageButton Tutorial


Crearemos nuestra clase para personalizar nuestros mensajes Toast de la siguiente manera.

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Color;
import android.util.Log;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageButton;
import android.widget.TextView;
import android.widget.Toast;

public class message_toast_image {

public static void msgBoxToast(Context context, String text, String icon) {
try {
LayoutInflater inflater = LayoutInflater.from(context);
@SuppressLint("ResourceType") View layout = inflater.inflate(R.xml.toast_imageview, null);
//ImageView image = (ImageView) layout.findViewById(R.id.toast_image);
ImageButton image = (ImageButton)layout.findViewById(R.id.toast_icon);

if(icon.toUpperCase().equals("INFO")){
image.setImageResource(R.mipmap.ic_information);
}
// else if(icon.toUpperCase().equals("SUCCESS")){
// image.setImageResource(R.mipmap.alert_success);
// image.setBackgroundColor(Color.parseColor("#3c763d"));
// }else if(icon.toUpperCase().equals("WARNING")){
// image.setImageResource(R.mipmap.alert_warning);
// image.setBackgroundColor(Color.parseColor("#8a6d3b"));
// }else if(icon.toUpperCase().equals("ERROR")){
// image.setImageResource(R.mipmap.alert_error);
// image.setBackgroundColor(Color.parseColor("#a94442"));
// }

TextView textV = (TextView) layout.findViewById(R.id.toast_text);
textV.setText(text);

Toast toast = new Toast(context);
toast.setGravity(Gravity.CENTER, 0, 0);
toast.setDuration(Toast.LENGTH_LONG); //? Toast.LENGTH_LONG : Toast.LENGTH_SHORT);
toast.setView(layout);
toast.show();
}catch (Exception e){
Log.e("Error",e.getMessage());
}
}
}

Nuestro MainActivity escribiremos lo siguiente.

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import static com.hn.universoandroid.android_toast_custom.message_toast_image.msgBoxToast;

public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

msgBoxToast(MainActivity.this,"Mensaje Informativo","INFO");
}
}
Ahora añadiremos varias imagenes para nuestros mensajes Toast.





Crear Emualdor AVD Toast Custom ImageButton 


Crearemos nuestro emulador para ver nuestra aplicación en ejecución. Y obtendremos un mensaje de la siguiente forma.

Android Studio - Toast Custom ImageButton

Curso Kotlin Español

No hay comentarios:

Publicar un comentario

x

Registrate!

Curso Android Español

Curso Kotlin Español

eBook Free Android Studio

Noticias y Eventos

¡Directamente a tu INBOX!

Le enviaremos nuestros recursos gratis. Para obtener nuestro contenido nuevo, únase a nuestra comunidad. No te molestaremos enviando información inútil. ¡No te pierdas ninguna actualización, mantente conectado! Recuerda verificar tu correo electronico.

Ingrese su dirección de correo electrónico:

Entregado por FeedBurner