简单安卓小程序:登录界面 图片切换&移动终端软件开发课程

补充说明一下,经常出现UI不显示自己的设计结果的情况。通过查阅文档,发现在style.xml中的parent中添加Base.即可很好的解决问题。
1
###1.图片切换
图片切换
####应用的控件:

  1. EditView
  2. TextView
  3. ImageView
  4. Button
    ####将图片引入
    这个步骤非常简单,只需要把所需图片复制到drawable文件夹中,如图
    111
    ####设计布局:
    很简单我们只需要它顺次排列,因此只需要用最简单的线性布局,因此在.xml文件中改写:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"//垂直线性排列
    tools:context=".MainActivity">

EditView部分

    <EditText
    android:id="@+id/editText1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

####TextView部分

    <TextView
        android:id="@+id/textView2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/easy_text"
        android:textColor="@color/colorPrimaryDark"/>

####ImageView部分
可能是图片过大的原因,直接防止图片后会导致图片占据整个剩余空间,因此利用android:layout_weight当前剩余空间按权重平分。(具体值当然是我瞎写的啦)

       android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="5"
        android:src="@drawable/cat" />

####Button部分

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Cat->Dog" />

####主函数部分

  • 首先定义一些变量
    private Button button1;
    private EditText editText1;
    private TextView textView1;
    private ImageView imageView1;
    private boolean flag=false;//判断button

在函数protected void onCreate中初始化这些变量(必须在方法onCreate中存在一条这样的语句:super.onCreate(也就是调用Activity的onCreate方法),对于super.onCreate方法放的位置要求不是很高,只要被调用了就可以了,super.onCreate主要是加载一些组件。)

实现监听调用findViewById(int id)找到该组件:

   textView1=(TextView)findViewById(R.id.textView2);//让组件和对应的ID对应起来
   imageView1=(ImageView)findViewById(R.id.imageView1);
   button1=(Button)findViewById(R.id.button2);
   editText1 = (EditText) findViewById(R.id.editText1);

Button的点击事件监听

button1.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
             if(flag){
                 imageView1.setImageResource(R.drawable.dog);
                 button1.setText("Dog->Cat");
             }
             else{
                 imageView1.setImageResource(R.drawable.cat);
                 button1.setText("Cat->Dog");
             }
             flag=!flag;

         }
     });

EditText的改变事件监听

        editText1.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {

            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {

            }

            @Override
            public void afterTextChanged(Editable s) {
                textView1.setText(s.toString());//使文本框和对应的输入一致
                Toast.makeText(MainActivity.this, s.toString(), LENGTH_SHORT).show();//使消息提示框中内容和输入文本中的一致

            }
        });

###2.简单登录
1
####应用的控件:

  1. EditView
  2. TextView
  3. CheckBox
  4. Button
    ####设计布局:
    依然用最简单的线性布局!
    ####XML部分
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:text="网络空间安全与计算机学院"
        android:textColor="@color/colorPrimary"/>
    <EditText
        android:id="@+id/edittext1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="账号"
        android:singleLine="true"        />
    <EditText
        android:id="@+id/editText2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="密码"
        android:inputType="textPassword"
        />

    <CheckBox
        android:id="@+id/checkBox"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="显示密码"

        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:text="注册"
        android:textColor="@color/colorAccent"
        android:onClick="TextClick"/>

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="ButtonClick"
        android:text="登录" />

</LinearLayout>

####主函数部分

  • 变量声明
	private EditText editText2;
    private CheckBox isCheck;
  • 初始化
    editText2 = (EditText) findViewById(R.id.editText2);
    isCheck = (CheckBox) findViewById(R.id.checkBox);
    isCheck.setOnClickListener(new OnClickListenerImpl());//设置监听器
  • 消息框
    public void TextClick(View view) {
        Toast.makeText(this, "注册功能未实现!", Toast.LENGTH_SHORT).show();
    }

    public void ButtonClick(View view) {//在源代码中设置一个ButtonClick方法,作为该Button的点击监听方法
        Toast.makeText(this, "登陆功能未实现!", Toast.LENGTH_SHORT).show();
    }
  • 设置密码的显示与隐藏
    这部分真是比较的重头戏了,搞了半天,气死了,我利用的是复选框实现的,打勾实现显示,未打勾实现隐藏。
 private class OnClickListenerImpl implements OnClickListener{//监听类
        @Override
        public void onClick(View v) {
            if (isCheck.isChecked()) {
                editText2.setTransformationMethod(HideReturnsTransformationMethod.getInstance());//百度查的啦啦啦
            }
            else {
                editText2.setTransformationMethod(PasswordTransformationMethod.getInstance());
            }
        }
    }

没有更多推荐了,返回首页