recherche

Maison  >  Questions et réponses  >  le corps du texte

android - 求问：2个画板A和B，在A上画的动作如何每时每刻在B上也自动画出？

两个画板A和B，我在A画板上画画，然后在B上一步一步全部自动重绘出来，要有重绘过程。

天蓬老师天蓬老师2773 Il y a quelques jours707

répondre à tous(2)je répondrai

  • 迷茫

    迷茫2017-04-17 16:53:30

    这个问题不难，在触发A画板绘制的时候，得倒A的点的坐标，根据换算关系，算出B的点坐标，在绘制B里面的。https://segmentfault.com/n/1330000005040693

    MainActivity
 
package com.cyrus.demoboard;
 
import android.app.Activity;
import android.os.Bundle;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
 
import com.cyrus.demoboard.BoardView.OnPositionListener;
 
 
/**

    1. class MainActivity extends Activity {

      
   private BoardView aView;
   private BoardViewB bView;
   
   
   private int wA,hA;
   private int wB,hB;
   
   private float sX = 0.0f;
   private float sY = 0.0f;
   
   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);
       aView = (BoardView)findViewById(R.id.a_boardview);
       bView = (BoardViewB)findViewById(R.id.b_boardview);
       
       aView.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
           
           @Override
           public void onGlobalLayout() {
               // TODO Auto-generated method stub
               hA = aView.getHeight();
               wA = aView.getWidth();
           }
       });
       
       bView.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
           
           @Override
           public void onGlobalLayout() {
               // TODO Auto-generated method stub
               hB = bView.getHeight();
               wB = bView.getWidth();
           }
       });
       
       aView.setOnPositionListener(new OnPositionListener() {
           
           @Override
           public void onPositionListener(float x,float y,int action) {
               // TODO Auto-generated method stub
               if (sX == 0 || sY == 0) {
                   sX = (wB*1.0f)/wA;
                   sY = (hB*1.0f)/hA;
               }
               bView.triggerDraw(x*sX,y*sY,action);
           }
       });
       
   }

      }

      Board A

    2. com.cyrus.demoboard;

    3. android.annotation.SuppressLint;

    4. android.content.Context;

    5. android.graphics.Canvas;

    6. android.graphics.Paint;

    7. android.graphics.Path;

    8. android.util.AttributeSet;

    9. android.view.MotionEvent;

    10. android.view.View;
      /**

      • @author CyrusCao
        *
        */

    11. class BoardView extends View {

         
   
   private float mX, mY;
   private Path mPath;
   private static final float TOUCH_TOLERANCE = 4;
   private Paint mPaint;
   private OnPositionListener mPositionListener;

   @SuppressLint("NewApi")
   public BoardView(Context context, AttributeSet attrs, int defStyleAttr,
           int defStyleRes) {
       super(context, attrs, defStyleAttr, defStyleRes);
       // TODO Auto-generated constructor stub
       initPaint();
   }

   public BoardView(Context context, AttributeSet attrs, int defStyleAttr) {
       super(context, attrs, defStyleAttr);
       // TODO Auto-generated constructor stub
       initPaint();
   }

   public BoardView(Context context, AttributeSet attrs) {
       super(context, attrs);
       // TODO Auto-generated constructor stub
       initPaint();
   }

   public BoardView(Context context) {
       super(context);
       // TODO Auto-generated constructor stub
       initPaint();
   }
   
   public void initPaint(){
       
       mPaint = new Paint();
       mPaint.setAntiAlias(true);
       mPaint.setDither(true);
       mPaint.setColor(0xFF00FF00);
       mPaint.setStyle(Paint.Style.STROKE);
       mPaint.setStrokeJoin(Paint.Join.ROUND);
       mPaint.setStrokeCap(Paint.Cap.ROUND);
       mPaint.setStrokeWidth(10);  
       
   }

   @SuppressLint("ClickableViewAccessibility")
   @Override
   public boolean onTouchEvent(MotionEvent event) {
       // TODO Auto-generated method stub
       float x = event.getX();
       float y = event.getY();
       if (mPositionListener != null) {
           mPositionListener.onPositionListener(x, y,event.getAction());
       }
       switch (event.getAction()) {
           case MotionEvent.ACTION_DOWN:
               mPath = new Path();
               touchStart(x, y);
               break;
           case MotionEvent.ACTION_MOVE:
               touchMove(x, y);
               break;
           case MotionEvent.ACTION_UP:
               touchUp();
               break;
       }
       invalidate();
       return true;
   }
   


   @Override
   protected void onDraw(Canvas canvas) {
       // TODO Auto-generated method stub
       if (mPath != null) {
           canvas.drawPath(mPath, mPaint);
       }
   }
   
   private void touchStart(float x, float y) {
       mPath.reset();
       mPath.moveTo(x, y);
       mX = x;
       mY = y;
   }
   private void touchMove(float x, float y) {
       float dx = Math.abs(x - mX);
       float dy = Math.abs(y - mY);
       if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
            mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
           mX = x;
           mY = y;
       }
   }
   private void touchUp() {
       mPath.lineTo(mX, mY);
       mPath = null;
       
   }
   
   
   
   public void setOnPositionListener(OnPositionListener mPositionListener) {
       this.mPositionListener = mPositionListener;
   }

   public interface OnPositionListener {
       void onPositionListener(float x,float y,int action);
   }

      }

      Board B

    12. com.cyrus.demoboard;

    13. android.annotation.SuppressLint;

    14. android.content.Context;

    15. android.graphics.Canvas;

    16. android.graphics.Paint;

    17. android.graphics.Path;

    18. android.util.AttributeSet;

    19. android.view.MotionEvent;

    20. android.view.View;

      /**

      • @author CyrusCao
        *
        */

    21. class BoardViewB extends View {

      
   private float mX, mY;
   private Path mPath;
   private static final float TOUCH_TOLERANCE = 4;
   private Paint mPaint;

   @SuppressLint("NewApi")
   public BoardViewB(Context context, AttributeSet attrs, int defStyleAttr,
           int defStyleRes) {
       super(context, attrs, defStyleAttr, defStyleRes);
       // TODO Auto-generated constructor stub
       initPaint();
   }

   public BoardViewB(Context context, AttributeSet attrs, int defStyleAttr) {
       super(context, attrs, defStyleAttr);
       // TODO Auto-generated constructor stub
       initPaint();
   }

   public BoardViewB(Context context, AttributeSet attrs) {
       super(context, attrs);
       // TODO Auto-generated constructor stub
       initPaint();
   }

   public BoardViewB(Context context) {
       super(context);
       // TODO Auto-generated constructor stub
       initPaint();
   }

   public void initPaint() {

       mPaint = new Paint();
       mPaint.setAntiAlias(true);
       mPaint.setDither(true);
       mPaint.setColor(0xFFFF0000);
       mPaint.setStyle(Paint.Style.STROKE);
       mPaint.setStrokeJoin(Paint.Join.ROUND);
       mPaint.setStrokeCap(Paint.Cap.ROUND);
       mPaint.setStrokeWidth(10);

   }

   public void triggerDraw(float x, float y, int action) {
       switch (action) {
       case MotionEvent.ACTION_DOWN:
           mPath = new Path();
           touchStart(x, y);
           break;
       case MotionEvent.ACTION_MOVE:
           touchMove(x, y);
           break;
       case MotionEvent.ACTION_UP:
           touchUp();
           break;
       }
       invalidate();
   }

   @Override
   protected void onDraw(Canvas canvas) {
       // TODO Auto-generated method stub
       if (mPath != null) {
           canvas.drawPath(mPath, mPaint);
       }
   }

   private void touchStart(float x, float y) {
       mPath.reset();
       mPath.moveTo(x, y);
       mX = x;
       mY = y;
   }

   private void touchMove(float x, float y) {
       float dx = Math.abs(x - mX);
       float dy = Math.abs(y - mY);
       if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
           mPath.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
           mX = x;
           mY = y;
       }
   }

   private void touchUp() {
       mPath.lineTo(mX, mY);
       mPath = null;

   }

      }

    22. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

         xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent" >

   <com.cyrus.demoboard.BoardViewB
       android:id="@+id/b_boardview"
       android:layout_width="300dp"
       android:layout_height="250dp"
       android:background="#fff000" />

   <com.cyrus.demoboard.BoardView
       android:id="@+id/a_boardview"
       android:layout_width="200dp"
       android:layout_height="200dp"
       android:layout_alignParentBottom="true"
       android:background="#fff000" />

      </RelativeLayout>

    répondre
    0
  • 大家讲道理

    大家讲道理2017-04-17 16:53:30

    websocket可以实现，不过ie下面要用flash

    répondre
    0
  • Annulerrépondre