تالار گفتمان nCIS.ir

با سلام، توی این پست میخوام آموزش سفارشی‌کردن Toast و تغییر نمای ظاهری اون رو به علاقمندان آموزش بدم. اول از همه بگم که من برای سفارشی‌کردن، از لوگوی خود برنامه و یه تصویر 9-Patch بعنوان پس‌زمینه استفاده کردم که خوب این موضوع اختیاریه و شما میتونین هر روش دیگه رو استفاده کنین ولی برای اینکه طبق آموزش بتونین کار کنین، فایلها رو ضمیمه این پست کردم (که البته برای دیدن و دانلودکردن باید توی انجمن عضو باشین). با ادامه این تاپیک همراه باشین تا این موضوع مفید رو یاد بگیرین.

اول از همه باید یه فایل Layout جدید برای Toast به پروژه اضافه کنید. برای اینکار توی پنجره Project (کلید میانبر Alt+1) روی پوشه layout کلیک راست کنید و از منوی New گزینه Layout resource file رو انتخاب کنید. اسم فایل رو وارد کنید (من toast گذاشتم) و محتوا رو به این شکل داخلش بنویسید:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="@drawable/btn_multicolor"
    android:gravity="center"
    android:orientation="horizontal"
    android:padding="16dp">

    <TextView
        android:id="@+id/txtMessage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:text="@string/app_name"
        android:textColor="@android:color/white"
        android:textSize="12sp" />

    <ImageView
        android:id="@+id/imgLogo"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:contentDescription="@string/app_name"
        android:scaleType="fitCenter"
        android:src="@drawable/logo" />

</LinearLayout>

همونطور که می‌بینید، یه کادر متن و یه تصویر استفاده شده که برای نمایش محتوای موردنظرمون کفایت میکنه. ضمناً ابعاد LinearLayout والد هم wrap_content درنظر گرفته شده که به‌اندازه‌ی محتواش در بیاد و بیشتر از اون صفحه رو نپوشونه. البته شما میتونید با تغییر این پارامترها، خروجی موردنظر خودتون رو تولید کنید.

به پیشنمایش ظاهر این Toast نگاه کنید:

خوب حالا به یکی از کلاس‌های دلخواه خودتون این متد رو اضافه کنید (من به کلاس App که از Application مشتق کردم و توی مانیفست هم با android:name معرفیش کردم اضافه کردم ولی هیچ فرقی نمیکنه توی چه کلاسی باشه). دقت کنید که این متد استاتیک هست و درنتیجه بدون نیاز به ایجاد شئ از کلاس، میتونین توی کل پروژه استفاده کنید (به‌شرط اینکه کلاس رو public تعریف کرده باشین) :

public static void toast(String message) {
   toast(message, Toast.LENGTH_SHORT);
}

public static void toast(String message, int length) {
   Context CONTEXT = getApplicationContext();
   LayoutInflater INFLATER = (LayoutInflater) CONTEXT.getSystemService(LAYOUT_INFLATER_SERVICE);
   Typeface FONT = Typeface.createFromAsset(getAssets(), "fonts/IRANSansMobile.ttf");
   
   Toast toast = new Toast(CONTEXT);
   View view = INFLATER.inflate(R.layout.toast, null);
   TextView txtMessage = (TextView) view.findViewById(R.id.txtMessage);
   txtMessage.setTypeface(FONT);
   txtMessage.setText(message);
   toast.setView(view);
   toast.setDuration(length);
   toast.show();
}

اگه خوب دقت کنید می‌بینید که الان متد toast درواقع Overload شده و میتونیم با یک یا دو پارامتر صداش بزنیم (اگه تک‌پارامتری باشه، Toast با زمان کوتاه نمایش داده میشه).

حالا این متد چیکار میکنه؟ اول Context یا زمینه اجرای برنامه رو میگیره تا Toast رو روی اون اجرا کنه. من از getApplicationContext استفاده کردم تا حتی اگه برنامه در پس‌زمینه درحال اجرا بود و سرویس خاصی اجرا شد، بازم بتونیم بدون نمایش یه اکتیویتی خاص، پنجره Toast رو نمایش بدیم. بعد با کمک Inflater لی‌اوت toast که توی مرحله قبل ساختیم رو تبدیل به یه شئ از کلاس View میکنیم و همچنین فونت دلخواهمون رو هم بارگذاری میکنیم که بتونیم بعنوان Typeface برای متن انتخاب کنیم تا متن با این فونت ظاهر بشه (این قسمت هم اختیاریه). درنهایت متن رو تنظیم میکنیم و toast رو نمایش میدیم منتها قبلش با setView، نمایی که با کمک Layout ساختیم رو برای toast تعیین می‌کنیم.

درنهایت هروقت خواستین یه Toast نمایش بدین، کافیه متد موردنظر رو صدا بزنین و متن دلخواه رو براش بفرستین. مثال:

App.toast("Welcome");

App.toast("Please wait...", Toast.LENGTH_LONG);

به یه نمونه از اجرای این روش دقت کنید:


لازم نیست توضیح بدم که میتونید هرجور دوست دارین این متدها رو سفارشی‌کنید. مثلاً پارامترهایی اضافه کنید برای تغییر عکس کنار متن و...

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

سورسش همینه دیگه. یه پروژه‌ی جدید بسازین و همین کارها رو انجام بدین. چیز اضافه‌ای نداره.