Se sabe que muchas de las aplicaciones de Android que se han instalado en el teléfono contienen widgets. Los ejemplos más comunes son el widget Calendario y Reloj. Entonces, ¿qué son estos widgets? Los widgets son solo una miniaplicación que se encuentra en la pantalla de inicio y, aparte de los pequeños íconos del iniciador, que normalmente aparecen en la pantalla de inicio. Los widgets ocupan más espacio y muestran información actualizada de la aplicación. Algunos de ellos también son redimensionables por el usuario. El caso de uso más común del widget es para iniciar la aplicación o alguna actividad específica de la misma.
Un widget es básicamente un mensaje de difusión que se comunica con la aplicación mediante un receptor, por lo que también debe incluirlo en su archivo de manifiesto. Esto parece ser mucho trabajo, gracias a Android Studio puede hacerlo todo por nosotros. Entonces, simplemente vaya a Android Studio, haga clic en aplicación->Nuevo->Widget->AppWidget . Asígnele un nombre y habrá terminado de configurar el widget. Incluso puede verificar que después de la instalación tendrá su propio widget con un Simple TextView.
Ahora, después de una breve explicación de qué es un widget, profundicemos en cómo crearlo. Hay tres pasos para configurar un widget de su aplicación.
- Paso 1: una WidgetProviderClass, por ejemplo, MyWidget, que amplía la clase AppWidgetProvider.
- Paso 2: un WidgetProviderInfo, que es un XML que describe los metadatos del widget, incluida información como la altura y el ancho mínimos.
- Paso 3: un archivo de diseño de widget que describirá cómo se ve su widget, pero tiene limitaciones de otros archivos de diseño.
Archivo de actividad principal
Ahora vamos a crear nuestro propio widget personalizado que requiere codificación ahora. Cree un archivo MainActivity.xml en la carpeta Diseño del directorio res de la siguiente manera que contenga una vista de lista.
XML
<--!MainActivity.xml--> <androidx.constraintlayout.widget.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"> <!--List view to display all food items--> <ListView android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/recipes" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
- Ahora cree un archivo java inicializando todas las vistas y configurando Listview, también llenándolo con elementos.
- Nombre el archivo Java como MainActivity.Java .
Java
import android.appwidget.AppWidgetManager;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import java.util.ArrayList;
public class DetailsActivity extends AppCompatActivity {
TextView name, content;
ImageView addToWidget;
boolean added = false;
// Take your steps of food processing as String variables
// recipe1 and recipe2.
private String recipe1
= "Step1: Take a Lemon and required no of glasses of water" +
"Step2: Squeeze out the lemon juice into glasses,stir well" +
"and put iceCubes before serve";
private String recipe2
= "Step1: Take a bread and apply some butter on it" +
"Step2:Put it in the toaster and it is ready";
ArrayList<String> steps = new ArrayList<String>();
public static Recipe recipe;
AppWidgetManager appWidgetManager;
int appWidgetId;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// attach xml file for detailsActivity,that will
// show detail of every food item
setContentView(R.layout.activity_details);
// Add Steps into step ArrayList
steps.add(recipe1);
steps.add(recipe2);
addToWidget = findViewById(R.id.addToWidget);
// AppWidgetManager manages creating and updating
// the multiple widgets an application can have.
appWidgetManager = AppWidgetManager.getInstance(
DetailsActivity.this);
appWidgetId = 1;
// Each AppWidget has a different appWidgetId to
// make it unique.
name = findViewById(R.id.name);
content = findViewById(R.id.steps);
final String heading
= getIntent().getStringExtra("name");
final int pos = getIntent().getIntExtra("pos", -1);
recipe = new Recipe(heading, steps.get(pos));
name.setText(heading);
content.setText(steps.get(pos));
// Attach clickListener on ImageView Object so when
// we will click it will handle the widget adding
// code.
addToWidget.setOnClickListener(
new View.OnClickListener() {
@Override public void onClick(View view)
{
added
= !added; // boolean variable to
// know the state ,if
// widget is added or not.
Toast
.makeText(DetailsActivity.this,
"Click",
Toast.LENGTH_SHORT)
.show();
if (added) {
// Calling updateAppWidget static
// method of RecipeWidget to update
// widgets of app
RecipeWidget.updateAppWidget(
DetailsActivity.this,
appWidgetManager, appWidgetId,
recipe);
Toast
.makeText(DetailsActivity.this,
"Added to Widget",
Toast.LENGTH_SHORT)
.show();
addToWidget.setImageDrawable(
getResources().getDrawable(
R.drawable.add_widget));
}
else {
addToWidget.setImageDrawable(
getResources().getDrawable(
R.drawable.not_widget));
RecipeWidget.updateAppWidget(
DetailsActivity.this,
appWidgetManager, appWidgetId,
null);
}
}
});
}
// This method was created to pass Recipe object
// information to AppWidget.
public static Recipe getRecipe() { return recipe; }
}
Producción:
DetallesArchivo de actividad
Ahora, hemos agregado dos elementos a nuestra lista de recetas y cada elemento contiene un clicklistener adjunto que navegaría a DetailsActivity.java con la información deseada pasando por la intención. El siguiente es el diseño de DetailsActivity.xml que contiene dos vistas de texto y un botón AddWidget (ImageView).
XML
<--!DetailsActivity.xml> <?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.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=".DetailsActivity"> <!--A Textview to display name of food--> <TextView android:id="@+id/name" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="16dp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHorizontal_bias="0.0" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent"/> <!--A ImageView to let user add a widget by clicking on it --> <ImageView android:id="@+id/addToWidget" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:clickable="true" android:contentDescription="@string/addtowidget" android:focusable="true" android:src="@drawable/not_widget" app:layout_constraintBottom_toTopOf="@+id/steps" app:layout_constraintStart_toStartOf="parent"/> <!--A TextView to show steps --> <TextView android:id="@+id/steps" android:layout_width="match_parent" android:layout_height="wrap_content" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintHorizontal_bias="0.0" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/name" app:layout_constraintVertical_bias="0.158"/> </androidx.constraintlayout.widget.ConstraintLayout>
- Cree una instancia del objeto AppWidgetManager .
- Dale una identificación, es decir , AppWidgetId , para que sea único.
- Use la aplicación->nuevo->recurso vectorial->seleccione un dibujo que desee que su imagen muestre como si hubiéramos elegido el vector estrella ( R.drawable.addToWidget ).
Java
import android.appwidget.AppWidgetManager;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import java.util.ArrayList;
public class DetailsActivity extends AppCompatActivity {
TextView name, content;
ImageView addToWidget;
boolean added = false;
// Take your steps of food processing as String variables
// recipe1 and recipe2.
private String recipe1
= "Step1: Take a Lemon and required no of glasses of water" +
"Step2: Squeeze out the lemon juice into glasses,stir well" +
"and put iceCubes before serve";
private String recipe2
= "Step1: Take a bread and apply some butter on it" +
"Step2:Put it in the toaster and it is ready";
ArrayList<String> steps = new ArrayList<String>();
public static Recipe recipe;
AppWidgetManager appWidgetManager;
int appWidgetId;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// attach xml file for detailsActivity,that will
// show detail of every food item
setContentView(R.layout.activity_details);
// Add Steps into step ArrayList
steps.add(recipe1);
steps.add(recipe2);
addToWidget = findViewById(R.id.addToWidget);
// AppWidgetManager manages creating and updating
// the multiple widgets an application can have.
appWidgetManager = AppWidgetManager.getInstance(
DetailsActivity.this);
appWidgetId = 1;
// Each AppWidget has a different appWidgetId to
// make it unique.
name = findViewById(R.id.name);
content = findViewById(R.id.steps);
final String heading
= getIntent().getStringExtra("name");
final int pos = getIntent().getIntExtra("pos", -1);
recipe = new Recipe(heading, steps.get(pos));
name.setText(heading);
content.setText(steps.get(pos));
// Attach clickListener on ImageView Object so when
// we will click it will handle the widget adding
// code.
addToWidget.setOnClickListener(
new View.OnClickListener() {
@Override public void onClick(View view)
{
added
= !added; // boolean variable to
// know the state ,if
// widget is added or not.
Toast
.makeText(DetailsActivity.this,
"Click",
Toast.LENGTH_SHORT)
.show();
if (added) {
// Calling updateAppWidget static
// method of RecipeWidget to update
// widgets of app
RecipeWidget.updateAppWidget(
DetailsActivity.this,
appWidgetManager, appWidgetId,
recipe);
Toast
.makeText(DetailsActivity.this,
"Added to Widget",
Toast.LENGTH_SHORT)
.show();
addToWidget.setImageDrawable(
getResources().getDrawable(
R.drawable.add_widget));
}
else {
addToWidget.setImageDrawable(
getResources().getDrawable(
R.drawable.not_widget));
RecipeWidget.updateAppWidget(
DetailsActivity.this,
appWidgetManager, appWidgetId,
null);
}
}
});
}
// This method was created to pass Recipe object
// information to AppWidget.
public static Recipe getRecipe() { return recipe; }
}
Producción:
Receta.Archivo Java
Ahora, cada Receta contiene un nombre de Receta (String) y Pasos de Receta (String), por lo que para facilitar el mantenimiento crearemos un objeto Receta.
Java
package com.tanya.widgettutorial;
public class Recipe {
// The recipe include name of food item and steps to
// cook it.
private String name;
private String steps;
public Recipe(String name, String steps)
{
this.name = name;
this.steps = steps;
}
// Getters and Setters
public String getName() { return name; }
public void setName(String name) { this.name = name; }
public String getSteps() { return steps; }
Tres palabras que debes saber sobre un widget:
- RemoteView: ahora, anteriormente mencioné que el diseño del widget es el mismo que cualquier otro diseño. Entonces, básicamente, Widget Layout se basa en RemoteView porque se tratan como una aplicación separada en su pantalla de inicio. RemoteView se utiliza para describir una jerarquía de vistas que se mostrará en otro proceso.
- método: el método se llama cuando se crea un nuevo widget y también durante cada intervalo de actualización que se establece en el archivo Widgetinfo.xml, es decir, se genera cuando ha creado el widget para su aplicación en el directorio xml.
- Clase AppWidgetManager: esta clase consta de toda la información sobre los widgets que están presentes en el hogar. También proporciona acceso para forzar actualizaciones en todos los widgets existentes.
RecetaWidget.Java
Java
package com.tanya.widgettutorial;
public class Recipe {
// The recipe include name of food item and steps to
// cook it.
private String name;
private String steps;
public Recipe(String name, String steps)
{
this.name = name;
this.steps = steps;
}
// Getters and Setters
public String getName() { return name; }
public void setName(String name) { this.name = name; }
public String getSteps() { return steps; }
Producción:
Publicación traducida automáticamente
Artículo escrito por _tanyajain y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA