Android登录界面之用户数据保存+服务器上传（一）

                                                     基本功：完整版登录界面

所谓完整版登录界面是带验证的登录界面

也是是包含注册登录

注册：包含输入用户手机或者信息，发起请求，等待服务器发来验证码或者怎样的注册，同时注册信息保存在本地数据库，等待下一次打开app，自动登录

登录：将用户请求输入的内容与后台保存的数据做对比验证，例如：密码一致则获得通过

===================================================================================

最基本的：

首先完成登录界面，希望大家做正规的登录界面，这些重用性非常高，一次做好，多个项目收益，所以这次我们不做最简单的demo，而是往一个基本的产品去靠方向。

首先：

两个界面

登录界面+注册界面：

学会定义：一些参数，背景之类的的设置最好不要设置在布局文件中，为了重复利用以及规范化一律定义在

styles  dimen   drawable color  等里面：

例如：

 

 

   <ImageView
            android:id="@+id/back"
            android:padding="12dp"
            android:layout_width="@dimen/title_bar_height"
            android:layout_height="@dimen/title_bar_height"
            android:src="@drawable/jiantou" />

 这里面：布局高度，宽度都是定义在dimen里面。现在放上登录注册的效果图来看一下：

 

简单的登录+注册界面，这里需要注意的，不仅是布局参数设置，还有对密码的监控，这里我们需要判断密码输入是不是符合规范，在安卓里面一般布局函数还是在xml里面设置的，但是有的时候需要动态监控控件状态在xml里面肯定是不好配置的，所以我们需要代码监控，做好完整版的登录注册，这一步也是需要做的，现在看一下我们负责监控的.java函数：

首先看一下这个px dp互转的概念：

在xml布局文件中，我们既可以设置px，也可以设置dp（或者dip）。一般情况下，我们都会选择使用dp，这样可以保证不同屏幕分辨率的机器上布局一致。但是在代码中，如何处理呢？很多控件的方法中都只提供了设置px的方法，例如setPadding，并没有提供设置dp的方法。这个时候，如果需要设置dp的话，就要将dp转换成px了。

下面是显示了px 与dp互转的概念例子：

public class dp_to_px {
	
	/**
	* 根据手机的分辨率从 dp 的单位 转成为 px(像素)
	*/
	public static int dip2px(Context context, float dpValue) {
	  final float scale = context.getResources().getDisplayMetrics().density;
	  return (int) (dpValue * scale + 0.5f);
	}

	/**
	* 根据手机的分辨率从 px(像素) 的单位 转成为 dp
	*/
	public static int px2dip(Context context, float pxValue) {
	  final float scale = context.getResources().getDisplayMetrics().density;
	  return (int) (pxValue / scale + 0.5f);
	}

}

 这是一个公式，宝宝自己也不是很懂公式转换原理，反正需要的时候网上一搜就有很多例子，拿来直接用就行了。

现在正式贴上ClearEditText的监控代码：

 

public class ClearEditText extends EditText implements OnFocusChangeListener,
		TextWatcher {
	/**
	 * 带删除按钮的editText
	 */
	private Drawable mClearDrawable; // 删除图标
	private boolean hasFoucs;
	private int imgdp = 0;

	public ClearEditText(Context context) {
		this(context, null);
	}

	public ClearEditText(Context context, AttributeSet attrs) {
		this(context, attrs, android.R.attr.editTextStyle);
	}

	public ClearEditText(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init();
	}

	private void init() {
		// 获取EditText的DrawableRight,假如没有设置就使用默认的图片,2是获得右边的图片 顺序是左上右下（0,1,2,3)
		/*
		 * 主要是为了处理监听输入密码后的一键删除的图标
		 */
		mClearDrawable = getCompoundDrawables()[2];
		if (mClearDrawable == null) {
			mClearDrawable = getResources().getDrawable(R.drawable.dian);
		}

		imgdp = dip2px(getContext(), 30); // 转换dp
		// rightDrawable.setBounds(0, 0, imgdp, imgdp);
		mClearDrawable.setBounds(0, 0, imgdp, imgdp);
		// 默认设置隐藏图标
		setClearIconVisible(false);
		// 设置焦点改变的监听
		setOnFocusChangeListener(this);
		// 设置输入框里面内容发生改变的监听
		addTextChangedListener(this);
	}

	@Override
	//这里判断输入时，自动设置edit清空。目的为删除“输入密码”这一句的提示语
	public boolean onTouchEvent(MotionEvent event) {
		if (event.getAction() == MotionEvent.ACTION_UP) {
			if (getCompoundDrawables()[2] != null) {
				boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight())
						&& (event.getX() < ((getWidth() - getPaddingRight())));
				if (touchable) {
					this.setText("");
				}
			}
		}
		return super.onTouchEvent(event);
	}

	/**
	 * 当ClearEditText焦点发生变化的时候，判断里面字符串长度设置清除图标的显示与隐藏?
	 */
	@Override
	public void onFocusChange(View v, boolean hasFocus) {
		this.hasFoucs = hasFocus;
		//有焦点，字符大于0显示删除图标
		if (hasFocus) {
			setClearIconVisible(getText().length() > 0);
		} else {
			setClearIconVisible(false);
		}
	}

	/**
	 * 设置清除图标的显示与隐藏，调用setCompoundDrawables为EditText绘制上去
	 * 
	 * @param visible
	 */
	protected void setClearIconVisible(boolean visible) {
		Drawable right = visible ? mClearDrawable : null;
		setCompoundDrawables(getCompoundDrawables()[0],
				getCompoundDrawables()[1], right, getCompoundDrawables()[3]);
	}

	/**
	 * 当输入框里面内容发生变化的时候回调的方法
	 */
	@Override
	public void onTextChanged(CharSequence s, int start, int count, int after) {
		if (hasFoucs) {
			setClearIconVisible(s.length() > 0);
		}
	}

	@Override
	public void beforeTextChanged(CharSequence s, int start, int count,
			int after) {

	}

	@Override
	public void afterTextChanged(Editable s) {

	}

	// dp转px
	public static int dip2px(Context context, float dpValue) {
		final float scale = context.getResources().getDisplayMetrics().density;
		return (int) (dpValue * scale + 0.5f);

	}
}

 登录的布局：

 下面几节课，会涉及到数据库，及动态读取用户信息，用户信息保存到本地，以及向后台的服务请求