Jak narysować linię w różnych wzorach, używając płótna?

Question

Hej Chcę narysować linię w różnych wzorach, używając płótna.

Każdy pomysł lub sugestia są doceniane .. !!!!

Z góry dziękuję.

Answer 1

można użyć Path .Docs znaczy:

klasy

Ścieżka obudowuje związek (Wiele geometrycznych konturów) drogi składające się z odcinków linii prostych, krzywe kwadratowych i krzywych sześciennych. ...

Na przykład, można rozszerzyć i dodać view dotykowych pozycje zdarzeń do path w onTouchEvent(MotionEvent event) metody swojej view.Then trzeba generować losowe pozycje odpowiadają najnowszym przypadku dotyku i dodać ich do innych przypadkach z path.Finally w onDraw() metody Państwa zdaniem, zwrócić wszystkie paths.I nadzieję ten fragment pomóc zrozumieć mój pomysł:

public class NetCanvas extends View { 

    private static final double MAX_DIFF = 15; 
    Path path0 = new Path(); 
    Path path = new Path(); 
    private Paint p0; 
    private Paint p; 

    public NetCanvas(Context context) { 
     super(context); 
     p0 = new Paint(); 
     p0.setShader(new LinearGradient(0, 0, 230, getHeight(), Color.GREEN, 
       Color.RED, Shader.TileMode.CLAMP)); 
     p0.setStyle(Style.STROKE); 

     p = new Paint(); 
     p.setShader(new LinearGradient(0, 0, 230, getHeight(), Color.BLUE, 
       Color.MAGENTA, Shader.TileMode.CLAMP)); 
     p.setStyle(Style.STROKE); 
    } 

    @Override 
    public boolean onTouchEvent(MotionEvent event) { 

     float x0 = event.getX(); 
     float y0 = event.getY(); 
     float x = generateFloat(event.getX()); 
     float y = generateFloat(event.getY()); 

     if (event.getAction() == MotionEvent.ACTION_DOWN) { 
      path0.moveTo(x0, y0); 
      path0.lineTo(x0, y0); 

      path.moveTo(x, y); 
      path.lineTo(x, y); 
     } else if (event.getAction() == MotionEvent.ACTION_MOVE) { 
      path0.lineTo(x0, y0); 

      path.lineTo(x, y); 
     } else if (event.getAction() == MotionEvent.ACTION_UP) { 
      path0.lineTo(x0, y0); 

      path.lineTo(x, y); 
     } 
     invalidate(); 
     return true; 
    } 

    @Override 
    public void onDraw(Canvas canvas) { 
     canvas.drawPath(path0, p0); 
     canvas.drawPath(path, p); 
    } 

    private float generateFloat(Float f){ 
     double d = (Math.signum(2*Math.random() - 1)) * Math.random() * MAX_DIFF; 
     return (float) (f + d); 
    } 
} 

w powyższym kodzie, użyłem dwóch path s, ale można użyć trzech lub więcej .Również rezultacie, zależy od szybkości palca na przykład screen.For:

lub może ona wyglądać następująco:

Edit:

Above class (NetCanvas) rozszerza się o View, dzięki czemu można utworzyć jego instancję i użyć tej instancji, podobnie jak inne widoki. Na przykład można po prostu ustawić instancję o f go jako ContentView swojej Activity.Here zastąpić onCreate() sposób aktywny:

@Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(new NetCanvas(this)); 
    } 

Chociaż można zmienić NetCanvas przedłużyć SurfaceView z kilkoma innymi zmianami.

Answer 2

Zmieniłem NetCanvas narysować wygląd kształt podobny drugiego obrazu w swoim pytaniu:

public class NetCanvas1 extends View { 

    Path path0 = new Path(); 
    private Paint p0; 
    private int points_Num = 20; 
    private int first_Points_Num = 5; 

    public NetCanvas1(Context context) { 
     super(context); 
     p0 = new Paint(); 
     p0.setShader(new LinearGradient(0, 0, 230, getHeight(), Color.GREEN, 
       Color.RED, Shader.TileMode.CLAMP)); 
     p0.setStyle(Style.STROKE); 

    } 

    @Override 
    public boolean onTouchEvent(MotionEvent event) { 

     float x0 = event.getX(); 
     float y0 = event.getY(); 

     if (event.getAction() == MotionEvent.ACTION_DOWN) { 
      path0.moveTo(x0, y0); 
      path0.lineTo(x0, y0); 

     } else if (event.getAction() == MotionEvent.ACTION_MOVE) { 
      path0.lineTo(x0, y0); 
     } else if (event.getAction() == MotionEvent.ACTION_UP) { 
      path0.lineTo(x0, y0); 
      invalidate(); 
     } 
     return true; 
    } 

    @Override 
    public void onDraw(Canvas canvas) { 
     canvas.drawPath(path0, p0); 
     FlaotPoint[] pointArray = getPoints(); 
     try { 
      for (int i = 0; i < first_Points_Num; i++) { 
       for (int j = i; j < pointArray.length; j++) { 
        canvas.drawLine(pointArray[i].getX(), pointArray[i].getY(), 
          pointArray[j].getX(), pointArray[j].getY(), p0); 
       } 
      } 
      path0.reset(); 
     } catch (Exception e) { 
     } 
    } 

    private FlaotPoint[] getPoints() { 
     FlaotPoint[] pointArray = new FlaotPoint[points_Num]; 
     PathMeasure pm = new PathMeasure(path0, false); 
     float length = pm.getLength(); 
     float distance = 0f; 
     float speed = length/points_Num; 
     int counter = 0; 
     float[] aCoordinates = new float[2]; 

     while ((distance < length) && (counter < points_Num)) { 
      // get point from the path 
      pm.getPosTan(distance, aCoordinates, null); 
      pointArray[counter] = new FlaotPoint(aCoordinates[0], 
        aCoordinates[1]); 
      counter++; 
      distance = distance + speed; 
     } 

     return pointArray; 
    } 

    class FlaotPoint { 
     float x, y; 

     public FlaotPoint(float x, float y) { 
      this.x = x; 
      this.y = y; 
     } 

     public float getX() { 
      return x; 
     } 

     public float getY() { 
      return y; 
     } 
    } 
} 

wynik zależy od wartości points_Num, first_Points_Num i kolejność punktów, które są połączone z liniami w pętli:

for (int i = 0; i < first_Points_Num; i++) { 
       for (int j = i; j < pointArray.length; j++) { 
        canvas.drawLine(pointArray[i].getX(), pointArray[i].getY(), 
          pointArray[j].getX(), pointArray[j].getY(), p0); 
       } 
      } 

Możesz zmienić wartość każdej zmiennej lub kolejność punktów, aby zmienić wynik.Wynik może być wygląd, takie jak:

Mój pomysł jest prosty: zdobyć punkty ze ścieżki i połączyć je z liniami .Jeżeli chcesz zobaczyć więcej szczegółów na temat uzyskania punktów z drogi, to jest zrobione w metodzie getPoints(), można zobaczyć this answer i jest to reference.I nadzieję, że to ci pomóc.