Lista personalizada con imágenes en Blackberry

listfield

Question

Quiero implementar algo como esto en mi aplicación: Es decir, cada imagen contiene un icono de corazón. Quiero manejar el evento click en el clic del corazón y para eso tengo el siguiente código

list.setEmptyString("No Image Available", DrawStyle.HCENTER);
list.setRowHeight(Display.getHeight() - 100);
list.setSize(data.size());
if (listVManager != null && listVManager.getFieldCount() > 0) {
listVManager.deleteAll();
}
list.setCallback(new ListFieldCallback() {
public void drawListRow(ListField list, Graphics graphics,
int index, int y, int w) {
int yPos = y + list.getRowHeight() - 1;
graphics.setColor(0x434343);
graphics.fillRect(0, y, w, list.getRowHeight());
if (logoThumbnailImage != null
&& logoThumbnailImage.length > index
&& logoThumbnailImage[index] != null) {
EncodedImage img = logoThumbnailImage[index];
graphics.drawImage(0, y + 10, Display.getWidth(),
Display.getHeight() - 100, img, 0, 0, 0);
graphics.drawText("Hello", 10,
Display.getHeight() - 150);
graphics.drawImage(Display.getWidth() - 70,
Display.getHeight() - 150 + 300,
heart.getWidth(), heart.getHeight(), heart,
0, 0, 0);
} else {
graphics.drawImage(
15,
y + 10,
Display.getWidth(),
Display.getHeight() - 100,
sizeImage(iconImage, Display.getWidth(),
Display.getHeight() - 100), 0, 0, 0);
}
graphics.drawText("Hello", 10,
Display.getHeight() - 150);
graphics.drawLine(0, yPos, w, yPos);
}
public Object get(ListField listField, int index) {
return null;
}
public int getPreferredWidth(ListField listField) {
return Display.getWidth();
}
public int indexOfList(ListField listField, String prefix,
int start) {
return 0;
}
});
listVManager.add(list);
loadImages = new LoadImages(80, 80);
loadImages.start();
}
});

aquí cargar imagen es un hilo que carga imágenes en el fondo y las almacena en el logoThumbnailImage y invalida la lista desde allí cuando carga la imagen.

La clase de carga de la imagen de carga:

private class LoadImages extends Thread {
int widthL;
int heightL;
LoadImages(int width, int height) {
this.widthL = width;
this.heightL = height;
}
public void run() {
logoThumbnailImage=new EncodedImage[numberOfItem];
if (object != null) {
for (int i = 0; i < numberOfItem; i++) {
try {
String text=object[i].getJSONArray("UrlArray").getString(0).toString();
EncodedImage encodedImg = JPEGEncodedImage.encode(connectServerForImage(text), quality); //connectserverForImage load Images from server
logoThumbnailImage[i] = sizeImage(encodedImg, Display.getWidth(), Display.getHeight()-100);
list.invalidate();
} catch (Exception e)
{
e.printStackTrace();
}
}
} else {
UiApplication.getUiApplication().invokeLater(new Runnable() {
public void run() {
Dialog.alert("No Data Found");
}
});
}
}
}

La aplicación funciona sin problemas, pero obtuve el siguiente resultado:

Tengo el siguiente problema 1. El corazón y la descripción se muestran solo en una fila de la lista. ¿Alguien me puede decir lo que me estoy perdiendo? 2. Cómo realizar el evento click en heart

Answer 1

Habiendo examinado esto solo brevemente, el problema parece ser que, en ciertos lugares, está ignorando la posición ''y'' que se transfiere a su método drawListRow ():

 public void drawListRow(ListField list, Graphics graphics,
int index, int y, int w) {

Efectivamente, el ''lienzo'' que debe usar para pintar la fila actual (la fila identificada con el índice int) está delimitado por el rectángulo (0, y, w, list.getRowHeight ()).

De hecho, puedes pintar en cualquier lugar en la extensión que pertenece a ListField, es decir, el área en la que puedes pintar es en realidad el rectángulo (0, 0, list.getWidth (), list.getHeight ()). Puedes hacer esto, pero no deberías. Si sale del rectángulo de su fila, estará pintando sobre otra fila.

En su caso, pintar fuera de la fila seleccionada es exactamente lo que hace su código. Tu hiciste esto:

 graphics.drawText("Hello", 10,
Display.getHeight() - 150);

Esto realmente se posicionará en ListField, 10 píxeles desde la izquierda y Display.getHeight () - 150 desde la parte superior. Se colocará en este punto en ListField, independientemente de la fila que esté pintando. Entonces cada fila pondrá el texto Hello en el mismo lugar.

Por lo tanto, cuando codifique su drawListRow (), asegúrese de compensar todas las posiciones para mantenerse dentro de los límites de la fila que se supone que debe pintar. El origen del área que está pintando es (0, y), así que compensa todas las posiciones verticales usando y. No use Display.getHeight (), use list.getRowHeight () para obtener la altura que puede pintar (comenzando en y), y no use Display.getWidth (), use la variable w que se pasa para obtener el ancho que puedes pintar Todas sus acciones gráficas deberían ocurrir dentro de estos límites.