黑莓中带有图像的自定义列表

Question

我想在我的应用程序中实现这样的东西： 也就是说，每个图像都包含一个心形图标。我想处理心脏点击的点击事件，为此我有以下代码

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();
        }
    });

这里的加载图像是在后台加载图像并将它们存储在 logoThumbnailImage 数组中的线程，并在加载图像时从那里使列表无效。

加载图片线程类：

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");
                }
            });
        }
    }
}

应用程序运行顺利，但我得到以下输出：

我有以下问题 1. 心脏和描述只显示在一个列表行上。谁能告诉我我错过了什么？ 2. 如何在heart上执行click事件

Answer 1

仅简要地查看了这一点，问题似乎是您在某些地方忽略了传递给您的 drawListRow() 方法的“y”位置：

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

实际上，您应该用来绘制当前行（使用 int 索引标识的行）的“画布”由矩形包围 (0, y, w, list.getRowHeight())。

实际上，您实际上可以在属于 ListField 的范围内绘制任何位置，即您可以绘制的区域实际上是矩形 (0, 0, list.getWidth(), list.getHeight())。 你可以这样做，但你不应该这样做。如果您超出行的矩形，您将在另一行上绘画。

在您的情况下，在所选行之外绘制正是您的代码所做的。你这样做：

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

这实际上将位于 ListField 上，距左侧 10 像素，Display.getHeight() - 距顶部 150 像素。无论您正在绘制哪一行，它将定位在 ListField 中的这一点。所以每一行都会把 Hello 文本放在同一个地方。

因此，在编写 drawListRow() 代码时，请确保偏移所有位置以保持在应该绘制的行的范围内。您正在绘制的区域的原点是 (0, y)，因此使用 y 偏移所有垂直位置。不要使用 Display.getHeight()，使用 list.getRowHeight() 获取可以绘制的高度（从 y 开始），不要使用 Display.getWidth()，使用传入的 w 变量获取宽度你可以画。您的所有图形操作都应在这些范围内进行。