繁体   English   中英

对GWT中的对话框内的小部件进行动画处理

[英]Animate a Widget inside a DialogBox in GWT

我正在尝试在对话框内使用文本框子级为Layoutpanel设置动画。 当我在一个简单的类/视图中对其进行测试时,我能够做到这一点(即动画),但是当我在对话框中导入相同的代码时,该动画不再起作用。

基本上,我要完成的动画有点像抽屉,其中,当用户单击复选框时,文本框所在的布局面板会根据复选框的状态隐藏或取消隐藏(如抽屉)。 下面是我的代码:


    public class Testingwork implements EntryPoint {

    private final GreetingServiceAsync greetingService = GWT
    .create(GreetingService.class);

    private static final String SERVER_ERROR = "An error occurred while "
        + "attempting to contact the server. Please check your network "
        + "connection and try again.";

    public void onModuleLoad() {
        final Button sendButton = new Button("Send");
        final TextBox nameField = new TextBox();
        nameField.setText("GWT User");
        final Label errorLabel = new Label();

        // We can add style names to widgets
        sendButton.addStyleName("sendButton");

        // Add the nameField and sendButton to the RootPanel
        // Use RootPanel.get() to get the entire body element
        RootPanel.get("nameFieldContainer").add(nameField);
        RootPanel.get("sendButtonContainer").add(sendButton);

        RootPanel.get("errorLabelContainer").add(errorLabel);

        // Focus the cursor on the name field when the app loads
        nameField.setFocus(true);
        nameField.selectAll();

        // Create the popup dialog box
        final DialogBox dialogBox = new DialogBox();

        dialogBox.setText("Remote Procedure Call");
        dialogBox.setAnimationEnabled(true);
        final Button closeButton = new Button("Close");

        // We can set the id of a widget by accessing its Element
        closeButton.getElement().setId("closeButton");
        final Label textToServerLabel = new Label();
        final HTML serverResponseLabel = new HTML();
        VerticalPanel dialogVPanel = new VerticalPanel();
        dialogVPanel.addStyleName("dialogVPanel");
        dialogVPanel.add(new HTML("<b>Sending name to the server:</b>"));
        dialogVPanel.add(textToServerLabel);
        dialogVPanel.add(new HTML("<br><b>Server replies:</b>"));
        dialogVPanel.add(serverResponseLabel);
        dialogVPanel.setHorizontalAlignment(VerticalPanel.ALIGN_RIGHT);
        dialogVPanel.add(closeButton);

        final CheckBox danCheck2 = new CheckBox("Dan2");
        final LayoutPanel testPanel2 = new LayoutPanel();           //-----------> LayoutPanel
        final HorizontalPanel cont2 = new HorizontalPanel();
        final TextBox tb12 = new TextBox();
        final TextBox tb22 = new TextBox();
        final TextBox tb32 = new TextBox();

        dialogVPanel.add(danCheck2);
        testPanel2.add(cont2);
        cont2.add(tb12);
        cont2.add(tb22);
        cont2.add(tb32);

        dialogBox.setWidget(dialogVPanel);

        // Add a handler to close the DialogBox
        closeButton.addClickHandler(new ClickHandler() {
            public void onClick(ClickEvent event) {
                dialogBox.hide();
                sendButton.setEnabled(true);
                sendButton.setFocus(true);
            }
        });

        // Create a handler for the sendButton and nameField
        class MyHandler implements ClickHandler, KeyUpHandler {
            /**
             * Fired when the user clicks on the sendButton.
             */
            public void onClick(ClickEvent event) {
                if (event.getSource().equals(sendButton)) {
                    sendNameToServer();
                }
                else if(event.getSource().equals(danCheck2)) {
                    danMethod2();
                }

            }

            /**
             * Fired when the user types in the nameField.
             */
            public void onKeyUp(KeyUpEvent event) {
                if (event.getNativeKeyCode() == KeyCodes.KEY_ENTER) {
                    sendNameToServer();
                }
            }

            /**
             * Send the name from the nameField to the server and wait for a response.
             */
            private void sendNameToServer() {
                // First, we validate the input.
                errorLabel.setText("");
                String textToServer = nameField.getText();
                if (!FieldVerifier.isValidName(textToServer)) {
                    errorLabel.setText("Please enter at least four characters");
                    return;
                }

                // Then, we send the input to the server.
                sendButton.setEnabled(false);
                textToServerLabel.setText(textToServer);
                serverResponseLabel.setText("");
                greetingService.greetServer(textToServer,
                        new AsyncCallback<String>() {
                            public void onFailure(Throwable caught) {
                                // Show the RPC error message to the user
                                dialogBox
                                        .setText("Remote Procedure Call - Failure");
                                serverResponseLabel
                                        .addStyleName("serverResponseLabelError");
                                serverResponseLabel.setHTML(SERVER_ERROR);
                                dialogBox.center();
                                closeButton.setFocus(true);
                            }

                            public void onSuccess(String result) {
                                dialogBox.setText("Remote Procedure Call");
                                serverResponseLabel
                                        .removeStyleName("serverResponseLabelError");
                                serverResponseLabel.setHTML(result);
                                dialogBox.center();
                                closeButton.setFocus(true);
                            }
                        });
            }

            private void danMethod2(){
                if (danCheck2.getValue()){
                    System.out.println("[dan]: chbCrossReferencePnr2 = Checked!");
                    testPanel2.setWidgetTopHeight(cont2, 0, PX, 60, PX);
//                  testPanel2.setHeight("60px");
                    testPanel2.animate(500);
                }
                else {
                    System.out.println("[dan]: chbCrossReferencePnr2 = unChecked!");
                    testPanel2.setWidgetTopHeight(cont2, 0, PX, 0, PX);
//                  testPanel2.setHeight("0px");
                    testPanel2.animate(500);
                }
            }
        }

        // Add a handler to send the name to the server
        MyHandler handler = new MyHandler();
        sendButton.addClickHandler(handler);
        danCheck2.addClickHandler(handler);
        nameField.addKeyUpHandler(handler);
    }
}

我已经在课堂上对此进行了测试; 而且有效。 但是,当我将其导入对话框时,布局面板(以及其中的文本框)不再显示。

你能告诉我我在做什么错吗? 由于我的代码在该类中有效,因此我可能刚刚在对话框实现中错过了一些东西。

提前致谢!

您的LayoutPanel永远不会添加到另一个小部件。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM