Thứ Năm, 30 tháng 8, 2018

Android - Ảnh động

Hoạt ảnh là quá trình tạo thay đổi chuyển động và hình dạng

Hoạt hình trong Học lập trình Android là có thể từ nhiều cách. Trong chương này, chúng tôi sẽ thảo luận một cách dễ dàng và được sử dụng rộng rãi để tạo hoạt ảnh được gọi là hoạt ảnh được ghép nối.

Tween Animation

Tween Animation có một số tham số như giá trị bắt đầu, giá trị kết thúc, kích thước, thời lượng thời gian, góc quay vv và thực hiện hoạt ảnh được yêu cầu trên đối tượng đó. Nó có thể được áp dụng cho bất kỳ loại đối tượng nào. Vì vậy, để sử dụng điều này, android đã cung cấp cho chúng tôi một lớp được gọi là Hoạt hình.

Để thực hiện hoạt ảnh trong android, chúng ta sẽ gọi hàm loadAnimation () của lớp AnimationUtils. Chúng ta sẽ nhận được kết quả trong một thể hiện của đối tượng Animation. Cú pháp của nó như sau:
Animation animation = AnimationUtils.loadAnimation(getApplicationContext(), 
   R.anim.myanimation);
Lưu ý tham số thứ hai. Đó là tên của tệp xml hoạt ảnh của chúng tôi. Bạn phải tạo một thư mục mới có tên anim dưới thư mục res và tạo một file xml trong thư mục anim.

Lớp hoạt hình này có nhiều chức năng hữu ích được liệt kê bên dưới

Sr.NoPhương thức & Mô tả
1khởi đầu()

Phương thức này bắt đầu hoạt ảnh.
2setDuration (thời lượng dài)

Phương thức này đặt thời lượng của hoạt ảnh.
3getDuration ()

Phương thức này nhận thời lượng được thiết lập theo phương thức trên
4kết thúc()

Phương thức này kết thúc hoạt ảnh.
5hủy ()

Phương thức này hủy bỏ hoạt ảnh.
Để áp dụng hoạt ảnh này cho một đối tượng, chúng ta sẽ chỉ gọi phương thức startAnimation () của đối tượng. Cú pháp của nó là
ImageView image1 = (ImageView)findViewById(R.id.imageView1);
image.startAnimation(animation);

Thí dụ

Ví dụ sau minh họa việc sử dụng Hoạt ảnh trong Android. Bạn có thể chọn loại hoạt ảnh khác nhau từ trình đơn và hoạt ảnh đã chọn sẽ được áp dụng trên một imageView trên màn hình.

Để thử nghiệm với ví dụ này, bạn cần chạy trên trình mô phỏng hoặc thiết bị thực tế.

Các bướcSự miêu tả
1Bạn sẽ sử dụng Android studio IDE để tạo ứng dụng Android và đặt tên ứng dụng là Ứng dụng của tôi theo gói com.example.sairamkrishna.myapplication.
2Sửa đổi tệp src / MainActivity.java để thêm mã hoạt ảnh
3Sửa đổi tệp XML bố trí res / layout / activity_main.xml thêm bất kỳ thành phần GUI nào nếu cần.
4Tạo một thư mục mới trong thư mục res và gọi nó là anim. Khống chế nó bằng cách truy cập res / anim
5Nhấp chuột phải vào hình động và nhấp vào tệp XML mới và chọn Android Bạn phải tạo các tệp khác nhau được liệt kê bên dưới.
6Tạo các tệp myanimation.xml, clockwise.xml, fade.xml, move.xml, blink.xml, slide.xml và thêm mã XML.
7Không cần phải thay đổi hằng số chuỗi mặc định. Android studio sẽ xử lý các hằng số mặc định tại các giá trị / string.xml.
số 8Chạy ứng dụng và chọn một thiết bị Android đang chạy và cài đặt ứng dụng trên đó và xác minh kết quả.
Đây là mã được sửa đổi của MainActivity.java .
package com.example.sairamkrishna.myapplication;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.Toast;

public class MainActivity extends Activity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
   }
   
   public void clockwise(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation = AnimationUtils.loadAnimation(getApplicationContext(), 
         R.anim.myanimation);
      image.startAnimation(animation);
   }
   
   public void zoom(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 = AnimationUtils.loadAnimation(getApplicationContext(), 
         R.anim.clockwise);
      image.startAnimation(animation1);
   }
   
   public void fade(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 = 
         AnimationUtils.loadAnimation(getApplicationContext(), 
            R.anim.fade);
      image.startAnimation(animation1);
   }
   
   public void blink(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 = 
         AnimationUtils.loadAnimation(getApplicationContext(), 
            R.anim.blink);
      image.startAnimation(animation1);
   }
   
   public void move(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 = 
         AnimationUtils.loadAnimation(getApplicationContext(), R.anim.move);
      image.startAnimation(animation1);
   }
   
   public void slide(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 = 
         AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slide);
      image.startAnimation(animation1);
   }
}
Đây là mã được sửa đổi của res / layout / activity_main.xml .

Ở đây abc cho biết về logo của hướng dẫn
<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" 
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">
   
   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Alert Dialog"
      android:id="@+id/textView"
      android:textSize="35dp"
      android:layout_alignParentTop="true"
      android:layout_centerHorizontal="true" />
      
   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Tutorialspoint"
      android:id="@+id/textView2"
      android:textColor="#ff3eff0f"
      android:textSize="35dp"
      android:layout_below="@+id/textView"
      android:layout_centerHorizontal="true" />
      
   <ImageView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/imageView"
      android:src="@drawable/abc"
      android:layout_below="@+id/textView2"
      android:layout_alignRight="@+id/textView2"
      android:layout_alignEnd="@+id/textView2"
      android:layout_alignLeft="@+id/textView"
      android:layout_alignStart="@+id/textView"/>
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="zoom"
      android:id="@+id/button"
      android:layout_below="@+id/imageView"
      android:layout_alignParentLeft="true"
      android:layout_alignParentStart="true"
      android:layout_marginTop="40dp"
      android:onClick="clockwise"/>
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="clockwise"
      android:id="@+id/button2"
      android:layout_alignTop="@+id/button"
      android:layout_centerHorizontal="true"
      android:onClick="zoom"/>
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="fade"
      android:id="@+id/button3"
      android:layout_alignTop="@+id/button2"
      android:layout_alignParentRight="true"
      android:layout_alignParentEnd="true"
      android:onClick="fade"/>
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="blink"
      android:onClick="blink"
      android:id="@+id/button4"
      android:layout_below="@+id/button"
      android:layout_alignParentLeft="true"
      android:layout_alignParentStart="true" />
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="move"
      android:onClick="move"
      android:id="@+id/button5"
      android:layout_below="@+id/button2"
      android:layout_alignRight="@+id/button2"
      android:layout_alignEnd="@+id/button2"
      android:layout_alignLeft="@+id/button2"
      android:layout_alignStart="@+id/button2" />
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="slide"
      android:onClick="slide"
      android:id="@+id/button6"
      android:layout_below="@+id/button3"
      android:layout_toRightOf="@+id/textView"
      android:layout_toEndOf="@+id/textView" />
      
</RelativeLayout>
Đây là mã của res / anim / myanimation.xml .
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

   <scale xmlns:android="http://schemas.android.com/apk/res/android"
      android:fromXScale="0.5"
      android:toXScale="3.0"
      android:fromYScale="0.5"
      android:toYScale="3.0"
      android:duration="5000"
      android:pivotX="50%"
      android:pivotY="50%" >
   </scale>
   
   <scale xmlns:android="http://schemas.android.com/apk/res/android"
      android:startOffset="5000"
      android:fromXScale="3.0"
      android:toXScale="0.5"
      android:fromYScale="3.0"
      android:toYScale="0.5"
      android:duration="5000"
      android:pivotX="50%"
      android:pivotY="50%" >
   </scale>
   
</set>
Đây là mã của res / anim / clockwise.xml .
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

   <rotate xmlns:android="http://schemas.android.com/apk/res/android"
      android:fromDegrees="0"
      android:toDegrees="360"
      android:pivotX="50%"
      android:pivotY="50%"
      android:duration="5000" >
   </rotate>
   
   <rotate xmlns:android="http://schemas.android.com/apk/res/android"
      android:startOffset="5000"
      android:fromDegrees="360"
      android:toDegrees="0"
      android:pivotX="50%"
      android:pivotY="50%"
      android:duration="5000" >
   </rotate>
   
</set>
Đây là mã của res / anim / fade.xml .
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/accelerate_interpolator" >
   
   <alpha
      android:fromAlpha="0"
      android:toAlpha="1" 
      android:duration="2000" >
   </alpha>
   
   <alpha
      android:startOffset="2000"
      android:fromAlpha="1"
      android:toAlpha="0" 
      android:duration="2000" >
   </alpha>   

</set>
Đây là mã của res / anim / blink.xml .
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
   <alpha android:fromAlpha="0.0"
      android:toAlpha="1.0"
      android:interpolator="@android:anim/accelerate_interpolator"
      android:duration="600"
      android:repeatMode="reverse"
      android:repeatCount="infinite"/>
</set>
Đây là mã của res / anim / move.xml .
<?xml version="1.0" encoding="utf-8"?>
<set
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/linear_interpolator"
   android:fillAfter="true">
   
   <translate
      android:fromXDelta="0%p"
      android:toXDelta="75%p"
      android:duration="800" />
</set>
Đây là mã của res / anim / slide.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:fillAfter="true" >
   
   <scale
      android:duration="500"
      android:fromXScale="1.0"
      android:fromYScale="1.0"
      android:interpolator="@android:anim/linear_interpolator"
      android:toXScale="1.0"
      android:toYScale="0.0" />
</set>
Đây là mã được sửa đổi của res / values ​​/ string.xml .
<resources>
   <string name="app_name">My Application</string>
</resources>
Đây là mã mặc định của AndroidManifest.xml .
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.example.sairamkrishna.myapplication" >

   <application
      android:allowBackup="true"
      android:icon="@drawable/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" >
      
      <activity
         android:name="com.example.animation.MainActivity"
         android:label="@string/app_name" >
      
         <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
         </intent-filter>
      
      </activity>
    
   </application>
</manifest>
Hãy thử chạy ứng dụng của bạn. Tôi cho rằng bạn đã kết nối thiết bị Android Mobile thực tế với máy tính của mình.

Để chạy ứng dụng từ Android studio, hãy mở một trong các tệp hoạt động của dự án của bạn và nhấp vào biểu tượng Chạy từ thanh công cụ. Android studio sẽ hiển thị hình ảnh sau

Học lập trình Android
Chọn nút thu phóng, nó sẽ hiển thị màn hình sau đây
Học lập trình Android
Bây giờ chọn nút trượt, nó sẽ hiển thị màn hình sau
Học android
Bây giờ chọn nút di chuyển, nó sẽ hiển thị màn hình sau
Học android
Bây giờ nút theo chiều kim đồng hồ, nó sẽ hiển thị màn hình sau
Học android 

Bây giờ nút Fade, nó sẽ hiển thị màn hình sau

Lưu ý - Nếu bạn chạy nó trong trình mô phỏng, bạn có thể không gặp phải hiệu ứng hoạt ảnh mượt mà. Bạn phải chạy nó trong điện thoại di động Android của bạn để trải nghiệm các hình ảnh động trơn tru.

Không có nhận xét nào:

Đăng nhận xét

Lập trình Android - RenderScript

Trong chương này, chúng ta sẽ tìm hiểu về Android RenderScript. Thông thường các ứng dụng trên Android được thiết kế để tiêu thụ tài nguyên ...