Android UI组件进阶(2)——仿Windows对话框

在开始本章前先祝大家中秋节快乐哈,相信很多上班的朋友都是放三天假的哈！

有时间的话回家陪陪父母吧!树欲静而风不止,子欲养而亲不待!岁月不饶人!

好了,道理和祝福语就说到这里了,今天给大家准备的是模仿Windows风格对话框!

效果图:

相信大部分的AlertDialog都是下面这个样子的:

今天给大家讲解的对话框是下面这样的:

对比两种对话框,站在用户的角度,相信你更加钟情于第二种颜色鲜明的对话框

好了下面就开始讲解如何制作模仿windows风格的对话框吧!

代码的逻辑流程:

其实就是自定义对话框的布局,然后加载以及完成相应的事件处理而已！

核心代码解析:

①按钮点击效果:btnexit_selctor.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="false" android:drawable="@drawable/btnexit"/>
	<item android:state_pressed="true" android:drawable="@drawable/btnexit_s"/>
</selector>

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/RelativeLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <RelativeLayout
        android:id="@+id/titlelayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:background="#53CC66"
        android:padding="5dp" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="提示信息"
            android:textColor="#ffffff"
            android:textSize="15sp" />
        <ImageButton
            android:id="@+id/btncancle" 
        	android:layout_width="30dp"
        	android:layout_height="30dp"
        	android:background="@drawable/btnexit_selctor"
        	android:layout_alignParentRight="true"    
        />
        
    </RelativeLayout>
    
   

    <LinearLayout
        android:id="@+id/detaillayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/titlelayout"
        android:layout_marginLeft="30dp"
        android:layout_marginTop="22dp"
        android:orientation="vertical" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:text="仿Windows对话框Demo"
            android:textColor="#04AEDA"
            android:textSize="18sp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:text="作者:Coder-pig"
            android:textColor="#04AEDA"
            android:textSize="18sp" />
    </LinearLayout>
    
     <LinearLayout
        android:layout_marginTop="30dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_below="@+id/detaillayout"
    >
        
     <Button
         	android:id="@+id/btnblog"
        	android:layout_width="match_parent"
        	android:layout_height="40dp"
        	android:background="@drawable/btnpress_selctor"
        	android:text="访问博客"
        	android:layout_margin="5dp"
            android:layout_weight="1"
            android:textColor="#ffffff"
            android:textSize="20sp"  
      />
      
     <Button
            android:id="@+id/btnclose" 
        	android:layout_width="match_parent"
        	android:layout_height="40dp"
        	android:background="@drawable/btnpress_selctor"
        	android:text="关闭"
        	android:layout_margin="5dp"
            android:layout_weight="1" 
            android:textColor="#ffffff"
            android:textSize="20sp" 
      />
        
    </LinearLayout>
    
</RelativeLayout>

package com.jay.example.windowsdialogdemo;

import android.app.Activity;
import android.app.AlertDialog;
import android.app.AlertDialog.Builder;
import android.content.Context;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;

import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageButton;
import android.widget.Toast;

public class MainActivity extends Activity {

	private Button btnshow;
	private View dialogView;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		btnshow = (Button) findViewById(R.id.btnshow);
		btnshow.setOnClickListener(new OnClickListener() {	
			@Override
			public void onClick(View v) {
				
				Builder builder = myBuilder(MainActivity.this);
				final AlertDialog dialog = builder.show();
				//设置点击屏幕外侧，对话框不消失,不设置的话点外面对话框就会消失
				dialog.setCanceledOnTouchOutside(false);
				//接着要监听对话框中的三个按钮:
				//①关闭对话框的按钮:
				ImageButton imgcancle = (ImageButton) dialogView.findViewById(R.id.btncancle);
				imgcancle.setOnClickListener(new OnClickListener() {	
					@Override
					public void onClick(View v) {
						dialog.dismiss();
					}
				});
				
				//①链接到博客的按钮
				Button btnblob = (Button) dialogView.findViewById(R.id.btnblog);
				btnblob.setOnClickListener(new OnClickListener() {	
					@Override
					public void onClick(View v) {
						Toast.makeText(getApplicationContext(), "访问博客", Toast.LENGTH_SHORT).show();
						Uri uri = Uri.parse("http://blog.csdn.net/coder_pig");
						Intent intent = new Intent(Intent.ACTION_VIEW, uri);
						startActivity(intent);
						dialog.dismiss();	
					}
				});
				
				//③点击退出的按钮:
				Button btnclose = (Button) dialogView.findViewById(R.id.btnclose);
				btnclose.setOnClickListener(new OnClickListener() {

					public void onClick(View v) {
						dialog.dismiss();
					}
				});
			}

			
			//定义一个返回Builder对象的方法,其实这里是设置对话框显示view内容的方法
			private Builder myBuilder(Context context) {
				final LayoutInflater inflater = MainActivity.this.getLayoutInflater();
				AlertDialog.Builder builder = new AlertDialog.Builder(context);
				dialogView = inflater.inflate(R.layout.dialog_win, null);
				return builder.setView(dialogView);
			}	
		});
	}
	
}

实例代码下载:

http://pan.baidu.com/s/1jGone5o

Android UI组件进阶(2)——仿Windows对话框