اولین آمپول کسب و کار منتشر شد 🤩 | برای مشاهده و دریافت تخفیف اینجا کلیک کنید.

چگونه یک صفحه اسپلش اسکرین (splash screen) در اندروید بسازیم

دسته‌بندی: آموزش
مهر ۴, ۱۳۹۷

چگونه یک صفحه اسپلش اسکرین (splash screen) در اندروید بسازیم

به احتمال زیاد تاکنون با برنامه های اندرویدی که در ابتدا به مدت چند ثانیه یک صفحه خاص را نشان می دهند و از واژه هایی همچون لطفا منتظر بمانید، شکیبا باشید و یا در حال لود اطلاعات ، برخورد داشته اید. این صفحه اسپلش اسکرین (Splash Screen) نام دارد.

هر صفحه اسپلش اسکرین خود یک نوع اکتیویتی است که باید در ابتدا مشخص کنیم که به مدت چند ثانیه به کاربر اطلاعات کلی را نشان دهد. مثال های زیادی از این نوع اکتیویتی در برنامه های مختلف وجود دارد که از این بین می توان به برنامه دراپ باکس اشاره کرد.

 

 

صفحه اسپلش اسکرین دراپ باکس

 

برای برنامه دراپباکس چنین صفحه ای که در تصویر بالا می بینید به عنوان اسپلش اسکرین در نظر گرفته شده که تنها حدود ۲ ثانیه زمان لود برای آن در نظر گرفته اند و همچنین تنها یک آیکن ساده در آن تعبیه شده است.. با این حال اینکه اجزای این صفحه چه باشد کاملا در اختیار برنامه نویس بوده و مانند یک اکتیویتی معمولی می توان هر چیزی را درون آن قرار داد. اسپلش اسکرین را به چند روش می توان ساخت که ما در اینجا روش بهینه تر را در قالب یک مثال و به صورت عملی بررسی می کنیم.

 

راه اندازی صفحه اسپلش اسکرین (Splash Screen)

 

ابتدا یک پروژه جدید با نام SplashScreen و اکتیویتی از نوع Empty Activity می سازیم.

 

اسپلش اسکرین

 

در حال حاضر پروژه ما یک اکتیویتی با نام MainActivity دارد. در ادامه باید یک اکتیویتی جدید به نام SplashActivity نیز در کنار MainActivity ایجاد کنیم و یک اکتیویتی جدید از نوع Empty Activity با نام دلخواه SplashActivity می سازیم:

 

اسپلش اسکرین

 

پس از این هر دو کلاس اکتیویتی SplashScreen و فایل ایکس ام ال این صفحه به پروژه اضافه میشود.

 

بنابر اطلاعاتی که در ابتدای نوشته گفتیم، ماهیت اسپلش اسکرین به این صورت است که باید تنها به مدت چند ثانیه آن را نشان دهیم.ما این کار را توسط کلاس Handler انجام می دهیم. کلاس Handler را new کرده و سپس با دکمه های ALT+ENTER آن را ایمپورت می کنیم. در نهایت از متغیر PostDelayed برای ایجاد متد تاخییر در نمایش صفحه درون handler استفاده می کنیم. کد اکتیویتی اسپلش اسکرین باید به صورت زیر باشد.

 

package ir.android_studio.splashscreen;
 
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
 
public class SplashActivity extends AppCompatActivity {
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_splash);
 
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                 
            }
        }و۳۰۰۰);
 
    }
}

 

پس از اتمام این کار با استفاده از اینتنت مشخص می کنیم که با اتمام یافتن زمان مکث ایجاد شده، از این اکتیویتی به کدام صفحه برویم. هدف ما انتقال از اکتیویتی Splash÷Activity پس از اتمام زمان تعیین شده به اکتیویتی MainActivity است. متد run در نهایت به شکل زیر تکمیل می شود.

 

new Handler().postDelayed(new Runnable() {
    @Override
    public void run() {
        Intent i = new Intent(SplashActivity.this, MainActivity.class);
        startActivity(i);
    }
}, ۳۰۰۰);

 

هنگام ساخت پروژه MainActivity به عنوان اکتیویتی اصلی تعیین شده که لازم است این ویژگی را به اکتیویتی SplashActivity اختصاص دهیم. به مانیفست رفته و intent-filter مربوط به MainActivity را به اکتیویتی اسپلش منتقل می کنیم.

همچنین ببینید :   آموزش ساخت Toggle Button در اندروید

 


< manifest xmlns:android="http://schemas.android.com/apk/res/android" package="ir.android_studio.splashscreen">
 
    < application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:supportsRtl="true" android:theme="@style/AppTheme">
        < activity android:name=".MainActivity">
 
        < /activity>
        < activity android:name=".SplashActivity">
            < intent-filter>
                < action android:name="android.intent.action.MAIN" />
 
                < category android:name="android.intent.category.LAUNCHER" />
            < /intent-filter>
        < /activity>
    < /application>
 
< /manifest>

 
   

 

در ادامه پروژه را ران می کنیم. پس از این میبینیم که اسپلش اسکرین به مدت ۳ ثانیه اجرا می شود و برنامه به صفحه MainActivity منتقل می گردد.

 

تا اینجای کار توانستیم که صفحه اسپلش اسکرین را راه اندازی کنیم. اما خب بعد از این چطور؟ زمانی که در صفحه MainActivity باشید و دکمه back گوشی را فشار دهید باز هم به صفحه اسپلش بر میگردید و این خود نوعی خطا محصوب می شود. برای رفع این خطا روش زیر را امتحان می کنیم.

 

new Handler().postDelayed(new Runnable() {
    @Override
    public void run() {
        Intent i = new Intent(SplashActivity.this, MainActivity.class);
        startActivity(i);
 
        finish();
    }
}, ۳۰۰۰);

 

یعنی دستور finish(); را به اکتیویتی اضافه می کنیم تا به طور کلی تا ادامه برنامه این اکتیویتی از مسیر برنامه حذف شود و تا زمان شروع مجدد دیگر کاربر با این صفحه مواجه نشود.

 

اکثر صفحه های اسپلش اسکرین به صورت فول اسکرین و یا فول وییو هستند و هیچ گونه تولبار و یا استاتوس باری در آن مشخص نیست. بهتر است نوار Toolbar مربوط به اکتیویتی اسپلش اسکرین را نیز حذف کنیم. . برای حذف تولبار لازم است یک Theme (تم) بدون تولبار (اکشن بار) برای اکتیویتی مدنظر تعریف کنیم. این مباحث مربوط به طراحی تم می شود اما فعلا به جهت رفع نیاز به توضیح اجمالی اکتفا می کنیم. ویژگی theme را درون تگ باز <activity> به اینصورت اضافه کردیم:

 

< activity android:name=".SplashActivity" android:theme="@style/Theme.AppCompat.NoActionBar">
    < intent-filter>
        < action android:name="android.intent.action.MAIN" />
 
        < category android:name="android.intent.category.LAUNCHER" />
    < /intent-filter>
</ activity>

 

از سوی دیگر می توانیم برای طراحی بهتر صفحه، یک فایل صوتی در زمان اجرای اسپلش اسکرین به برنامه اضافه کنیم. برای این کار ابتدا یک فایل صوتی ر در پوشه res/raw قرار می دهیم این فایل باید زمانی کمتر از زمان اجرای اسپلش اسکرین داشته باشد. ابتدا یک شئ از کلاس MediaPlayer با نام دلخواه splashSound می سازیم:

 

private MediaPlayer splashSound;

 

سپس با دستور create، کانتکست this و بعد از آن نیز مسیر قرارگیری فایل صوتی که به صورت R.raw قابل دسترسی است. در نهایت start می کنیم:

 

splashSound = MediaPlayer.create(this, R.raw.sound);
splashSound.start();

 

و در پایان کد نهایی SplashActivity باید به صورت زیر دربیاید:

 

package ir.android_studio.splashscreen;
 
import android.content.Intent;
import android.media.MediaPlayer;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
 
public class SplashActivity extends AppCompatActivity {
 
    private MediaPlayer splashSound;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_splash);
 
        splashSound = MediaPlayer.create(this, R.raw.sound);
        splashSound.start();
 
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                Intent i = new Intent(SplashActivity.this, MainActivity.class);
                startActivity(i);
 
                finish();
            }
        }, ۳۰۰۰);
 
    }
}

 

امیدوارم که در پروژه های بعدی خود بتوانید از صفحه اسپلش اسکرین های حرفه ای و شیک بهره ببرید.

پیام بگذارید


تومان