码迷,mamicode.com
首页 > 其他好文 > 详细

登录界面、AutoUtils 屏幕适配、自定义Edittext(显示密码可见和一键清空)和 TextInputLayout的使用。

时间:2017-05-23 23:52:13      阅读:850      评论:0      收藏:0      [点我收藏+]

标签:single   layout   sig   group   else   ssi   viewgroup   etl   简单   

  1.  登录界面:


    技术分享

  2.  AutoUtils自动屏幕适配:

      • AutoUtils屏幕适配使用的方法 :
        • 1、将AutoUtils类复制到要适配的项目中;

          2、在程序的入口(清单文件filter):
          super.onCreate(savedInstanceState);
          //屏幕适配,这里是以720*1280分辨率为基准的适配
          AutoUtils.setSize(this, false, 720, 1280);

          * 这里我们UI是以1920*1280分辨率做图的,并且是横屏显示:
          AutoUtils.setSize(this, false, 1920, 1280);

          View view=View.inflate(this,R.layout.activity_splash,null);
          AutoUtils.auto(view);
          setContentView(view);

          3、在activity中
          View view=View.inflater(this,R.layout.activity_splash,null);
          AutoUtils.auto(view);//放在加载布局的前面
          setContentView(view);

          4、在碎片中
          View view=View.inflate(context,R.layout.view_layout,null);
          AutoUtils.auto(view);

      • AutoUtils代码:
            
          1 package com.cfuas.utils;
          2 
          3 import android.app.Activity;
          4 import android.content.Context;
          5 import android.content.res.Resources;
          6 import android.util.TypedValue;
          7 import android.view.Display;
          8 import android.view.View;
          9 import android.view.ViewGroup;
         10 import android.widget.TextView;
         11 
         12 /**
         13  * 
         14  * @author  这是一个进行屏幕适配的类
         15  *
         16  */
         17 
         18 public class AutoUtils {
         19 
         20     private static int displayWidth;
         21     private static int displayHeight;
         22     
         23     private static int designWidth;
         24     private static int designHeight;
         25     
         26     private static double textPixelsRate;
         27     
         28     public static void setSize(Activity act, boolean hasStatusBar, int designWidth, int designHeight){
         29         if(act==null || designWidth<1 || designHeight<1)return;
         30         
         31         Display display = act.getWindowManager().getDefaultDisplay();
         32         int width = display.getWidth();
         33         int height = display.getHeight();
         34         
         35         if (hasStatusBar) {
         36             height -= getStatusBarHeight(act);
         37         }
         38         
         39         AutoUtils.displayWidth=width;
         40         AutoUtils.displayHeight=height;
         41         
         42         AutoUtils.designWidth=designWidth;
         43         AutoUtils.designHeight=designHeight;
         44         
         45         double displayDiagonal= Math.sqrt(Math.pow(AutoUtils.displayWidth, 2)+ Math.pow(AutoUtils.displayHeight, 2));
         46         double designDiagonal= Math.sqrt(Math.pow(AutoUtils.designWidth, 2)+ Math.pow(AutoUtils.designHeight, 2));
         47         AutoUtils.textPixelsRate=displayDiagonal/designDiagonal;    
         48     }
         49     
         50     public static int getStatusBarHeight(Context context)
         51     {
         52         int result = 0;
         53         try {
         54             int resourceId = context.getResources().getIdentifier(
         55                     "status_bar_height", "dimen", "android");
         56             if (resourceId > 0) {
         57                 result = context.getResources().getDimensionPixelSize(
         58                         resourceId);
         59             }
         60         } catch (Resources.NotFoundException e) {
         61             e.printStackTrace();
         62         }
         63         return result;
         64     }
         65     
         66     public static void auto(Activity act){
         67         if(act==null || displayWidth<1 || displayHeight<1)return;
         68         
         69         View view=act.getWindow().getDecorView();
         70         auto(view);
         71     }
         72     
         73     public static void auto(View view){
         74         if(view==null || displayWidth<1 || displayHeight<1)return;
         75         
         76         AutoUtils.autoTextSize(view);
         77         AutoUtils.autoSize(view);
         78         AutoUtils.autoPadding(view);
         79         AutoUtils.autoMargin(view);
         80         
         81         if(view instanceof ViewGroup){
         82             auto((ViewGroup)view);
         83         }
         84         
         85     }
         86     
         87     private static void auto(ViewGroup viewGroup){
         88         int count = viewGroup.getChildCount();
         89         
         90         for (int i = 0; i < count; i++) {
         91 
         92             View child = viewGroup.getChildAt(i);
         93             
         94             if(child!=null){
         95                 auto(child);
         96             }
         97         }
         98     }
         99     
        100     public static void autoMargin(View view){
        101         if (!(view.getLayoutParams() instanceof ViewGroup.MarginLayoutParams))
        102             return;
        103 
        104         ViewGroup.MarginLayoutParams lp = (ViewGroup.MarginLayoutParams) view.getLayoutParams();
        105         if(lp == null)return ;
        106 
        107         lp.leftMargin = getDisplayWidthValue(lp.leftMargin);
        108         lp.topMargin = getDisplayHeightValue(lp.topMargin);
        109         lp.rightMargin = getDisplayWidthValue(lp.rightMargin);
        110         lp.bottomMargin = getDisplayHeightValue(lp.bottomMargin);
        111         
        112     }
        113 
        114     public static void autoPadding(View view){
        115         int l = view.getPaddingLeft();
        116         int t = view.getPaddingTop();
        117         int r = view.getPaddingRight();
        118         int b = view.getPaddingBottom();
        119 
        120         l = getDisplayWidthValue(l);
        121         t = getDisplayHeightValue(t);
        122         r = getDisplayWidthValue(r);
        123         b = getDisplayHeightValue(b);
        124 
        125         view.setPadding(l, t, r, b);
        126     }
        127 
        128     public static void autoSize(View view){
        129         ViewGroup.LayoutParams lp = view.getLayoutParams();
        130 
        131         if (lp == null) return;
        132         
        133         if(lp.width>0){
        134             lp.width = getDisplayWidthValue(lp.width);
        135         }
        136 
        137         if(lp.height>0){
        138             lp.height = getDisplayHeightValue(lp.height);
        139         }
        140         
        141     }
        142     
        143     public static void autoTextSize(View view){
        144         if(view instanceof TextView){
        145             double designPixels=((TextView) view).getTextSize();
        146             double displayPixels=textPixelsRate*designPixels;
        147             ((TextView) view).setIncludeFontPadding(false);
        148             ((TextView) view).setTextSize(TypedValue.COMPLEX_UNIT_PX, (float) displayPixels);
        149         }
        150     }
        151 
        152     public static int getDisplayWidthValue(int designWidthValue){
        153         if(designWidthValue<2){
        154             return designWidthValue;
        155         }
        156         return designWidthValue * displayWidth / designWidth;
        157     }
        158 
        159     public static int getDisplayHeightValue(int designHeightValue){
        160         if(designHeightValue<2){
        161             return designHeightValue;
        162         }
        163         return designHeightValue * displayHeight / designHeight;
        164     }
        165 }

         

  3. 自定义Edittext输入显示密码和清空内容:

      • 自定义Edittext步骤:
        • 初始化
        1. 创建InputEdittext类继承Edittext;
        2. 重写两个构造方法,可以使用attrs;在构造中初始化init();
        3. 在res/values创建Attrs定义属性:
          <?xml version="1.0" encoding="utf-8"?>
          <resources>
          <declare-styleable name="inputAttrs">
          <attr name="closeTogDrawable" format="reference|color"/>
          <attr name="passwordTogDrawableOpen" format="reference|color"/>
          <attr name="passwordTogDrawableClose" format="reference|color"/>
          <attr name="closeTogEnabled" format="boolean"/>
          <attr name="passwordTogEnabled" format="boolean"/>
          </declare-styleable>
          </resources>
        4. context.obtainSytledAttribute()得到TypedArray对象ta,ta.getDrawble获得对应的属性对象,不要忘记了ta.recycle()方法循环.
        5. Drawble需要判断是否为null并且setBounds设置值边距;

        • onDraw:
          初始化完成现在需要将图片画到画布上;
        1. 我们有三个drawble图片所以需要画三个draw创建三个绘制方法(列:本地保存矩阵,结束修复矩阵):
          1     private void closeDraw(Canvas canvas) {
          2         canvas.save();
          3         canvas.translate(getWidth() - mCloseDrawable.getIntrinsicWidth(), getHeight() / 2 - mCloseDrawable.getIntrinsicHeight() / 2);
          4         if (mCloseDrawable != null) {
          5             mCloseDrawable.draw(canvas);
          6         }
          7         canvas.restore();
          8     }
        2. 在onDraw()方法里,判断是否激活是否length>0,满足条件调用对于的绘制方法;

        • onTouchEvent:
          根据判断MotionEvents的up事件点击的范围做逻辑处理;
          1    if (mCloseEnabled&& event.getX() > getWidth() - mCloseDrawable.getIntrinsicWidth()) {
          3                     setText("");
          4                     return true;
          5                 }
      • 自定义EditText代码:
          1 public class InputEditext extends EditText {
          2     private static final String TAG = "INputEdittext";
          3     private AttributeSet mAttrs;
          4     private Drawable mCloseDrawable;
          5     private Drawable mPasswordTogDrawableOpen;
          6     private Drawable passwordTogDrawableClose;
          7     private boolean mCloseEnabled;
          8     private boolean mPasswordEnabled = false;
          9     private boolean mPasswordVisible = false;
         10 
         11     Paint mPaint;
         12     Paint mPaint2;
         13 //    Bitmap clearBtm;
         14 //    Bitmap passwrodBtm1;
         15 //    Bitmap passwrodBtm2;
         16 //    private Drawable mPasswordDrawable2;
         17 
         18 
         19     public InputEditext(Context context, AttributeSet attrs) {
         20         super(context, attrs);
         21         init(context, attrs);
         22         Log.d(TAG, "InputEditext: " + 2);
         23     }
         24 
         25     private void init(Context context, AttributeSet attrs) {
         26         mPaint = getPaint();
         27         mPaint2 = getPaint();
         28         BitmapFactory.Options op = new BitmapFactory.Options();
         29         op.inJustDecodeBounds = true;
         30 
         31         if (attrs != null) {
         32             TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.inputAttrs);
         33             mPasswordTogDrawableOpen = ta.getDrawable(R.styleable.inputAttrs_passwordTogDrawableOpen);
         34             passwordTogDrawableClose = ta.getDrawable(R.styleable.inputAttrs_passwordTogDrawableClose);
         35             mCloseDrawable = ta.getDrawable(R.styleable.inputAttrs_closeTogDrawable);
         36 
         37             if (mCloseDrawable != null) {
         38                 mCloseDrawable.setBounds(0, 0, mCloseDrawable.getIntrinsicWidth(), mCloseDrawable.getIntrinsicHeight());
         39             }
         40 
         41             if (mPasswordTogDrawableOpen != null) {
         42                 mPasswordTogDrawableOpen.setBounds(0, 0, mPasswordTogDrawableOpen.getIntrinsicWidth(), mPasswordTogDrawableOpen.getIntrinsicHeight());
         43             }
         44             if (passwordTogDrawableClose != null) {
         45                 passwordTogDrawableClose.setBounds(0, 0, passwordTogDrawableClose.getIntrinsicWidth(), passwordTogDrawableClose.getIntrinsicHeight());
         46             }
         47 
         48             mCloseEnabled = ta.getBoolean(R.styleable.inputAttrs_closeTogEnabled, false);
         49             mPasswordEnabled = ta.getBoolean(R.styleable.inputAttrs_passwordTogEnabled, false);
         50 
         51             ta.recycle();
         52         }
         53 
         54 //        clearBtm = BitmapFactory.decodeResource(getContext().getResources(), R.mipmap.btn_close);
         55 //        passwrodBtm1 = BitmapFactory.decodeResource(getContext().getResources(), R.mipmap.btn_attention1);
         56 //        passwrodBtm2 = BitmapFactory.decodeResource(getContext().getResources(), R.mipmap.btn_attention2);
         57 
         58     }
         59 
         60     @Override
         61     protected void onDraw(Canvas canvas) {
         62         super.onDraw(canvas);
         63         if (mCloseEnabled) {
         64             if (getText().toString().length() > 0)
         65                 closeDraw(canvas);
         66 //            canvas.drawBitmap(clearBtm, getWidth() - clearBtm.getWidth(), getHeight() / 2 - clearBtm.getHeight() / 2, mPaint);
         67         }
         68 
         69         if (mPasswordEnabled && getText().toString().length() > 0) {
         70             if (mPasswordVisible) {
         71 //                canvas.drawBitmap(passwrodBtm2, getWidth() - passwrodBtm2.getWidth() * 2 - 12, getHeight() / 2 - passwrodBtm2.getHeight() / 2, mPaint2);
         72                 passwrodDrawOpen(canvas);
         73             } else {
         74 //                canvas.drawBitmap(passwrodBtm1, getWidth() - passwrodBtm1.getWidth() * 2 - 12, getHeight() / 2 - passwrodBtm1.getHeight() / 2, mPaint2);
         75                 passwrodDrawClose(canvas);
         76             }
         77         }
         78     }
         79 
         80     private void closeDraw(Canvas canvas) {
         81         canvas.save();
         82         canvas.translate(getWidth() - mCloseDrawable.getIntrinsicWidth(), getHeight() / 2 - mCloseDrawable.getIntrinsicHeight() / 2);
         83         if (mCloseDrawable != null) {
         84             mCloseDrawable.draw(canvas);
         85         }
         86         canvas.restore();
         87     }
         88 
         89     private void passwrodDrawOpen(Canvas canvas) {
         90         canvas.save();
         91         canvas.translate(getWidth() - mPasswordTogDrawableOpen.getIntrinsicWidth() * 2 - 15, getHeight() / 2 - mPasswordTogDrawableOpen.getIntrinsicHeight() / 2);
         92         if (mPasswordTogDrawableOpen != null) {
         93             mPasswordTogDrawableOpen.draw(canvas);
         94         }
         95         canvas.restore();
         96     }
         97 
         98     private void passwrodDrawClose(Canvas canvas) {
         99         canvas.save();
        100         canvas.translate(getWidth() - passwordTogDrawableClose.getIntrinsicWidth() * 2 - 15, getHeight() / 2 - passwordTogDrawableClose.getIntrinsicHeight() / 2);
        101         if (passwordTogDrawableClose != null) {
        102             passwordTogDrawableClose.draw(canvas);
        103         }
        104         canvas.restore();
        105     }
        106 
        107     @Override
        108     public boolean onTouchEvent(MotionEvent event) {
        109         switch (event.getAction()) {
        110             case MotionEvent.ACTION_UP:
        111                 if (mCloseEnabled
        112                         && event.getX() > getWidth() - mCloseDrawable.getIntrinsicWidth()) {
        113                     setText("");
        114                     return true;
        115                 }
        116 
        117                 if (mPasswordEnabled
        118                         && event.getX() > getWidth() - mCloseDrawable.getIntrinsicWidth() * 2 - 15
        119                         && event.getY() > 0
        120                         && event.getY() < getHeight()
        121                         ) {
        122                     if (mPasswordVisible) {
        123                         setTransformationMethod(PasswordTransformationMethod.getInstance());
        124                         mPasswordVisible = false;
        125                     } else {
        126                         setTransformationMethod(HideReturnsTransformationMethod.getInstance());
        127                         mPasswordVisible = true;
        128                     }
        129                     return true;
        130                 }
        131                 break;
        132 
        133         }
        134 
        135         return super.onTouchEvent(event);
        136     }
        137 }

         

         


         
  4. TextInputLayout的使用:

      使用EditText的hint属性,用户在输入的时候hint会消失,用户的体验效果是十分不好的.TextInputLayout的出现就是为了解决这个问题.输入时可以将hint升上去。使用也十分简单:
    1. TextInputLayout是MaterialDesign材料设计需要在build文件里依赖:
      compile ‘com.android.support:design:25.3.1‘
    2. 在editext布局外包一层TextInputLayout就可以了,属性也很简单。
    3. 使用注意:
      mNameUser = usernameWrapper.getEditText().getText().toString();
      mPassword = passwordWrapper.getEditText().getText().toString();
      便可以得到String对象。
      usernameWrapper.setError(getString(R.string.error_username_verify)):可是设置错误提示
      usernameWrapper.setErrorEnabled(false):错误是否启动一个错误的布局,是否重新布局。
      usernameWrapper.setHint(getString(R.string.hint_username)):设置提示;
       
  5. 主界面使用:

     1 <?xml version="1.0" encoding="utf-8"?>
     2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     3                 xmlns:app="http://schemas.android.com/apk/res-auto"
     4                 xmlns:tools="http://schemas.android.com/tools"
     5                 android:layout_width="match_parent"
     6                 android:layout_height="match_parent"
     7                 android:background="@mipmap/login_bg"
     8                 android:padding="@dimen/activity_horizontal_margin"
     9                 tools:context="com.cfuas.ui.LoginActivity">
    10 
    11 
    12     <LinearLayout
    13         android:layout_width="1200px"
    14         android:layout_height="624px"
    15         android:layout_centerInParent="true"
    16         android:background="@mipmap/loginbox_bg"
    17         android:gravity="center"
    18         android:orientation="vertical">
    19 
    20 
    21         <android.support.design.widget.TextInputLayout
    22             android:id="@+id/usernameWrapper"
    23             android:layout_width="576px"
    24             android:layout_height="wrap_content"
    25             android:layout_marginBottom="12px"
    26             android:orientation="horizontal"
    27             android:textColorHint="@color/login_hint_color"
    28             >
    29 
    30             <com.cfuas.view.InputEditext
    31                 android:id="@+id/username"
    32                 android:layout_width="match_parent"
    33                 android:layout_height="wrap_content"
    34                 android:background="@drawable/bg_edittext_focused"
    35                 android:drawableLeft="@mipmap/icon_user"
    36                 android:drawablePadding="30px"
    37                 android:hint="@string/hint_username"
    38                 android:imeOptions="actionNext"
    39                 android:inputType="none"
    40                 android:lines="1"
    41                 android:maxLength="18"
    42                 android:singleLine="true"
    43                 android:textColor="@color/login_text_white"
    44                 android:textColorHint="@color/login_hint_color"
    45                 android:textSize="36px"
    46                 app:closeTogDrawable="@mipmap/btn_close"
    47                 app:closeTogEnabled="true"
    48                 />
    49 
    50 
    51         </android.support.design.widget.TextInputLayout>
    52 
    53 
    54         <android.support.design.widget.TextInputLayout
    55             android:id="@+id/passwordWrapper"
    56             android:layout_width="576px"
    57             android:layout_height="wrap_content"
    58             android:textColorHint="@color/login_hint_color"
    59             >
    60 
    61             <com.cfuas.view.InputEditext
    62                 android:id="@+id/password"
    63                 android:layout_width="match_parent"
    64                 android:layout_height="wrap_content"
    65                 android:background="@drawable/bg_edittext_focused"
    66                 android:drawableLeft="@mipmap/icon_password"
    67                 android:drawablePadding="30px"
    68                 android:hint="@string/hint_password"
    69                 android:imeOptions="actionDone"
    70                 android:inputType="textPassword"
    71                 android:lines="1"
    72                 android:maxLength="18"
    73                 android:singleLine="true"
    74                 android:textColor="@color/login_text_white"
    75                 android:textColorHint="@color/login_hint_color"
    76                 android:textSize="36px"
    77                 app:passwordTogEnabled="true"
    78                 app:passwordTogDrawableOpen="@mipmap/btn_attention1"
    79                 app:passwordTogDrawableClose="@mipmap/btn_attention2"
    80                 app:closeTogEnabled="true"
    81                 app:closeTogDrawable="@mipmap/btn_close"
    82                 />
    83         </android.support.design.widget.TextInputLayout>
    84 
    85         <Button
    86             android:id="@+id/btn"
    87             android:layout_width="576px"
    88             android:layout_height="84px"
    89             android:layout_marginTop="30px"
    90             android:background="@drawable/btn_login_selector"
    91             android:text="@string/btn_logint"
    92             android:textColor="@color/login_text_white"
    93             />
    94 
    95     </LinearLayout>
    96 
    97 </RelativeLayout>

     

     

     1 public class LoginActivity extends Activity {
     2     private String session_id;
     3     Button mButton;
     4     TextInputLayout usernameWrapper;
     5     TextInputLayout passwordWrapper;
     6     private String mNameUser;
     7     private String mPassword;
     8     private SharePreUser mSharePreUser;
     9 
    10     @Override
    11     protected void onCreate(Bundle savedInstanceState) {
    12         super.onCreate(savedInstanceState);
    13         AutoUtils.setSize(this, false, 1920, 1080);
    14         View view = View.inflate(this, R.layout.activity_login, null);
    15         AutoUtils.auto(view);
    16         setContentView(view);
    17 
    18         mSharePreUser = new SharePreUser(this);
    19         String userSessionId = SharePreUser.getUserSessionId(this);
    20 //        if (!StringUtil.isEmpty(userSessionId)) {
    21 //            startActivity(new Intent(LoginActivity.this, MainActivity.class));
    22 //        }
    23         initView();
    24         initData();
    25         initEvent();
    26     }
    27 
    28     private void initEvent() {
    29         mButton.setOnClickListener(new View.OnClickListener() {
    30 
    31             @Override
    32             public void onClick(View v) {
    33                 //关闭输入框
    34                 ShowUtils.hideKeyboard(LoginActivity.this);
    35 
    36                 mNameUser = usernameWrapper.getEditText().getText().toString();
    37                 mPassword = passwordWrapper.getEditText().getText().toString();
    38 
    39                 if (!VerifyDataUtils.verifyUserName(mNameUser)) {           //校验账号 !VerifyDataUtils.verifyUserName(nameUser)
    40                     usernameWrapper.setError(getString(R.string.error_username_verify));
    41                 } else if (!VerifyDataUtils.validatePassword(mPassword)) {   //校验密码
    42                     passwordWrapper.setError(getString(R.string.error_password_verify));
    43                 } else {
    44                     //错误是否启动一个错误的布局(true:错误了重新输入错误提示还在,false错误后重新输入提示不在)
    45                     usernameWrapper.setErrorEnabled(false);
    46                     passwordWrapper.setErrorEnabled(false);
    47                     doLogin();
    48                 }
    49             }
    50         });
    51     }
    52 
    53     private void doLogin() {
    54 
    55         Commander.logon(mNameUser, mPassword, new HttpCmdCallback<LogonInfo>() {
    56 
    57             @Override
    58             public void onSuccess(LogonInfo logonInfo) {
    59                 passwordWrapper.setError(logonInfo.getMsg());
    60                 if (logonInfo.getCode() == ConstantDef.ReturnCode.ReturnCode_1000) {
    61                     mSharePreUser.actionLoginUser(logonInfo);
    62                     startActivity(new Intent(LoginActivity.this, MainActivity.class));
    63                     finish();
    64                 }
    65             }
    66         });
    67 
    68     }
    69 
    70     private void initData() {
    71     }
    72 
    73     private void initView() {
    74         usernameWrapper = (TextInputLayout) findViewById(R.id.usernameWrapper);
    75         passwordWrapper = (TextInputLayout) findViewById(R.id.passwordWrapper);
    76         usernameWrapper.setHint(getString(R.string.hint_username));
    77         passwordWrapper.setHint(getString(R.string.hint_password));
    78         mButton = (Button) findViewById(R.id.btn);
    79     }
    80 
    81 }

     

    

 

登录界面、AutoUtils 屏幕适配、自定义Edittext(显示密码可见和一键清空)和 TextInputLayout的使用。

标签:single   layout   sig   group   else   ssi   viewgroup   etl   简单   

原文地址:http://www.cnblogs.com/caoy/p/6896496.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!