กันยายน 21, 2017, 10:04:39 am *
ยินดีต้อนรับคุณ, บุคคลทั่วไป กรุณา เข้าสู่ระบบ หรือ ลงทะเบียน
ส่งอีเมล์ยืนยันการใช้งาน?

เข้าสู่ระบบด้วยชื่อผู้ใช้ รหัสผ่าน และระยะเวลาในเซสชั่น
   หน้าแรก   ช่วยเหลือ เข้าสู่ระบบ สมัครสมาชิก  
หน้า: [1]   ลงล่าง
  พิมพ์  
ผู้เขียน หัวข้อ: Animation with Simple XML set (translate and scale)  (อ่าน 1362 ครั้ง)
0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้
ShadowMan
Administrator
Hero Member
*****
ออฟไลน์ ออฟไลน์

เพศ: ชาย
กระทู้: 8264


ShadowWares


| |
« เมื่อ: ธันวาคม 09, 2012, 09:26:35 am »

Animation with Simple XML set (translate and scale)

การทำ Animation กับ Widget ของ Android ทำได้ง่ายๆ โดยการใช้ XML (และอีกหลายๆ วีธี)
เนื่องจาก Android OS เกิดมาในยุคที่ Animation ได้เป็นองค์ประกอบสำคัญในแทบทุก Application
และ Android ขับเคลื่นด้วย Java Core ด้วยเหตุนี้ Android จึงมีความสามารถของ Java มาเต็มๆ จึงทำให้การ Animation ทำได้อย่างง่ายดาย และ อย่างหลากหลายมาก
ในตัวอย่างนี้ผมจะแนะนำการทำ Animation กับ Button โดยการโหลดคุณสมบัติของการ Animation มาจาก XML


1) ทำการสร้าง xml ไฟล์สำหรับ main activity (main.xml) หลัก ดังนี้:
Code:
<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:background="#eee"
android:layout_height="fill_parent">

<Button android:id="@+id/button1"
   android:layout_width="wrap_content"
android:layout_height="180dp"
android:layout_centerInParent="true"
android:textSize="40dp"
android:textColor="#f0f"
android:text="I'm an animated button"/>

</RelativeLayout>

2) ทำการสร้าง xml ไฟล์สำหรับ กำหนดคุณสมบัติ/รูปแบบการ Animation (animator.xml) ดังนี้:
Code:
<?xml version="1.0" encoding="utf-8"?>
<set
   xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator"
android:shareInterpolator="true">

<translate
   android:fromYDelta="90%p"
   android:toYDelta="0"
   android:fromXDelta="90%p"
   android:toXDelta="0"
   android:duration="2000" />

<scale
   android:fromYScale="0.1"
   android:toYScale="1"
   android:fromXScale="0.1"
   android:toXScale="1"
   android:duration="2500" />
</set>

ในที่นี้ผมจะบันทึกไฟล์นี้ไว้ที่ /res/animator/animator.xml
จาก xml:
%p คือค่าเปอร์เซ็นจาก Parent ในที่นี้คือ Screen นั่นเอง
ส่วนอื่นๆ ตีความได้ตรงไปตรงมาตามรูปแบบของ xml


3) ทำการแก้ไขไฟล์ MainActivity.java ดังนี้:
Code: (java)
package com.shadowwares.santi.animation;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.view.animation.AnimationUtils;
import android.widget.Button;

public class MainActivity extends Activity {
   Button button;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.main);

      button = (Button) findViewById(R.id.button1);
      button.setOnClickListener(new View.OnClickListener() {

         @Override
         public void onClick(View v) {
            button.startAnimation(AnimationUtils.loadAnimation(getBaseContext(), R.animator.animator));
         }
      });
   }
}


พระเอกคือ:
Code: (java)
button.startAnimation(AnimationUtils.loadAnimation(getBaseContext(), R.animator.animator));

ความหมายคือให้ทำการ load ไฟล์ animator.xml จาก res/animator มา และ apply ไปยัง button นั่นเอง
เมื่อปุ่มกดถูกคลิก จะเห็นว่ามีการ animate เกิดขึ้น ทั้งตำแหน่ง และขนาด


   
บันทึกการเข้า

By SDW: Do No Wrong Is Do Nothing
          If you want to increase your success rate, double your failure rate
หน้า: [1]   ขึ้นบน
  พิมพ์  
 
กระโดดไป: