1. 程式人生 > >Android自定義控制元件——仿微信半透明載入框

Android自定義控制元件——仿微信半透明載入框

在我們的app中不免回遇到耗時操作,這時我們給個載入框進行過度,使使用者體驗大大加強。

一、CustomDialog類的編寫

package com.daqsoft.jingguan.weight;

import android.app.Dialog;
import android.content.Context;
import android.view.KeyEvent;
import android.view.WindowManager;
import android.widget.TextView;

import com.daqsoft.jingguan.R;

/**
 * 自定義透明的dialog
 */
public class CustomDialog extends Dialog{ private String content; public CustomDialog(Context context, String content) { super(context, R.style.CustomDialog); this.content=content; initView(); } @Override public boolean onKeyDown(int keyCode, KeyEvent event) { switch
(keyCode){ case KeyEvent.KEYCODE_BACK: if(CustomDialog.this.isShowing()) CustomDialog.this.dismiss(); break; } return true; } private void initView(){ setContentView(R.layout.dialog_view); ((TextView)findViewById(R.id.tvcontent)).setText(content); setCanceledOnTouchOutside(true
); WindowManager.LayoutParams attributes = getWindow().getAttributes(); attributes.alpha=0.9f; getWindow().setAttributes(attributes); setCancelable(false); } }

二、建立自定義style

    <!-- 自定義dialog的樣式 -->
    <style name="CustomDialog">
        <item name="android:windowFrame">@null</item><!--邊框-->
        <item name="android:windowIsFloating">true</item><!--是否浮現在activity之上-->
        <item name="android:windowIsTranslucent">false</item><!--半透明-->
        <item name="android:windowNoTitle">true</item><!--無標題-->
        <item name="android:windowBackground">@drawable/bg_dialog_custom</item><!--背景透明-->
        <item name="android:backgroundDimEnabled">false</item><!--模糊-->
        <item name="android:backgroundDimAmount">0.6</item>
    </style>

三、背景drawable/bg_dialog_custom

在drawable中建立bg_dialog_custom.xml檔案

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <solid android:color="#ff333333" />

    <corners android:radius="5dp" />

</shape>

四、layout佈局dialog_view

<!-- 載入對話方塊佈局 -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="horizontal"
    android:padding="10dp">

    <ProgressBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:indeterminateDrawable="@drawable/indeterminate_drawable"
        android:indeterminateDuration="1800" />

    <TextView
        android:id="@+id/tvcontent"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:text="載入中"
        android:textColor="#ffffff"
        android:textSize="14sp" />

</LinearLayout>

上面的android:indeterminateDrawable=”@drawable/indeterminate_drawable”就是給ProgressBar加一個樣式

五、ProgressBar加一個樣式

建立檔案indeterminate_drawable.xml放入drawable資料夾下

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@mipmap/loading"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360">

</rotate>

載入的圖片這裡下載,下載後放入mipmap-xhdpi中

六、使用

上面基本就把一個自定義半透明的載入框寫完了,怎麼使用呢,一般我們把他建立在Baseactivity中

配置如下

 private CustomDialog logDialog;

 //方法
     //下面是載入框
    public void showLoadingDialog() {
        if (logDialog == null) {
            logDialog = new CustomDialog(this,"資料載入中");
        }
        logDialog.show();
    }

    public void dismissLoadingDialog() {
        if (logDialog != null) {
            logDialog.dismiss();
        }
    }

這樣之後使用就太方便了,對應的Activity繼承BaseActivity直接呼叫上面方法即可實現