استفاده از جهش لایه ها در اندروید

دوشنبه 9 اسفند 1395

در این مقاله قصد داریم که با یک سری کد های ساده بین لایه ها با استفاده از انیمیشن حرکت کنیم یعنی زمانی که دکمه را بزنیم به لایه دوم با یک جهش برویم و وقتی در لایه ی دوم هستیم با زدن دکمه به لایه ی سوم با یک انیمیشن دیگر حرکت کنیم.

استفاده از جهش لایه ها در اندروید

در قسمت لایه ها قطعه کد زیر را قرار دهید:

ابتدا لایه اصلی که با شروع اپلیکیشن باز خواهد شد:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                             android:layout_width="fill_parent"
                             android:layout_height="fill_parent"
                             android:orientation="vertical" >

<TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="onClickNext"
        android:text="Next >" />

</LinearLayout>

حالا لایه ی دوم را می سازیم:

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

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="onClickNext"
        android:text="Next >" />

</LinearLayout>

و در نهایت لایه سوم را قرار می دهیم:

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



</LinearLayout>

حالا برای حرکت بین لایه ها از انیمیشن استفاده می کنیم یک فولدر انیمیشن در پوشه ی Res ایجاد نمایید:

داخل آن از فایل xml استفاده کنید مثلا برای وارد شدن به لایه به سمت چپ از کد زیر استفاده نمایید:

   <translate
        android:duration="200"
        android:fromXDelta="-100%"
        android:fromYDelta="0%"
        android:toXDelta="0%"
        android:toYDelta="0%" />

</set>

شما کافی است که از سمت fromxdelta یک اندازه ای بدهید، برای وارد شدن به اسلاید از in و خارج شدن از اسلاید از out استفاده می شود، برای ورود از سمت چپ از fromxdelta استفاده می شود در واقع محور افقی x ها هستند و محور عمودی y ها خواهد بود

حالا برای کلاس ها از قطعه کد زیر استفاده نمایید:

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;

public class CustomActivityTransitionActivity extends Activity {
    /** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
}

    public void onClickNext(View view) {
        Intent intent = new Intent(this, SecondActivity.class);
        startActivityForResult(intent, 500);
        overridePendingTransition(R.anim.slide_in_right, R.anim.slide_out_left);
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        overridePendingTransition(R.anim.slide_in_left, R.anim.slide_out_right);
    }
}

در این کلاس برای دکمه next رویداد نوشته شده است که با استفاده از انیمیشن فراخوانی می شود

لایه ی دوم هم برای دکمه از انیمیشنی که نوشته شده است فراخوانی می شود:

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;

public class SecondActivity extends Activity{
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.second);
    }
    
    public void onClickNext(View view) {
        Intent intent = new Intent(this, ThirdActivity.class);
        startActivityForResult(intent, 600);
        overridePendingTransition(R.anim.slide_in_bottom, R.anim.slide_out_top);
    }
    
    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        overridePendingTransition(R.anim.slide_in_top, R.anim.slide_out_bottom);
    }
}

در لایه سوم و لایه ی آخر از دکمه ای استفاده نشده است فقط لایه ی مورد نظر در آن تعریف می شود:

import android.app.Activity;
import android.os.Bundle;

public class ThirdActivity  extends Activity{
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.third);
    }
}

فایل manifest آن هم باید کلاس ها را تعریف کرد:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.habibm.customactivitytransition"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk android:minSdkVersion="8" android:targetSdkVersion="17"/>

    <application
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name" >
        <activity
            android:label="@string/app_name"
            android:name=".CustomActivityTransitionActivity" >
            <intent-filter >
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".SecondActivity" >
        </activity>
        <activity android:name=".ThirdActivity" >
        </activity>
    </application>

</manifest>

خروجی به صورت زیر خواهد بود:

فایل های ضمیمه

برنامه نویسان

نویسنده 3355 مقاله در برنامه نویسان

کاربرانی که از نویسنده این مقاله تشکر کرده اند

در صورتی که در رابطه با این مقاله سوالی دارید، در تاپیک های انجمن مطرح کنید