ย้ายมุมมองโดยใช้ภาพเคลื่อนไหวแบบสะบัด

ลองใช้วิธีแบบ Compose

Jetpack Compose เป็นชุดเครื่องมือ UI ที่แนะนำสำหรับ Android ดูวิธีใช้ภาพเคลื่อนไหวใน Compose

Spring AnimationSpec →

ภาพเคลื่อนไหวแบบ Fling ใช้แรงเสียดทานที่แปรผันตามความเร็วของออบเจ็กต์ ใช้เพื่อสร้างภาพเคลื่อนไหวของพร็อพเพอร์ตี้ของออบเจ็กต์และ จบภาพเคลื่อนไหวอย่างค่อยเป็นค่อยไป โดยมีโมเมนตัมเริ่มต้นซึ่งส่วนใหญ่มาจากความเร็วของท่าทางสัมผัส และจะช้าลงเรื่อยๆ ภาพเคลื่อนไหวจะสิ้นสุดลงเมื่อความเร็วของภาพเคลื่อนไหวต่ำพอที่จะไม่ทำให้เกิดการเปลี่ยนแปลงที่มองเห็นได้บนหน้าจออุปกรณ์

หากต้องการดูข้อมูลเกี่ยวกับหัวข้อที่เกี่ยวข้อง โปรดอ่านคำแนะนำต่อไปนี้

• การเคลื่อนไหว ตามหลักฟิสิกส์
• สร้างภาพเคลื่อนไหวของการเคลื่อนไหว โดยใช้สปริงฟิสิกส์

เพิ่มไลบรารี AndroidX

หากต้องการใช้ภาพเคลื่อนไหวตามหลักฟิสิกส์ คุณต้องเพิ่มไลบรารี AndroidX ลงในโปรเจ็กต์ โดยทำดังนี้

1. เปิดไฟล์ build.gradle สำหรับโมดูลแอป
2. เพิ่มไลบรารี AndroidX ลงในส่วน dependencies

   ดึงดูด

           dependencies {
               implementation 'androidx.dynamicanimation:dynamicanimation:1.0.0'
           }
           

   Kotlin

           dependencies {
               implementation("androidx.dynamicanimation:dynamicanimation:1.0.0")
           }
           

สร้างภาพเคลื่อนไหวแบบ Fling

คลาส FlingAnimation ช่วยให้คุณสร้าง ภาพเคลื่อนไหวแบบตวัดสำหรับออบเจ็กต์ได้ หากต้องการสร้างภาพเคลื่อนไหวแบบตวัด ให้สร้างอินสแตนซ์ของ คลาส FlingAnimation แล้ว ระบุออบเจ็กต์และพร็อพเพอร์ตี้ของออบเจ็กต์ที่ต้องการสร้างภาพเคลื่อนไหว

val fling = FlingAnimation(view, DynamicAnimation.SCROLL_X)

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);

กำหนดความเร็ว

ความเร็วเริ่มต้นจะกำหนดความเร็วที่พร็อพเพอร์ตี้ภาพเคลื่อนไหวเปลี่ยนแปลงเมื่อเริ่มภาพเคลื่อนไหว ความเร็วเริ่มต้นเริ่มต้นจะ ตั้งค่าเป็น 0 พิกเซลต่อวินาที ดังนั้นคุณต้องกำหนดความเร็วเริ่มต้น เพื่อให้ภาพเคลื่อนไหวไม่สิ้นสุดในทันที

คุณสามารถใช้ค่าคงที่เป็นความเร็วเริ่มต้น หรือใช้ความเร็วของท่าทางสัมผัสเป็นค่าเริ่มต้นก็ได้ หากเลือกที่จะระบุค่าคงที่ คุณควรกำหนดค่าเป็น dp ต่อวินาที แล้วแปลงเป็นพิกเซล ต่อวินาที การกำหนดค่าเป็น dp ต่อวินาทีจะช่วยให้ความเร็วไม่ขึ้นอยู่กับความหนาแน่นและฟอร์มแฟกเตอร์ของอุปกรณ์ ดูข้อมูลเพิ่มเติมเกี่ยวกับการแปลงความเร็วเริ่มต้นเป็นพิกเซลต่อวินาทีได้ที่ส่วนการแปลง dp ต่อวินาทีเป็นพิกเซลต่อวินาทีในภาพเคลื่อนไหวแบบสปริง

หากต้องการกำหนดความเร็ว ให้เรียกใช้เมธอด setStartVelocity() แล้วส่ง ความเร็วเป็นพิกเซลต่อวินาที เมธอดจะแสดงผลออบเจ็กต์ Fling ที่กำหนดความเร็วไว้

หมายเหตุ: ใช้คลาส GestureDetector.OnGestureListener และ VelocityTracker เพื่อดึงข้อมูลและคำนวณ ความเร็วของท่าทางสัมผัสตามลำดับ

กำหนดช่วงค่าภาพเคลื่อนไหว

คุณสามารถกำหนดค่าภาพเคลื่อนไหวต่ำสุดและสูงสุดได้เมื่อต้องการ จำกัดค่าพร็อพเพอร์ตี้ให้อยู่ในช่วงที่กำหนด การควบคุมช่วงนี้มีประโยชน์อย่างยิ่งเมื่อคุณสร้างภาพเคลื่อนไหวของพร็อพเพอร์ตี้ที่มีช่วงโดยธรรมชาติ เช่น อัลฟ่า (จาก 0 ถึง 1)

หมายเหตุ: เมื่อค่าของภาพเคลื่อนไหวแบบตวัดถึงค่าต่ำสุดหรือสูงสุด ภาพเคลื่อนไหวจะสิ้นสุดลง

หากต้องการกำหนดค่าต่ำสุดและสูงสุด ให้เรียกใช้เมธอด setMinValue() และ setMaxValue() ตามลำดับ ทั้ง 2 เมธอดจะแสดงผลออบเจ็กต์ภาพเคลื่อนไหวที่คุณกำหนดค่าไว้

กำหนดแรงเสียดทาน

เมธอด setFriction() ช่วยให้คุณเปลี่ยนแรงเสียดทานของภาพเคลื่อนไหวได้ โดยจะกำหนดความเร็วที่ลดลงของภาพเคลื่อนไหว

หมายเหตุ: หากคุณไม่ได้กำหนดแรงเสียดทานเมื่อเริ่มภาพเคลื่อนไหว ภาพเคลื่อนไหวจะใช้ค่าแรงเสียดทานเริ่มต้นเป็น 1

เมธอดจะแสดงผลออบเจ็กต์ที่ภาพเคลื่อนไหวใช้ค่าแรงเสียดทานที่คุณ ระบุ

โค้ดตัวอย่าง

ตัวอย่างด้านล่างแสดงภาพเคลื่อนไหวแบบ Fling ในแนวนอน ความเร็วที่บันทึกจาก ตัวติดตามความเร็วคือ velocityX และขอบเขตการเลื่อนจะ ตั้งค่าเป็น 0 และ maxScroll แรงเสียดทานตั้งค่าเป็น 1.1

FlingAnimation(view, DynamicAnimation.SCROLL_X).apply {
    setStartVelocity(-velocityX)
    setMinValue(0f)
    setMaxValue(maxScroll)
    friction = 1.1f
    start()
}

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);
fling.setStartVelocity(-velocityX)
        .setMinValue(0)
        .setMaxValue(maxScroll)
        .setFriction(1.1f)
        .start();

กำหนดการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำ

เมื่อสร้างภาพเคลื่อนไหวของพร็อพเพอร์ตี้ที่กำหนดเองซึ่งไม่ได้กำหนดเป็นพิกเซล คุณควรตั้งค่าการเปลี่ยนแปลงค่าภาพเคลื่อนไหวขั้นต่ำที่ผู้ใช้มองเห็นได้ ซึ่งจะกำหนดเกณฑ์ที่สมเหตุสมผลสำหรับการสิ้นสุดภาพเคลื่อนไหว

คุณไม่จำเป็นต้องเรียกใช้เมธอดนี้เมื่อสร้างภาพเคลื่อนไหวของ DynamicAnimation.ViewProperty เนื่องจากระบบจะอนุมานการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำจากพร็อพเพอร์ตี้ เช่น

• ค่าการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำเริ่มต้นคือ 1 พิกเซลสำหรับพร็อพเพอร์ตี้ของมุมมอง เช่น TRANSLATION_X, TRANSLATION_Y, TRANSLATION_Z, SCROLL_X, และ SCROLL_Y
• สำหรับภาพเคลื่อนไหวที่ใช้การหมุน เช่น ROTATION, ROTATION_X, และ ROTATION_Y การเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำคือ MIN_VISIBLE_CHANGE_ROTATION_DEGREES หรือ 1/10 พิกเซล
• สำหรับภาพเคลื่อนไหวที่ใช้ความทึบแสง การเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำคือ MIN_VISIBLE_CHANGE_ALPHA หรือ 1/256

หากต้องการกำหนดการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำสำหรับภาพเคลื่อนไหว ให้เรียกใช้ setMinimumVisibleChange() แล้วส่งค่าคงที่การเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำค่าใดค่าหนึ่ง หรือค่าที่คุณต้องคำนวณ สำหรับคุณสมบัติที่กำหนดเอง ดูข้อมูลเพิ่มเติมเกี่ยวกับการคำนวณค่านี้ได้ที่ ส่วนการคำนวณค่าการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำ

anim.minimumVisibleChange = DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE

anim.setMinimumVisibleChange(DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE);

หมายเหตุ: คุณต้องส่งค่าก็ต่อเมื่อสร้างภาพเคลื่อนไหวของพร็อพเพอร์ตี้ที่กำหนดเองซึ่งไม่ได้กำหนดเป็นพิกเซล

การคำนวณค่าการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำ

หากต้องการคำนวณค่าการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำสำหรับคุณสมบัติที่กำหนดเอง ให้ใช้ สูตรต่อไปนี้

การเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำ = ช่วงค่าคุณสมบัติที่กำหนดเอง / ช่วงของ ภาพเคลื่อนไหวเป็นพิกเซล

เช่น พร็อพเพอร์ตี้ที่คุณต้องการสร้างภาพเคลื่อนไหวจะเพิ่มขึ้นจาก 0 เป็น 100 ซึ่งสอดคล้องกับการเปลี่ยนแปลง 200 พิกเซล ตามสูตร ค่าการเปลี่ยนแปลงที่มองเห็นได้ขั้นต่ำ คือ 100 / 200 เท่ากับ 0.5 พิกเซล