Pertanyaan Pindahkan objek pada jalur kurva Bézier


Saya ingin memindahkan gambar saya di jalur kurva Bézier dari atas ke bawah tetapi saya tidak bisa mendapatkan bagaimana saya bisa menghitung poin x dan y dan kemiringan dari jalur ini. Jalan terlihat seperti gambar berikut:

A line that curves slightly to the right as it goes down the page.

Saya memiliki titik awal, titik akhir, dan dua titik kontrol.

Path path = new Path(); 
Point s = new Point(150, 5); 
Point cp1 = new Point(140, 125); 
Point cp2 = new Point(145, 150); 
Point e = new Point(200, 250); 
path.moveTo(s.x, s.y); 
path.cubicTo(cp1.x, cp1.y, cp2.x, cp2.y, e.x, e.y); 

10
2018-02-29 05:47


asal


Jawaban:


Ini adalah kurva Cubic Bézier yang rumusnya sederhana [x,y]=(1–t)^3*P0+3(1–t)^2*t*P1+3(1–t)t^2*P2+t^3*P3. Dengan ini Anda dapat memecahkan setiap titik dengan mengevaluasi persamaan. Di Jawa ini Anda bisa melakukannya seperti ini:

/* t is time(value of 0.0f-1.0f; 0 is the start 1 is the end) */
Point CalculateBezierPoint(float t, Point s, Point c1, Point c2, Point e)
{
  float u = 1 – t;
  float tt = t*t;
  float uu = u*u;
  float uuu = uu * u;
  float ttt = tt * t;

  Point p = new Point(s.x * uuu, s.y * uuu);
  p.x += 3 * uu * t * c1.x;
  p.y += 3 * uu * t * c1.y;
  p.x += 3 * u * tt * c2.x;
  p.y += 3 * u * tt * c2.y;
  p.x += ttt * e.x;
  p.y += ttt * e.y;

  return p;
}

Jadi jika Anda ingin memindahkan sprite di sepanjang jalur, maka Anda cukup menetapkan nilai t dari nilai 0 - 1, tergantung seberapa jauh Anda berada di jalur yang Anda inginkan. Contoh:

int percentMovedPerFrame = 1;// Will complete path in 100 frames
int currentPercent = 0;
update() {
   if (currentPercent < 100) {
      this.pos = CalculateBezierPoint(currentPercent / 100.0f, this.path.s, this.path.c1, this.path.c2, this.path.e);
      currentPercent += percentMovedPerFrame
   }
}

11
2018-03-09 04:25



Android memberi Anda API untuk mencapai apa yang Anda inginkan. Gunakan kelas yang disebut android.graphics.PathMeasure. Ada dua metode yang Anda akan menemukan berguna: getLength (), untuk mengambil total panjang dalam piksel dari path, dan getPosTan (), untuk mengambil posisi X, Y dari suatu titik pada kurva pada jarak tertentu (serta tangen di lokasi ini.)

Misalnya, jika getLength () mengembalikan 200 dan Anda ingin mengetahui posisi X, Y dari titik di tengah kurva, panggil getPosTan () dengan jarak = 100.

Info lebih lanjut: http://developer.android.com/reference/android/graphics/PathMeasure.html


16
2018-03-02 10:41



Untuk menemukan titik pada kurva Bezier, Anda dapat menggunakan algoritma De Casteljau.

Lihat misalnya http://www.cs.mtu.edu/~shene/COURSES/cs3621/NOTES/spline/Bezier/de-casteljau.html atau gunakan Google untuk menemukan beberapa penerapan.


7
2018-03-02 09:45



Jika Anda hanya memiliki 2 titik kontrol, kurva bezier adalah garis linier.

Jika Anda memiliki 3, Anda memiliki kurva kuadrat. 4 titik kontrol menentukan kurva kubik.

Kurva Bezier adalah fungsi yang bergantung pada "waktu". Mulai dari 0,0 - 1,0. Jika Anda memasukkan 0 ke dalam persamaan, Anda mendapatkan nilai pada awal kurva. Jika Anda memasukkan 1,0, nilai di bagian akhir.

Kurva Bezier menyisipkan titik kontrol pertama dan terakhir, sehingga titik awal dan titik akhir Anda. Perhatikan dengan teliti paket atau pustaka apa yang Anda gunakan untuk menghasilkan kurva.

Untuk mengarahkan gambar Anda dengan vektor tangen dari kurva, Anda harus membedakan persamaan kurva (Anda dapat mencari persamaan kurva kubik bezier pada wiki). Itu akan memberi Anda vektor singgung untuk mengarahkan gambar Anda.


4
2018-02-29 06:10



Perhatikan bahwa mengubah parameter dalam bentuk parametrik dari bezier kubik tidak menghasilkan hasil linear. Dengan kata lain, pengaturan t = 0,5 tidak memberi Anda titik yang berada di tengah kurva. Tergantung pada kelengkungan (yang didefinisikan oleh titik kontrol) akan ada non-linearitas di sepanjang jalur.


3
2018-03-09 08:20



Untuk siapa saja yang perlu menghitung titik nilai statis dari kurva Bezier Kurva kurva Bezier adalah sumber yang bagus. Terutama jika Anda menggunakan kuadran keempat (yaitu antara garis X dan -Y line). Kemudian Anda dapat sepenuhnya memetakannya ke sistem koordinat Android melakukan mod pada nilai negatif.


0
2018-06-21 14:29