如何将GraphicsContext从客户端发送到服务器,然后发送到所有其他客户端?

时间:2016-04-26 02:40:25

标签: java networking javafx

我现在遇到了输入和输出流的问题。它不会将套接字输入流转换为byte []或将套接字输出流转换为int。如何让程序实际将byte []数组发送到服务器?这是更新后的代码:

import java.io.*;
import java.net.*;
import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.input.MouseEvent;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TextArea;
import javafx.scene.control.TextField;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import java.awt.image.BufferedImage;
import java.io.File;
import javafx.embed.swing.SwingFXUtils;
import javafx.scene.image.*;
import javax.imageio.ImageIO;

public class PaintClient extends Application {
  //GUI components
  private TextField tfRed = new TextField("");
  private TextField tfGreen = new TextField("");
  private TextField tfBlue = new TextField("");
  private Button btSetColor = new Button("Set Color");
  private Button btReset = new Button("Reset");
  private Button btSend = new Button("Send");
  //Networking components
  private Socket socket;
  private ByteArrayOutputStream byteOut;
  private ByteArrayInputStream byteIn;

  @Override
  public void start(Stage primaryStage) {

    tfRed.setPrefWidth(80);
    tfGreen.setPrefWidth(80);
    tfBlue.setPrefWidth(80);

    GridPane gridPane = new GridPane();
    gridPane.add(new Label("Color"), 0, 0);
    gridPane.add(tfRed, 1, 0);
    gridPane.add(tfGreen, 2, 0);
    gridPane.add(tfBlue, 3, 0);
    gridPane.add(btSetColor, 4, 0);
    gridPane.add(btReset, 2, 1);
    gridPane.add(btSend, 3, 1);

    Canvas canvas = new Canvas(365,375);
    final GraphicsContext gc = canvas.getGraphicsContext2D();
    initDraw(gc);

    BorderPane bPane = new BorderPane();
    bPane.setTop(gridPane);
    bPane.setCenter(canvas);

    Scene scene = new Scene(bPane, 375, 450);
    primaryStage.setTitle("Drawing Canvas");
    primaryStage.setScene(scene);
    primaryStage.show();

    canvas.addEventHandler(MouseEvent.MOUSE_PRESSED,
        new EventHandler<MouseEvent>(){

        @Override
        public void handle(MouseEvent event) {
            gc.beginPath();
            gc.moveTo(event.getX(), event.getY());
            gc.stroke();
        }
    });
    canvas.addEventHandler(MouseEvent.MOUSE_DRAGGED,
        new EventHandler<MouseEvent>(){

        @Override
        public void handle(MouseEvent event) {
            gc.lineTo(event.getX(), event.getY());
            gc.stroke();
        }
    });


    //Networking
    try {
        socket = new Socket("localhost", 8000);
        byteIn = new ByteArrayInputStream(socket.getInputStream());
        byteOut = new ByteArrayOutputStream(socket.getOutputStream());
        new Thread(() -> run()).start();
    }
    catch (IOException ex) {
        ex.printStackTrace();
    }
  }

  public void run(){
     while(true) {
        /*try {

        } catch (IOException ex) {
            ex.printStackTrace();
        }*/
     }
  }

  public void process (Canvas canvas) {
     try {
        WritableImage image = canvas.snapshot(null, null);
        BufferedImage bImage = SwingFXUtils.fromFXImage(image, null);
        ImageIO.write(bImage, "jpg", byteOut);
        byteOut.flush();
        byte[] byteImage = byteOut.toByteArray();
        byteOut.close();
        byteOut.write(byteImage);
      } catch (IOException ex) {
          System.err.println(ex);
     }
  }

  public static void main(String[] args) {
    Application.launch(args);
  }

  private void initDraw(GraphicsContext gc) {
        double canvasWidth = gc.getCanvas().getWidth();
        double canvasHeight = gc.getCanvas().getHeight();

        //Event handler when set color button is clicked
        btSetColor.setOnAction(e -> {
            if(!(tfRed.getText().trim().isEmpty()) && !(tfGreen.getText().trim().isEmpty()) &&
                !(tfBlue.getText().trim().isEmpty())) {
                int red = Integer.parseInt(tfRed.getText());
                int green = Integer.parseInt(tfGreen.getText());
                int blue = Integer.parseInt(tfBlue.getText());
                gc.setStroke(Color.rgb(red, green, blue));
            }
        });

        gc.setLineWidth(5);
        gc.fill();
        gc.strokeRect(
            0,              //x of the upper left corner of the drawing area
            0,              //y of the upper left corner of the drawing area
            canvasWidth,    //width of the drawing area
            canvasHeight);  //height of the drawing area
        gc.setLineWidth(1);

        //Event handler when reset button is clicked
        btReset.setOnAction(e -> {
            gc.clearRect(5, 5, 355, 365);
        });
  }
}

1 个答案:

答案 0 :(得分:0)

无法直接发送GraphicsContext,因为GraphicsContext未明确Serializable。实现您的目标的典型方式如下。

一个。记住用户操作为“命令”并将其发送到服务器/其他客户端。这些命令将在客户端执行,您将拥有相同的渲染视图。作为实现的示例,您可以使用自己创建这些命令的GraphicsContext API包装。

public void fillOvalX(double x, double y, double w, double h) {
    // a possible approach
    commands.put(new DrawCommand(Type.FILL_OVAL, x, y, w, h));
    g.fillOval(x, y, w, h);
}

B中。通过调用snapshot(),将GraphicsContext的快照执行到JavaFX Image。然后使用SwingFXUtils将其转换为BufferedImage,最后使用ImageIObyte[]转换为ByteArrayOutputStream。然后可以通过网络序列化数组byte[]。在连接的另一端,您需要以相反的顺序执行相同的操作。链接提供了足够的信息来做到这一点。