Problems with autoCompleteTextField and dynamic container.

[rdvg...@gmail.com]

Hello and Happy New Year.

Create a form that has an autoCompletTextField component to select items. The idea is that every time I select a new article a list of prices per store should be shown.

If I use the method: ActionListener the change of the list of stores with their prices occurs but does not show the correct information until the second selection. According to the documentation this is not an error but it does not serve my purpose.

If I use the method: DataChangedListener on the third attempt generates a series of strange actions to the point that I could validate that a new component appears in the "contentPane" and that is why when replacing the result it is the one shown in the images.

See my code below.

The following sequence of images is produced with the DataChangedListener method:

My code:

    private void muestraComparacionPreciosArticuloTienda(Form fmLiber) {

        final Form fmCompara = new Form(new BorderLayout());

        fmCompara.getToolbar().setBackCommand("", e -> fmLiber.showBack());

        fmCompara.getToolbar().getStyle().setAlignment(Label.LEFT);

        fmCompara.getToolbar().setTitle(idioma.getMensaje105());

        final Vector vArticulos = dT.getArticulos();

        final Vector vArticulosActivos = obtenArticulosActivos(vArticulos);

        final DefaultListModel lmArticulos = new DefaultListModel(vArticulosActivos);

        final AutoCompleteTextField atArticulo = new AutoCompleteTextField(lmArticulos);

        Container cnComparar = obtenComparacionArticuloTienda(atArticulo.getText(), false);

//        atArticulo.addActionListener((ActionListener) (ActionEvent ee) -> {

        atArticulo.addDataChangeListener(new DataChangedListener() {

            @Override

            public void dataChanged(int type, int index) {

                if (atArticulo.getText() != null && atArticulo.getText().length() > 0) {

                    Articulo aRt = retornaRegistroArticulo(atArticulo.getText(), vArticulos, NOMBRE);

                    if (aRt.getNombre() != null) {

                        Container cnNuevo = obtenComparacionArticuloTienda(aRt.getArticulo(), false);

                        fmCompara.replace(fmCompara.getContentPane().getComponentAt(1), cnNuevo, CommonTransitions.createSlide(CommonTransitions.SLIDE_VERTICAL, true, 200));

                    }

                }

            }

        });

        s = UIManager.getInstance().getComponentStyle("MultiLine2");

        FontImage iSimilar = FontImage.createMaterial(FontImage.MATERIAL_EXTENSION, s);

        Button btSimilar = new Button(iSimilar);

        btSimilar.putClientProperty("reemplazo", 1);

        btSimilar.addActionListener((ActionListener) (ActionEvent ee) -> {

            Articulo aRt = retornaRegistroArticulo(atArticulo.getText(), vArticulos, NOMBRE);

            if (btSimilar.getClientProperty("reemplazo").equals(1)) {

                btSimilar.putClientProperty("reemplazo", 0);

                Container cnNuevo = obtenComparacionArticuloTienda(aRt.getArticulo(), true);

                fmCompara.replace(fmCompara.getContentPane().getComponentAt(1), cnNuevo, CommonTransitions.createSlide(CommonTransitions.SLIDE_VERTICAL, true, 200));

            } else {

                btSimilar.putClientProperty("reemplazo", 1);

                Container cnNuevo = obtenComparacionArticuloTienda(aRt.getArticulo(), false);

                fmCompara.replace(fmCompara.getContentPane().getComponentAt(1), cnNuevo, CommonTransitions.createSlide(CommonTransitions.SLIDE_VERTICAL, true, 200));

            }

        });

        Container cnFiltro = new Container(new BoxLayout(BoxLayout.X_AXIS));

        cnFiltro.addComponent(btSimilar);

        cnFiltro.addComponent(atArticulo);

        fmCompara.addComponent(BorderLayout.NORTH, cnFiltro);

        fmCompara.addComponent(BorderLayout.CENTER, cnComparar);

        fmCompara.setTransitionOutAnimator(CommonTransitions.createSlide( CommonTransitions.SLIDE_HORIZONTAL, true, 500));

        fmCompara.show();

    }

    /**

     * Devuelve un contenedor con los resgistros de tiendas / precios según el

     * artículo seleccionado.

     *

     * @param articulo campo de busqueda de los registros en las tiendas.

     * @param reemplazo bandera que indica si se incluyen los artículos de

     * reemplazo o no.

     * @return contenedor con el resultado.

     */

    private Container obtenComparacionArticuloTienda(String articulo, boolean reemplazo) {

        Container cnCompara = new Container();

        cnCompara.setScrollableY(true);

        Vector vArticuloTienda = obtenArticuloTiendaPorArticulo(articulo);

        if (reemplazo) {

            vArticuloTienda = incluyeSimilar(vArticuloTienda, articulo);

        }

        vArticuloTienda = obtenOrdenPrecioMenor(vArticuloTienda);

        for (int i = 0; i < vArticuloTienda.size(); i++) {

            ArticuloTienda aTd = (ArticuloTienda) vArticuloTienda.elementAt(i);

            if (!aTd.getCondicion().equals(REGISTRO_ELIMINADO)) {

                cnCompara.addComponent(detalleComparaPrecioTienda(aTd));

            }

        }

        return cnCompara;

    }

    /**

     * Devuelve un contenedor Desplazable con la información necesaria para

     * crear un elemento dentro de la lista de contenedores de Compras

     *

     * @param aTd registro de articulo / tienda.

     * @return contenedor con el resultado.

     */

    private Container detalleComparaPrecioTienda(ArticuloTienda aTd) {

        TextArea nombreTienda = new TextArea(aTd.getNombreTienda());

        nombreTienda.setUIID("MultiLine2");

        nombreTienda.setEditable(false);

        nombreTienda.setAlignment(TextArea.LEFT);

        TextArea direccion = new TextArea(aTd.getTiendaDireccion());

        direccion.setUIID("MultiLine3");

        direccion.setEditable(false);

        direccion.setAlignment(TextArea.LEFT);

        if (aTd.getTiendaDireccion().length() > 0 && aTd.getTiendaDireccion() != null) {

            direccion.setText(devuelveDireccion(aTd.getTiendaDireccion()));

        }

        final TextArea txPrecio = new TextArea();

        txPrecio.setText(Double.toString(aTd.getPrecio()));

        txPrecio.setUIID("LabelTotalBig");

        txPrecio.setEnabled(true);

        txPrecio.setAlignment(TextArea.RIGHT);

        BorderLayout border = new BorderLayout();

        border.setCenterBehavior(BorderLayout.CENTER_BEHAVIOR_CENTER_ABSOLUTE);

        Container cnPrecio = new Container(border);

        cnPrecio.addComponent(BorderLayout.CENTER, txPrecio);

        cnPrecio.setUIID("LabelTotalBig");

        Tienda tDa = dT.getTienda(aTd.getTienda());

        Label lbImagen = new Label();

        lbImagen.setIcon(res.getImage(imagenSegunLista(idioma.getItemTipoTienda(), tDa.getTipoTienda())));

        Container cnTienda = new Container(new BoxLayout(BoxLayout.Y_AXIS));

        cnTienda.addComponent(nombreTienda);

        cnTienda.addComponent(direccion);

        if (aTd.getSimilar() == 1) {

            TextArea txNombre = new TextArea();

            txNombre.setUIID("MultiLine3");

            txNombre.setEditable(false);

            txNombre.setAlignment(TextArea.LEFT);

            txNombre.setText(aTd.getNombreArticulo());

            cnTienda.addComponent(txNombre);

        }

        Container cnDatos = new Container(new BoxLayout(BoxLayout.X_AXIS));

        cnDatos.addComponent(lbImagen);

        cnDatos.addComponent(cnTienda);

        Container cnItem = new Container(new BorderLayout());

        cnItem.addComponent(BorderLayout.CENTER, cnDatos);

        cnItem.addComponent(BorderLayout.EAST, cnPrecio);

        Container cnElemento = new Container(new BoxLayout(BoxLayout.Y_AXIS));

        cnElemento.addComponent(cnItem);;

        cnElemento.addComponent(separador());

        return cnElemento;

    }

[Shai Almog]

Hi,
it's hard to read this block of code. I suggest not using replace for something that's invoked so frequently as components replaced while they are themselves replaced might produce... This.

See https://www.codenameone.com/javadoc/com/codename1/ui/Toolbar.html

You can see the search sample where we use layout animation and hide to achieve this effect.