更換 Android 原生 Toast 的樣式
Toast 每個用Android 手機的用戶再熟悉不過,而且各種自定義樣式的 文章也層出不窮
本篇文章并不是要走他們的老路,本文只針對 Toast 的UI樣式,剖析完后再來定制.
本文源碼:https://github.com/didikee/CommonDependence
覺得不錯可以先關注下,后面會更新更多的組件 ?乛?乛?
Toast 使用的 Layout
在源碼中寫到:
View v = inflate.inflate(com.android.internal.R.layout.transient_notification, null);
也就是:
com.android.internal.R.layout.transient_notification
其布局文件如下:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="?android:attr/toastFrameBackground">
<TextView
android:id="@android:id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_horizontal"
android:textAppearance="@style/TextAppearance.Toast"
android:textColor="@color/bright_foreground_dark"
android:shadowColor="#BB000000"
android:shadowRadius="2.75"
/>
</LinearLayout>
文件路徑在:...\SDK\platforms\android-23\data\res\layout\transient_notification.xml
**需要一個個解讀的如下: **
1. Toast 的背景 : android:background="?android:attr/toastFrameBackground"
2. Toast 文字樣式 : android:textAppearance="@style/TextAppearance.Toast"
3. Toast 文字顏色 : android:textColor="@color/bright_foreground_dark"
Toast 的背景 Background
android:background="?android:attr/toastFrameBackground
在...\SDK\platforms\android-23\data\res\values\themes.xml中,可以看到,背景其實是一個 Drawable資源
<!-- Toast attributes -->
<item name="toastFrameBackground">@drawable/toast_frame</item>
最終在:...\SDK\platforms\android-23\data\res\drawable-xxhdpi\toast_frame.9.png找到了
本來是想改變.9圖的顏色的,但是Google了很久都沒有解決方案,可能 SVG矢量圖是為了彌補這一缺陷而運用在Android上的.
如果誰有解決方案,麻煩@下我,我也想知道 ?乛?乛?
好了,換一個思路.
經過 馬克曼的測量,再配合 Material Design的設計規(guī)范,得到了最終滿意的尺寸.
MD 習慣的尺寸為 1,2,4,8,16,24,36,48,56......絕大數(shù)情況是偶數(shù)[單位都是dp]
最終布局如下:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/shape_toast"
android:orientation="vertical">
<TextView
android:id="@android:id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="12dp"
android:paddingTop="12dp"
android:paddingLeft="24dp"
android:paddingRight="24dp"
android:textSize="16sp"
android:layout_gravity="center_horizontal"
android:layout_weight="1"
android:shadowColor="#BB000000"
android:shadowRadius="2.75"
android:textColor="@color/WHITE"
/>
</LinearLayout>
Toast 文字樣式
android:textAppearance="@style/TextAppearance.Toast
文件路徑: ...\SDK\platforms\android-23\data\res\values\style.xml
<style name="TextAppearance.Toast">
<item name="fontFamily">sans-serif-condensed</item>
</style>
設置 `` 有兩種方式:
1. textView.setTextAppearance(R.style.AndroidToast);//api16
2. Typeface typeface = Typeface.create("sans-serif-condensed", Typeface.NORMAL);
textView.setTypeface(typeface);//api1
第一種看起來方便簡潔,但是要求 api>=16,而 4.0 對應的是 api15,所以還是選擇第二種吧
Toast 文字顏色
android:textColor="@color/bright_foreground_dark"
<color name="bright_foreground_dark">@android:color/background_light</color>
<color name="background_light">#ffffffff</color>
所以默認的顏色是純白的 #FFFFFF
最后貼下 java 代碼
/**
* {@link layout/transient_notification.xml}
* @param content content to show
* @param longTime short or long
* @param context context
* @param textColor toast text color
* @param toastBackgroundColor toast background color
*/
public static void showToast(@NonNull Context context, String content, boolean longTime, @ColorInt
int textColor,@ColorInt int toastBackgroundColor) {
int type = longTime ? Toast.LENGTH_LONG : Toast.LENGTH_SHORT;
Toast toast = Toast.makeText(context, content, type);
ViewGroup toastView = (ViewGroup) LayoutInflater.from(context).inflate(R.layout
.layout_toast, null, false);
if (toastBackgroundColor != 0) {
toastView.setBackgroundDrawable(getToastBackground(context, toastBackgroundColor));
}
TextView textView = (TextView) toastView.findViewById(android.R.id.message);
// 內部已經作非空判斷了
if (textColor!=0){
textView.setTextColor(textColor);
}
Typeface typeface = Typeface.create("sans-serif-condensed", Typeface.NORMAL);
textView.setTypeface(typeface);
toast.setView(toastView);
toast.setText(content);
toast.show();
}
private static Drawable getToastBackground(@NonNull Context context, @ColorInt int color) {
GradientDrawable gradientDrawable = new GradientDrawable();
gradientDrawable.setShape(GradientDrawable.RECTANGLE);
gradientDrawable.setCornerRadius(DisplayUtil.dp2px(context, 24));
gradientDrawable.setColor(color);
return gradientDrawable;
}
結束
本文源碼:https://github.com/didikee/CommonDependence
覺得不錯可以先關注下,后面會更新更多的組件 ?乛?乛?
