1

我有一个 LWUIT 列表,其中包含代表 Flight 对象的项目,每个 Flight 项目显示其航班号、每个航班的出发和到达时间以及机票价格。

某些航班有两条航段(一条航程表示涉及中途停留、更换飞机或更换航空公司的航段),因此这些航班项目需要与每个航段的出发时间和到达时间以及始发地代码一起呈现和每条腿的目的地。

起初只有一条腿的项目是正常渲染的,但是当我滚动列表并且开始渲染具有多条腿的项目时,这些项目被错误地渲染了信息切割,更糟糕的是所有的清单上的项目会受到影响,即使是只有一条腿的项目。

在此屏幕截图中,您可以看到列表项在到达多条腿之前的外观:

只有一条腿的飞行项目正常渲染

然后,当我滚动列表并到达多条腿的项目时,所有项目都被渲染,它们的腿时间信息被剪切,并在第一个项目的时间信息上粘贴了多条腿的信息:

只有一条腿的航班项目,但其信息被剪切并替换为与第一个多条腿航班相同的信息

下面我提供了我的 List Renderer 类:

package com.yallaya.screens.elements;

import com.dotrez.model.Flight;
import com.dotrez.model.Segment;
import com.sun.lwuit.Component;
import com.sun.lwuit.Container;
import com.sun.lwuit.Font;
import com.sun.lwuit.Label;
import com.sun.lwuit.List;
import com.sun.lwuit.layouts.BoxLayout;
import com.sun.lwuit.list.ListCellRenderer;
import com.yallaya.Main;

/*
 * Renderer for a List of Flights to display
 */
public class FlightItem extends Container implements ListCellRenderer {

    /*
     * Components for this List Item
     */
    private Label flightNumberLbl = new Label("");
    private Label origin1Lbl = new Label("");
    private Label destination1Lbl = new Label("");
    private Label origin2Lbl = new Label("");
    private Label destination2Lbl = new Label("");
    private Label priceLbl = new Label("");

    /*
     * Constructor for this List Item
     */
    public FlightItem() {

        this.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
        this.getStyle().setBgColor(0xf0f0f0);
        this.getStyle().setBgTransparency(255);
        this.getStyle().setMargin(0, 0, 0, 0);
        this.getStyle().setPadding(5, 5, 0, 0);

        flightNumberLbl.getStyle().setMargin(14, 0, 0, 0);

        origin1Lbl.getStyle().setPadding(0, 0, 24, 0);
        origin1Lbl.getStyle().setMargin(0, 0, 0, 0);

        destination1Lbl.getStyle().setPadding(0, 0, 24, 0);
        destination1Lbl.getStyle().setMargin(0, 0, 0, 0);

        origin2Lbl.getStyle().setPadding(0, 0, 24, 0);
        origin2Lbl.getStyle().setMargin(0, 0, 0, 0);

        destination2Lbl.getStyle().setPadding(0, 0, 24, 0);
        destination2Lbl.getStyle().setMargin(0, 0, 0, 0);

        priceLbl.getStyle().setPadding(0, 0, 24, 0);
        priceLbl.getStyle().setMargin(14, 0, 0, 0);
        priceLbl.getStyle().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_BOLD, Font.SIZE_MEDIUM));

        this.addComponent(flightNumberLbl);
        this.addComponent(origin1Lbl);
        this.addComponent(destination1Lbl);
        this.addComponent(origin2Lbl);
        this.addComponent(destination2Lbl);
        this.addComponent(priceLbl);

    }

    public void updateColorItem(boolean isSelected){
        if(isSelected){
            this.getStyle().setBgColor(0x9a3d96);
            flightNumberLbl.getStyle().setFgColor(0xffffff);
            origin1Lbl.getStyle().setFgColor(0xffffff);
            destination1Lbl.getStyle().setFgColor(0xffffff);
            origin2Lbl.getStyle().setFgColor(0xffffff);
            destination2Lbl.getStyle().setFgColor(0xffffff);
            priceLbl.getStyle().setFgColor(0xffffff);
        }
        else{
            this.getStyle().setBgColor(0xffffff);
            flightNumberLbl.getStyle().setFgColor(0x9a3d96);
            origin1Lbl.getStyle().setFgColor(0x555555);
            destination1Lbl.getStyle().setFgColor(0x555555);
            origin2Lbl.getStyle().setFgColor(0x555555);
            destination2Lbl.getStyle().setFgColor(0x555555);
            priceLbl.getStyle().setFgColor(0x555555);
        }
    }

    /*
     * Functions called to render this List Item
     */
    public Component getListCellRendererComponent(List list, Object value, int index, boolean isSelected) {

        Flight tmp = (Flight) value;
        int displayIndex = index + 1;
        flightNumberLbl.setText(displayIndex +  ". " + Main.localize("VUELO") + " #" + tmp.getFlightNumber());
        Segment tmpSeg = (Segment) tmp.getSegments().elementAt(0);

        String originStr = Main.localize("SALIDA") + " " + "(" + tmpSeg.getOrigin().getCode() + ")" + ": " + tmpSeg.getDepartureTimeString();
        String destinationStr = Main.localize("LLEGADA") + "(" + tmpSeg.getDestination().getCode() + ")" + ": " + tmpSeg.getArrivalTimeString() + "";

        origin1Lbl.setText(originStr);
        destination1Lbl.setText(destinationStr);

        if(tmp.getSegments().size() > 1){

            tmpSeg = (Segment) tmp.getSegments().elementAt(1);

            originStr = Main.localize("SALIDA") + " " + "(" + tmpSeg.getOrigin().getCode() + ")" + ": " + tmpSeg.getDepartureTimeString();
            destinationStr = Main.localize("LLEGADA") + "(" + tmpSeg.getDestination().getCode() + ")" + ": " + tmpSeg.getArrivalTimeString() + "";

            origin2Lbl.setText(originStr);
            destination2Lbl.setText(destinationStr);
        }
        /************************************************************************/
        /******************* UPDATE PIECE OF CODE STARTS HERE *******************/
        /************************************************************************/
        else{
            origin2Lbl.setText("");
            destination2Lbl.setText("");
        }
        /************************************************************************/
        /******************* UPDATE PIECE OF CODE ENDS HERE *******************/
        /************************************************************************/

        priceLbl.setText("$" + tmp.getAdultFare() + " " + tmp.getCurrency().getCode());

        updateColorItem(isSelected);

        return this;
    }

    /*
     * Function called to get this component when it get focus
     */
    public Component getListFocusComponent(List list) {
        return this;
    }

}

在其他平台上,我相信这个问题被称为“重影”,但我还没有找到在诺基亚 Asha 的 LWUIT 中避免它的方法。

我知道,因为使用相同的渲染器来渲染所有项目,所以这可能是问题的原因,在这种情况下,如果需要,我需要一种方法来以不同的方式渲染一个项目。

当其中一个项目必须显示不同长度的信息时,如何避免更改列表中的每个项目?

编辑

我更新了我的代码,现在如果当前的 Flight 对象不超过一条腿,那么我用空字符串为第二条腿设置标签,这解决了只有一条腿的项目的问题。

因此,我将问题的主题更改为保留在具有多条腿的 Flight 项目上的问题,这些项目没有正确调整大小并且没有找到一种方法来调整每个项目的内容,所有这些项目都被绘制了相同的大小。

如何确保物品高度调整正确?

编辑 2

我尝试在 if 子句中更改渲染器的高度,在该子句中我使用以下命令检查有多少条腿(在模型中称为段)this.setHeight(800);

    if(tmp.getSegments().size() > 1){
        .....
        flightHolder.setHeight(800);
        this.setHeight(800);
    }
    else{
        .....
        flightHolder.setHeight(200);
        this.setHeight(200);
    }

但使用该方法根本无法获得不同的高度尺寸。

然后我尝试使用this.preferredH(800);并最终改变了大小:

    if(tmp.getSegments().size() > 1){
        ......
        flightHolder.setPreferredH(800);
        this.setPreferredH(800);
    }
    else{
        ...........
        flightHolder.setPreferredH(200);
        this.setPreferredH(200);
    }

但是所有的项目都是用 800 渲染的,我猜这是由于最后一个航班有不止一条腿,但我真的不知道,我希望为不止一条腿的航班设置更大的高度,然后重置为对于只有一个的人来说,较小的高度会起作用,但似乎每个项目的高度都强制相同,有人可以向我确认吗?

4

1 回答 1

0

好的。尝试这个:

首先,您需要声明一个全局变量来保存默认行高。然后在构造函数中执行 .setPreferredHeight(到该默认高度全局变量)。

现在在你的:

if(tmp.getSegments().size() > 1){

将全局变量行高设置为 *(乘以)段数,您应该具有正确的行高。

您可以对边距/填充进行类似操作,使用段数相应地定位元素。

我希望这会有所帮助,并让我知道您的进展情况。

菲尼克斯

于 2014-08-26T04:17:38.560 回答