查看: 559|回复: 0

[Android教程] Android编程自定义扁平化对话框示例

发表于 2017-11-28 08:00:01

本文实例讲述了Android编程自定义扁平化对话框。分享给大家供大家参考,具体如下:

平时我们开发的大多数的Android、iOS的APP,它们的风格都是拟物化设计。如Android 4.X、iOS 7、WP8采用的是扁平化设计,可以看出扁平化设计是未来UI设计的趋势。其实扁平化设计要比拟物化设计要简单一点,扁平化设计更加的简约,给人视觉上更加舒服。

Shamoo想到在Android平台上弄一个扁平化的对话框。参考过一篇帖子,然后改了一下。

这个Demo比较简单,首先是一个dialog的布局文件,这个dialog的布局要实例化成对话框可以通过AlertDialog.Builder的setView方法,将LayoutInflater实例化的dialog布局设置对话框具体显示内容。效果图如下:

下面直接贴代码

DialogWindows.Java

  1. package com.example.dialogwindows;
  2. import android.net.Uri;
  3. import android.os.Bundle;
  4. import android.app.Activity;
  5. import android.app.AlertDialog;
  6. import android.app.AlertDialog.Builder;
  7. import android.content.Context;
  8. import android.content.Intent;
  9. import android.view.LayoutInflater;
  10. import android.view.Menu;
  11. import android.view.View;
  12. import android.view.View.OnClickListener;
  13. import android.widget.Button;
  14. import android.widget.ImageButton;
  15. import android.widget.ImageView;
  16. import android.widget.Toast;
  17. public class DialogWindows extends Activity {
  18. private Button button;
  19. private View dialogView;
  20. protected void onCreate(Bundle savedInstanceState) {
  21. super.onCreate(savedInstanceState);
  22. setContentView(R.layout.main);
  23. button = (Button) findViewById(R.id.btn);
  24. button.setOnClickListener(new OnClickListener() {
  25. public void onClick(View v) {
  26. Builder builder = myBuilder(DialogWindows.this);
  27. final AlertDialog dialog = builder.show();
  28. //点击屏幕外侧,dialog不消失
  29. dialog.setCanceledOnTouchOutside(false);
  30. Button btnOK = (Button) dialogView.findViewById(R.id.btn_ok);
  31. btnOK.setOnClickListener(new OnClickListener() {
  32. public void onClick(View v) {
  33. Toast.makeText(DialogWindows.this, "你点击了确定按钮", Toast.LENGTH_SHORT).show();
  34. dialog.dismiss();
  35. }
  36. });
  37. Button btnCancel = (Button) dialogView.findViewById(R.id.btn_cancel);
  38. btnCancel.setOnClickListener(new OnClickListener() {
  39. public void onClick(View v) {
  40. Toast.makeText(DialogWindows.this, "你点击了取消按钮", Toast.LENGTH_SHORT).show();
  41. dialog.dismiss();
  42. }
  43. });
  44. ImageButton customviewtvimgCancel = (ImageButton) dialogView.findViewById(R.id.btn_exit);
  45. customviewtvimgCancel.setOnClickListener(new OnClickListener() {
  46. public void onClick(View v) {
  47. Toast.makeText(DialogWindows.this, "你点击了退出按钮", Toast.LENGTH_SHORT).show();
  48. dialog.dismiss();
  49. }
  50. });
  51. }
  52. });
  53. }
  54. protected Builder myBuilder(Context context) {
  55. LayoutInflater inflater = getLayoutInflater();
  56. AlertDialog.Builder builder = new AlertDialog.Builder(context);
  57. dialogView = inflater.inflate(R.layout.dialog, null);
  58. return builder.setView(dialogView);
  59. }
  60. }
复制代码

dialog.xml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:orientation="vertical" >
  6. <!-- 标题栏 -->
  7. <RelativeLayout
  8. android:id="@+id/dialog_title"
  9. android:layout_width="fill_parent"
  10. android:layout_height="wrap_content"
  11. android:background="#1A94F9" >
  12. <TextView
  13. android:id="@+id/tv_title"
  14. android:layout_width="wrap_content"
  15. android:layout_height="wrap_content"
  16. android:layout_centerVertical="true"
  17. android:padding="10dp"
  18. android:text="@string/about"
  19. android:textColor="#000000" />
  20. <ImageButton
  21. android:id="@+id/btn_exit"
  22. android:layout_width="40dp"
  23. android:layout_height="40dp"
  24. android:layout_alignParentRight="true"
  25. android:layout_centerVertical="true"
  26. android:background="@drawable/canceltor" />
  27. </RelativeLayout>
  28. <!-- 显示的内容 -->
  29. <LinearLayout
  30. android:id="@+id/dialog_msg"
  31. android:layout_width="wrap_content"
  32. android:layout_height="wrap_content"
  33. android:orientation="vertical"
  34. android:layout_below="@id/dialog_title"
  35. android:padding="20dp" >
  36. <TextView
  37. android:layout_width="wrap_content"
  38. android:layout_height="wrap_content"
  39. android:text="@string/author"
  40. android:textColor="#ffffff" />
  41. <TextView
  42. android:layout_width="wrap_content"
  43. android:layout_height="wrap_content"
  44. android:linksClickable="true"
  45. android:text="@string/blog"
  46. android:textColor="#ffffff" />
  47. </LinearLayout>
  48. <!-- 底部按钮 -->
  49. <LinearLayout
  50. android:id="@+id/customviewlayLink"
  51. android:layout_width="fill_parent"
  52. android:layout_height="wrap_content"
  53. android:layout_below="@id/dialog_msg"
  54. android:orientation="horizontal"
  55. android:paddingLeft="20dp"
  56. android:paddingRight="20dp"
  57. android:paddingBottom="20dp" >
  58. <Button
  59. android:id="@+id/btn_ok"
  60. android:layout_width="fill_parent"
  61. android:layout_height="40dp"
  62. android:background="@drawable/linkbtnbged"
  63. android:linksClickable="true"
  64. android:layout_weight="1"
  65. android:layout_marginRight="10dp"
  66. android:text="@string/btn_ok" />
  67. <Button
  68. android:id="@+id/btn_cancel"
  69. android:layout_width="fill_parent"
  70. android:layout_height="40dp"
  71. android:linksClickable="true"
  72. android:background="@drawable/linkbtnbged"
  73. android:text="@string/btn_cancel"
  74. android:layout_marginLeft="10dp"
  75. android:layout_weight="1" />
  76. </LinearLayout>
  77. </RelativeLayout>
复制代码

main.xml

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent" >
  5. <Button
  6. android:id="@+id/btn"
  7. android:layout_width="wrap_content"
  8. android:layout_height="wrap_content"
  9. android:layout_centerHorizontal="true"
  10. android:layout_centerVertical="true"
  11. android:text="@string/show_dialog" />
  12. </RelativeLayout>
复制代码

更多关于Android相关内容感兴趣的读者可查看本站专题:《android开发入门与进阶教程》、《Android调试技巧与常见问题解决方法汇总》、《Android基本组件用法总结》、《Android视图View技巧总结》、《Android布局layout技巧总结》及《Android控件用法总结》

希望本文所述对大家Android程序设计有所帮助。



回复

使用道具 举报

关闭

站长推荐上一条 /1 下一条