animateLayout auf Erweiterung Komponente funktioniert nicht - codenameone

Question

Ich ging durch den Ratatouilles-Restaurant-Code im Blog. Es war toll. Also wollte ich es auch in meiner App anwenden, aber alles funktioniert gut außer der glatten Animation, wenn die Komponente hinzugefügt wird. Was ist in meinem Code falsch gelaufen? Vielen Dank im Voraus.

protected void beforeTeamMemberTry(Form f) { 
    screenWidth = Display.getInstance().getDisplayWidth(); 

    Container mainContainer = new Container(new BoxLayout(BoxLayout.Y_AXIS)); 
    f.add(mainContainer); 

    for (int i = 0; i < 3; i++) { 
     Container memberContainer = new Container(new BorderLayout()); 
     memberContainer.getAllStyles().setMargin(5, 5, 0, 0); 
     mainContainer.add(memberContainer); 

     Label icon = new Label(theme.getImage("loginBg.png").scaledWidth(screenWidth/9)); 
     icon.setName("memberIcon"); 
     zeroPaddingMargin(icon); 
     memberContainer.add(BorderLayout.WEST, icon); 

     Container detailsContainer = new Container(new BorderLayout()); 
     Container innerContainer = new Container(new BoxLayout(BoxLayout.Y_AXIS)); 
     detailsContainer.add(BorderLayout.CENTER, innerContainer); 
     innerContainer.setUIID("innerclkvjd"); 
     zeroPaddingMargin(innerContainer); 
     innerContainer.getAllStyles().setPadding(10, 0, 10, 0); 
     innerContainer.getAllStyles().setAlignment(Component.CENTER); 
     detailsContainer.setName("detailsContainer"); 
     zeroPaddingMargin(detailsContainer); 
     detailsContainer.getAllStyles().setAlignment(Component.CENTER); 
     memberContainer.add(BorderLayout.CENTER, detailsContainer); 
     Button email = new Button("bbeck@gmai.com"); 
     email.setName("memberEmail"); 
     zeroPaddingMargin(email); 
     innerContainer.add(email); 
     Label position = new Label("Senior member".toUpperCase()); 
     position.setName("memberPosition"); 
     zeroPaddingMargin(position); 
     position.getAllStyles().setFgColor(0xccccc0); 
     position.getAllStyles().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_PLAIN, Font.SIZE_SMALL)); 
     innerContainer.add(position); 

     Label emblemDown = new Label(">"); 
     emblemDown.setUIID("emblemDown"); 
     memberContainer.add(BorderLayout.EAST, emblemDown); 

     Label emblemUp = new Label("<"); 
     emblemUp.setUIID("emblemUp"); 

     Container descriptionContainer = new Container(); 
     TextArea descriptionTextArea = new TextArea("slkdjfdlk dslkfdslkf jsdfksdl fksd flksd f;lsdkf sldkf sdlfk s;dl fksdl fksd flsd fkds"); 
     descriptionContainer.add(descriptionTextArea); 
     descriptionTextArea.setName("memberDescription"); 
     zeroPaddingMargin(descriptionTextArea); 
     descriptionTextArea.setEditable(false); 
     descriptionTextArea.setGrowByContent(true); 
     descriptionTextArea.setGrowLimit(5); 

     memberContainer.setLeadComponent(email); 

     email.addActionListener(e -> { 
      if (emblemDown.getParent() != null) { 
       memberContainer.add(BorderLayout.EAST, emblemUp); 
       memberContainer.add(BorderLayout.SOUTH, descriptionContainer); 
       memberContainer.revalidate(); 
      } else { 
       memberContainer.removeComponent(emblemUp); 
       memberContainer.add(BorderLayout.EAST, emblemDown); 
       memberContainer.removeComponent(descriptionContainer); 
       memberContainer.revalidate(); 
      } 
      memberContainer.getParent().animateLayout(300); 
     }); 
    } 
} 

Details einschließlich phn-Nr. (Knopf) oben in descriptionContainer aber es kann nicht angeklickt werden:

Container descriptionContainer = new Container(); 
TextArea descriptionTextArea = new TextArea("slkdjfdlk dslkfdslkf jsdfksdl fksd flksd f;lsdkf sldkf sdlfk"); 
descriptionContainer.add(descriptionTextArea); 
descriptionTextArea.setGrowByContent(true); 
descriptionTextArea.setGrowLimit(2); 

Container phnContainer = new Container(); 
descriptionContainer.add(phnContainer); 
Label phnLabel = new Label("Phn: "); 
Button phn = new Button("9802921323"); 
phnContainer.add(phnLabel); 
phnContainer.add(phn); 
phn.addActionListener(e->{ 
    System.out.println("bibek calls"); 
}); 

Answer 1

Ich habe Ihren Code neu geordnet und die Animation Code animateLayoutAndWait(300) ändern.

Sie sollten auch nicht beide revalidate() und animateLayout() anrufen.

Ich bemerkte auch, dass Ihre Animation auf die E-Mail-Schaltfläche angewendet wurde.

Abschließend wenden Sie die Animation auf den richtigen Container an und rufen Sie unter memberContainer.getParent().animateLayout(300); nicht die Embleme, sondern die memberContainer-Platzierung auf.

protected void beforeTeamMemberTry(Form f) { 
    screenWidth = Display.getInstance().getDisplayWidth(); 

    Container mainContainer = new Container(new BoxLayout(BoxLayout.Y_AXIS)); 
    f.add(mainContainer); 

    for (int i = 0; i < 3; i++) { 
     Container memberContainer = new Container(new BorderLayout()); 
     memberContainer.getAllStyles().setMargin(5, 5, 0, 0); 

     Label icon = new Label(theme.getImage("loginBg.png").scaledWidth(screenWidth/9)); 
     icon.setName("memberIcon"); 
     zeroPaddingMargin(icon); 
     memberContainer.add(BorderLayout.WEST, icon); 

     Container detailsContainer = new Container(new BorderLayout()); 
     Container innerContainer = new Container(new BoxLayout(BoxLayout.Y_AXIS)); 
     detailsContainer.add(BorderLayout.CENTER, innerContainer); 
     innerContainer.setUIID("innerclkvjd"); 
     zeroPaddingMargin(innerContainer); 
     innerContainer.getAllStyles().setPadding(10, 0, 10, 0); 
     innerContainer.getAllStyles().setAlignment(Component.CENTER); 
     detailsContainer.setName("detailsContainer"); 
     zeroPaddingMargin(detailsContainer); 
     detailsContainer.getAllStyles().setAlignment(Component.CENTER); 
     memberContainer.add(BorderLayout.CENTER, detailsContainer); 
     Button email = new Button("bbeck@gmai.com"); 
     email.setName("memberEmail"); 
     zeroPaddingMargin(email); 
     innerContainer.add(email); 
     Label position = new Label("Senior member".toUpperCase()); 
     position.setName("memberPosition"); 
     zeroPaddingMargin(position); 
     position.getAllStyles().setFgColor(0xccccc0); 
     position.getAllStyles().setFont(Font.createSystemFont(Font.FACE_SYSTEM, Font.STYLE_PLAIN, Font.SIZE_SMALL)); 
     innerContainer.add(position); 

     Label emblemDown = new Label(">"); 
     emblemDown.setUIID("emblemDown"); 
     memberContainer.add(BorderLayout.EAST, emblemDown); 

     Label emblemUp = new Label("<"); 
     emblemUp.setUIID("emblemUp"); 

     Container descriptionContainer = new Container(); 
     TextArea descriptionTextArea = new TextArea("slkdjfdlk dslkfdslkf jsdfksdl fksd flksd f;lsdkf sldkf sdlfk s;dl fksdl fksd flsd fkds"); 
     descriptionContainer.add(descriptionTextArea); 
     descriptionTextArea.setName("memberDescription"); 
     zeroPaddingMargin(descriptionTextArea); 
     descriptionTextArea.setEditable(false); 
     descriptionTextArea.setGrowByContent(true); 
     descriptionTextArea.setGrowLimit(5); 

     memberContainer.setLeadComponent(email); 

     email.addActionListener(e -> { 
      if (emblemDown.getParent() != null) { 
       memberContainer.add(BorderLayout.EAST, emblemUp); 
       memberContainer.add(BorderLayout.SOUTH, descriptionContainer); 
      } else { 
       memberContainer.removeComponent(emblemUp); 
       memberContainer.add(BorderLayout.EAST, emblemDown); 
       memberContainer.removeComponent(descriptionContainer); 
      } 
      memberContainer.animateLayoutAndWait(300); 
     }); 
     mainContainer.add(memberContainer); 
     mainContainer.animateLayoutAndWait(300); 
    } 
}