Android自定義View(1):對話方塊-Dialog
Android系統自帶的對話方塊,在很多android 5.0以下系統的手機上,簡直目不忍視,所以UI設計基本上都需要自定義對話方塊,漂亮的對話方塊五花八門,android如何設計一種簡單的自定義對話方塊呢。
一,Dialog需要注意的問題
android 彈出dialog必須存在所屬的activity,不能憑空產生,所以dialog不能在application類裡面new,必須在activity onCreate之後new。
1,預設的dialog
public Dialog(Context context) {
this(context, 0, true);
}
2,自定義對話方塊樣式的dialog
public Dialog(Context context, int theme) {
this(context, theme, true);
}
二,Dialog例項Java程式碼
例項程式碼如下:
public void showDialog() {
if (dialog!=null&&dialog.isShowing()){
return;
}
dialog = new Dialog(mContext, R.style.dialog1);
dialog.setContentView(R.layout.dialog_common);
Button btn_left = (Button) dialog.findViewById(R.id.btn_left);
Button btn_right = (Button) dialog.findViewById(R.id.btn_right);
TextView tv_body_msg = (TextView) dialog.findViewById(R.id.tv_body_msg);
tv_body_msg.setText(R.string.dialog_msg);
dialog.setCancelable(true);
//點選左側按鈕
btn_left.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//todo 確定
}
});
//點選右鍵
btn_right.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//todo 取消
}
});
if (!mContext.isFinishing()){
dialog.show();
}
}
三,Dialog樣式
設定對話方塊的邊框,透明度,背景等style風格。
<!--自定義對話方塊-->
<style name="dialog1" parent="@android:style/Theme.Dialog">
<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">@android:color/transparent</item>
<!--背景透明-->
<item name="android:backgroundDimEnabled">false</item>
<!--模糊-->
</style>
四,shape形狀
主要是實現對話方塊的圓角效果,dialog最外側圓角用shape形狀定義。
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<!-- 填充的顏色:這裡設定背景透明 -->
<!-- <solid android:color="@android:color/transparent" /> -->
<solid android:color="#FFF" />
<!-- 邊框的顏色 :不能和視窗背景色一樣-->
<stroke
android:width="5dp"
android:color="#ffffff" />
<!-- 設定按鈕的四個角為弧形 -->
<!-- android:radius 弧形的半徑 -->
<corners android:radius="5dip" />
</shape>
五,對話方塊主體xml佈局
定義title,body text,左右按鈕等。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/dialog_shape_bg"
android:layout_margin="10dp"
android:padding="0dp"
android:orientation="vertical">
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="提 示"
android:textSize="20sp"
android:textColor="#666666"
android:layout_marginTop="10dp"
android:layout_gravity="center" />
<TextView
android:id="@+id/tv_body_msg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="250dp"
android:text="@string/dialog_wifi_msg"
android:textSize="18sp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:textColor="#666666"
android:layout_marginTop="10dp"
android:gravity="center" />
<View
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:layout_marginTop="15dp"
android:background="#C2C2C2" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="0dp"
android:orientation="horizontal">
<Button
android:id="@+id/btn_left"
android:layout_width="0dp"
android:layout_height="40dp"
style="android:attr/buttonBarButtonStyle"
android:text="@string/dialog_btn1"
android:textSize="18sp"
android:background="@android:color/transparent"
android:textColor="#006600"
android:layout_weight="1"
/>
<View
android:layout_width="0.5dip"
android:layout_height="match_parent"
android:background="#C2C2C2" android:layout_gravity="center_horizontal" />
<Button
android:id="@+id/btn_right"
android:layout_width="0dp"
android:layout_height="40dp"
style="android:attr/buttonBarButtonStyle"
android:text="@string/dialog_btn2"
android:background="@android:color/transparent"
android:textColor="#006600"
android:layout_weight="1"
/>
</LinearLayout>
</LinearLayout>
總結
android自定義對話方塊,主要的差異就是主體的xml佈局,這裡面的view都可以去實現一些事件操作,比如輸入文字,確定,取消之類的。多多實踐,還是很簡單的。
未完待續,杜乾,Dusan,Q 291902259。
相關文章
- Flutter 23: 圖解自定義 Dialog 對話方塊Flutter圖解
- Android Dialog對話方塊Android
- C++ Qt開發:自定義Dialog對話方塊元件C++QT元件
- C/C++ Qt 自定義Dialog對話方塊元件應用C++QT元件
- Android對話方塊Dialog深度剖析Android
- Android 對話方塊 Dialog 深度剖析Android
- Android UI系列-----Dialog對話方塊AndroidUI
- AlertDialog 自定義對話方塊檢視
- Flutter Widgets 對話方塊-DialogFlutter
- Android UI控制元件系列:Dialog(對話方塊)AndroidUI控制元件
- android漂亮的對話方塊專案sweet-alert-dialogAndroid
- InstallShield自定義對話方塊模板程式碼(轉)
- InstallShield自定義對話方塊淺談(三) (轉)
- InstallShield自定義對話方塊淺談(四) (轉)
- InstallShield自定義對話方塊淺談(五) (轉)
- 自定義一個簡單的載入對話方塊
- Element-Ui元件(三十八)Dialog 對話方塊UI元件
- 直播系統程式碼,自定義平臺私聊對話方塊
- C/C++ Qt Dialog 對話方塊元件應用C++QT元件
- android 多項對話方塊Android
- C++ Qt開發:標準Dialog對話方塊元件C++QT元件
- android常用對話方塊封裝Android封裝
- Android自定義View:View(二)AndroidView
- Android自定義View之區塊選擇器AndroidView
- Android 自定義viewAndroidView
- Android: 自定義ViewAndroidView
- 一對一直播app開發,自定義彈出對話方塊的樣式APP
- Android通知之普通對話方塊通知Android
- Android通知之列表對話方塊通知Android
- Android通知之多選對話方塊通知Android
- 編輯Android程式遊戲對話方塊Android遊戲
- react.js自定義pc桌面端對話方塊|react仿layer彈窗ReactJS
- Word 2007分欄對話方塊中自定義分欄
- Android自定義View整合AndroidView
- svelte元件:svelte3自定義桌面PC端對話方塊元件svelte-layer元件
- Android自定義view中,onDraw和onLayout對比AndroidView
- Android通知之單選對話方塊通知Android
- 對話方塊函式函式