• Android笔记-4-实现登陆页面并跳转和简单的注册页面


    实现登陆页面并跳转和简单的注册页面
     
    首先我们来看看布局的xml代码
    login.xml
    <span style="font-family:Arial;font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@drawable/bkcolor"
        android:orientation="vertical" >
    
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:background="@drawable/topbg2"
            android:gravity="center_vertical"
            android:orientation="horizontal" >
    
            <Button
                android:id="@+id/cancel"
                android:layout_width="65.83dp"
                android:layout_height="30.5dp"
                android:layout_marginLeft="10dp"
                android:background="@drawable/normal_btn"
                android:text="@string/cancel"
                android:textColor="#ffffff" />
    
            <TextView
                android:id="@+id/tv_friend_title"
                android:layout_width="wrap_content"
                android:layout_height="50dip"
                android:layout_weight="1"
                android:gravity="center"
                android:text="AppName"
                android:textColor="#ffffff"
                android:textSize="20dip" />
    
            <Button
                android:id="@+id/login_in"
                android:layout_width="65.83dp"
                android:layout_height="30.5dp"
                android:layout_marginRight="10dp"
                android:background="@drawable/normal_btn"
                android:text="@string/login_in"
                android:textColor="#ffffff" />
        </LinearLayout>
    
        <RelativeLayout
            android:id="@+id/editRel"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >
    
            <RelativeLayout
                android:id="@+id/accountRel"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="14dp"
                android:background="@drawable/preference_first_item"
                android:clickable="true"
                android:gravity="center_vertical" >
    
                <TextView
                    android:id="@+id/account"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="@string/account"
                    android:textColor="#000"
                    android:textSize="17sp" />
    
                <EditText
                    android:id="@+id/accountEdittext"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="20dip"
                    android:layout_toRightOf="@id/account"
                    android:background="@null"
                    android:hint="@string/account"
                    android:textSize="15sp" />
            </RelativeLayout>
    
            <RelativeLayout
                android:id="@+id/pwdRel"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_below="@id/accountRel"
                android:background="@drawable/preference_last_item"
                android:clickable="true"
                android:gravity="center_vertical" >
    
                <TextView
                    android:id="@+id/pwd"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="@string/pwd"
                    android:textColor="#000"
                    android:textSize="17sp" />
    
                <EditText
                    android:id="@+id/pwdEdittext"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="20dip"
                    android:layout_toRightOf="@id/pwd"
                    android:background="@null"
                    android:hint="@string/pwd"
                    android:textSize="15sp" />
            </RelativeLayout>
        </RelativeLayout>
    
        <TextView
            android:id="@+id/sound_help"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="15dip"
            android:layout_marginLeft="15dip"
            android:text="@string/forget_pwd"
            android:textColor="#29981A" />
    
    </LinearLayout></span>
    

      

    我们来看第一行,这里主要就是介绍xml的版本信息和编码格式。
     
    接下来就是重点了,代码写好了,我们可以看看写好代码这个布局究竟是什么样子的也便于调试,那么这个时候需要点击一下下方的Graphical Layout,这个是一个可视化的编辑窗口,我们写的xml代码是什么样子的,这里都可以见到,所以这个非常的方便。基本上这里显示是什么样,到了手机实际运行就是什么样子的,所以大家写好一个布局样式的时候都要来回的切换一下,调整细节布局都靠这个了。
     
    首先说明一下常用的5种布局:
    1.LinearLayout(线性布局)
    2.RelativeLayout(相对布局)
    3.AbsoluteLayout(绝对布局)
    4.TableLayout(表格布局)
    5.FrameLayout(单帧布局)
     
    今天我只会用到其中两种,那么我就只会讲其中两种啦,至少我现在做的那么多项目的话,用的最最多的其实就是前两种,基本上可以完成大多数的布局了。
    讲到这里
    我的弟弟又问:那么多布局,布局里面貌似还有啥子长宽高,还有好多属性哦,怎么记得完记得住啊?这个布局不好搞啊,页面图不好画呀。
    我说:确实啊,但是谁要求你记那么多啊?现在开始,用到什么再去查什么,记住基础的属性就可以了,其他的还是需要用的时候再去查,这样才能快速从零开始,每一个你都问为什么去深入,那可不行。很多东西现在讲了也不明白,等时间到了,不讲你也自己都明白了。不过弄完过后,下来的查资料和思考是必不可少的。并且最最重要的就是动手实验,自己去敲代码,才是王道。
     
    好了散打回到我们的布局代码上来,首先我们就来了一个LinearLayout作为整体的一个布局基调,接下来的东西都写到这个大的LinearLayout上面。然后这里说明一下,布局是可以嵌套的,意思就是LinearLayout下面还可以嵌套其他的布局或者还是LinearLayout。具体怎么的呢,不急,我们慢慢一步一步的来。
    弟弟立刻就问了:xmlns:android=http://schemas.android.com/apk/res/android这句是什么意思呢?
    我说:我都还不知道呢,于是乎,去查,哦原来这个是xml的命名空间,有了他,你就可以alt+/作为提示,提示你输入什么,不该输入什么,什么是对的,什么是错的,也可以理解为语法文件。或者语法判断器什么的。
     
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:background="@drawable/bkcolor"
      android:orientation="vertical"
     
    第一句其实就是设置这个宽度,那么值我们填的是填充这个宽度,大家还可以alt+/查看还有什么属性,到时候会用到其他的
    第二句其实也是同样的是设置高度。
    第三句就是整个的背景我们直接引用了一个颜色,同样的你可以引用你放到drawable-hdpi下面的图片,其实就相当于我们微信或者有些app启动的时候的背景图片。
    第四句是设置在这个布局下面的空间采用什么排列方式,我们这里是采用垂直排序的方式,意思就是后面的组件都是从上到下排列,当然如果你选择horizontal则是从左到右的方式排列。
     
    好了大的背景我们就搭建好了,其实这个时候什么都木有,只是你会看到背景颜色变了。
     
    接下来我们就要添加按钮,输入框,文字等内容了。
     
    首先这个时候我们要有一个思维就是,布局都是分块的,而不是所有的东西都是一个字一个字,一个按钮一个按钮来写的。
     
    这里我们来看看 我们把最上面的titile栏作为一块,中间的账号密码输入框作为一块,最下面的忘记密码为一块。那么我们就可以知道接下来应该有三块了,然后首先完成第一块,根据第一块,对了这里说明一般的开发流程是,首先是美工会设计整个页面的样式,然后切图,我们才会根据那个来作为参考来布局我们的内容。
     
    最上面的一块根据他的设计我们看到是三个内容,2个BUTTON,1个TextView。而且是水平排列的,那么就可以利用我们的只是嵌套一个LinearLayout 并且排列方式应该用什么呢?前面说了,当然就用horizontal啦,它就会自动从左到右的排列了
     
    同样的就不介绍了,不过也是设置按钮的大小,这里的大小是根据美工切的图片来计算的,有一个转换工具就是像素转换成dip的
    下载地址 dip转换工具
     
     
    android:id="@+id/cancel"
    这是为这个按钮添加一个id号,便于在代码中找到这个按钮,为这个按钮写对应的功能,这里也就贴出在loginActivity中找到这个按钮的代码吧.
           
     Button cancel;
            cancel=(Button)findViewById(R.id.cancel);
            cancel.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View v) {
                    //这里做你想你的这个按钮想做的事情吧。
                }
            });
     
     
    android:layout_marginLeft="10dp"
    这句话的意思就是距离左边距多远,一般10-15dp是最好看的距离,反正所有统一就好了。
     
    同样还有就是按钮的文字内容我们都写到strings.xml里面,通过android:text="@string/cancel"
    这种方式来调用,这样做的好处是以后万一有修改就不用一一的去改了。上一篇文章页介绍了,这里就是实际使用了。大家照着写吧。
     
     
    android:textColor="#ffffff"
    这句话就是文字颜色,这里是黑色,至于其他颜色大家可以去查。
     
    好了其他的都大同小异,相信各位智商一定比我弟弟高,他都能做出来,各位小天才们一定是可以举一反三的,不然我不是在侮辱各位么不是么。说太多会挨打的。
     
     android:layout_weight="1"当然这个还是要讲一下,这个是在这个LinearLayout中的一个权重,相当于把整个分成几份,我这里设置1的目的其实就是居中显示这个TextView,同时剩下的两个按钮分剩下的空间,类似于TextView占了两份,其他的按钮各自占一份。或者大家可以试一试其他的方式来达到这个效果,也许我也做错了。
     
    弟弟:你为什么这样做呢?可以用其他的方式么?
    我:我也不晓得,你记着我给你讲的很有可能是错的,所以你要有怀疑的精神,同时可以试验其他方法。
     
    预告:后面发生了一件事情证明了这个,所以我还是错的凶。大家如果我有错,请指正,我改,我是好孩子,不是那种你给我指出来了,我反正不改,你来打我呀那种人!
     
    预告:后面发生了一件事情证明了这个,所以我还是错的凶。大家如果我有错,请指正,我改,我是好孩子,不是那种你给我指出来了,我反正不改,你来打我呀那种人!
     
    接下来讲一下RelativeLayout,也就是下面账号密码的实现中的关键点了
    这种布局叫相对布局,那么必然有一个相对的对象
    这时我的弟弟问:到底@+id/name和@id/name有什么区别呢?怎么使用呢?
    我回答:其实有加号的那个是添加一个id,另外一个是引用那个id。
     
    好了再相对布局中会类似这样的代码
     android:layout_toRightOf="@id/account"
    它的意思就是把该空间放到id为account的空间的右边,当然还有很多参数,还可以放到左边,放到下面,放到上面等等,大家可以在输入完android:后按ctrl+/来查看。后面的文章我会做一个详细的具体的有哪些参数的说明。等用到的时候继续讲解。基本的布局就差不多这样完成了。再讲解跳转方法之前说一下引用的图片,大家可能看到了drawable-hdpi中有的图片的结尾格式是.9.png说明一下个图片是利用android自带的工具制作而成的,目的是让图片具有较小的体积同时拉伸的时候图片不会变型,大家先了解有这么一回事吧。
     
    接下来是跳转相关的代码了主要就是利用intent,什么时候跳转呢?我们在点击了登陆的时候跳转,我的代码如下:
    Button loginBtn = (Button)findViewById(R.id.login_in);
            loginBtn.setOnClickListener(new OnClickListener() {
                
                @Override
                public void onClick(View v) {
                    // TODO Auto-generated method stub
                    //这里就可以判断账号密码是否正确了,这里让大家自己试验动手一下谢谢如果账号密码是admin 123456就成功
                    //否则就提示登陆失败,大家试一试吧,我这里直接跳转了,没做验证
                    
                    //这个是直接跳转到MainActivity
                    Intent intent = new Intent();
                    intent.setClass(LoginActivity.this, MainActivity.class);
                    startActivity(intent);
                }
            });
    同时留一个作业就是,大家去获取编辑框的内容,然后以账号为admin,密码为123456作为正确账号,来判断输入是否正确,成功了就跳转,失败了就弹出提示。
     
    Intent负责对应用中一次操作的动作、动作涉及数据、附加数据进行描述,Android则根据此Intent的描述,负责找到对应的组件,将 Intent传递给调用的组件,并完成组件的调用。intent可以带参数传递,还可以绑定bundle。这些后期会用到我们继续讲 ,这里我们就是单纯的实现了跳转,setClass就是告诉计算机从哪个类到哪个类去,然后调用startActiviy()方法就可以成功的跳转了。
     
  • 相关阅读:
    (转)编写高质量高效率的SharePoint应用程序
    转:我眼中的Visual Studio 2010架构工具
    Windows 7 x64/Windows 2008 : The ‘Microsoft.Jet.OLEDB.4.0′ provider is not registered on the local machine.
    转:构建高性能ASP.NET站点之一 剖析页面的处理过程(前端)
    HTML5 到底是什么?
    使用eval()解析JSON格式字符串应注意的问题
    使用HTML5进行地理位置定位。误差在+500m
    LAST DAY
    javacript获取obj的长度
    通过 JSON 字符串来创建对象
  • 原文地址:https://www.cnblogs.com/OuZeBo/p/4728796.html
Copyright © 2020-2023  润新知