Android开发简易登录界面

news2024/9/23 22:44:04

title: Android开发第四天
search: 2024-03-22
tags:

  • Android开发

Android开发简易登录界面

文章目录

  • Android开发简易登录界面
    • 一、定义`style`样式
    • 二、完成 `activity_main.xml` 界面具体设计
      • 三、代码简述

背景 ：在初学 android 开发的时候，为了尽量熟悉学会基础的 android 开发控件和一些基本语言，写的一个简易登录界面，锻炼代码手感

一、定义style样式

为了简化代码，我们先在 styles.xml 中定义样式，后面遇到相同的代码就能够省下不少代码，类似于前端的组件，写好了组件，可以进行复用

    <style name="tvOne">
        <item name ="android:layout_width">0dp</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:layout_weight">1</item>
        <item name="android:gravity">center_horizontal</item>
        <item name="android:textColor">@android:color/white</item>
        <item name="android:textSize">15dp</item>
    </style>

    <style name="tvTwo">
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:layout_marginLeft">20dp</item>
        <item name="android:textSize">30dp</item>
        <item name="android:textColor">@android:color/white</item>
    </style>

    <style name="vLine" >
        <item name="android:layout_width">1dp</item>
        <item name="android:layout_height">match_parent</item>
        <item name="background">@android:color/white</item>
    </style>

    <style name="hLine" >
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">1dp</item>
        <item name="background">@android:color/holo_red_dark</item>
    </style>

    <style name="etOne">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:layout_marginLeft"> 30dp</item>
        <item name="background">@null</item>
        <item name="android:textColor">@android:color/white</item>
    </style>

自定义了几个样式，后序我打算用来放在 文本框（TextView）和 分割线 （View）中，以及一个输入框（EditText）

打算做成的登录界面框架如下：

在这里插入图片描述

二、完成 activity_main.xml 界面具体设计

代码具体的实现没有什么好说的，就是使用基础的样式设计，完成这个代码的目的也仅仅是为了锻炼一下快捷键，让自己熟悉一下 android 开发的基础语法

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/gg"
        tools:context=".MainActivity">

    <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

        <TextView
                android:id="@+id/tv_title"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:background="@color/black"
                android:gravity="center"
                android:text="注册"
                android:textColor="@color/white"
                android:textSize="20sp"
        />

        <LinearLayout android:layout_width="match_parent" android:layout_height="130dp"
                      android:orientation="horizontal">

            <TextView
                    style="@style/tvOne"
                    android:drawableTop="@drawable/ic_launcher_foreground"
                    android:text="用QQ注册"/>

            <View style="@style/vLine"/>

            <TextView style="@style/tvOne"
                      android:drawableTop="@drawable/ic_launcher_foreground"
                      android:text="用微信注册"/>

        </LinearLayout>

        <View style="@style/hLine"/>

        <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:orientation="horizontal"
                android:padding="15dp">

            <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:src="@mipmap/background"/>

            <TextView android:layout_width="wrap_content" android:layout_height="30dp"
                      android:layout_marginLeft="15dp"
                      android:text="请使用电子邮箱注册"
                      android:textColor="@color/white"
                      android:textSize="20dp"/>
        </LinearLayout>

        <View style="@style/hLine"/>

        <LinearLayout android:gravity="center"
                      android:layout_width="match_parent"
                      android:layout_height="wrap_content"
                      android:orientation="horizontal"
                      android:padding="15dp">
            <TextView style="@style/tvTwo"
                      android:text="名字"/>

            <EditText
                    android:id="@+id/et_name"
                    android:minHeight="48dp"
                    style="@style/etOne" android:hint="YourName"/>
        </LinearLayout>

        <View style="@style/hLine"/>

        <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
                      android:gravity="center"
                      android:orientation="horizontal"
                      android:padding="15dp">

            <TextView style="@style/tvTwo"
                      android:text="邮箱"/>

            <EditText android:id="@+id/et_email"
                      android:hint="YourEmail"
                      style="@style/etOne" android:minHeight="48dp"/>

        </LinearLayout>

        <View style="@style/hLine"/>

        <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
                      android:orientation="horizontal"
                      android:padding="15dp">
            <TextView style="@style/tvTwo"
                      android:text="密码"/>

            <EditText android:id="@+id/et_password"
                      style="@style/etOne"
                      android:minHeight="48dp"
                      android:hint="YourPassword"
                      android:inputType="textPassword"/>
        </LinearLayout>

        <View style="@style/hLine"/>

        <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
                      android:orientation="horizontal"
                      android:padding="15dp">

            <TextView style="@style/tvTwo"
                      android:layout_gravity="center"
                      android:text="性别"/>

            <RadioGroup android:layout_width="match_parent" android:layout_height="wrap_content"
                        android:id="@+id/rg_sex"
                        android:layout_marginLeft="50dp"
                        android:orientation="horizontal">
                <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content"
                             android:id="@+id/rb_boy"
                             android:text="男"
                             android:textColor="@color/material_on_primary_emphasis_high_type"
                             android:textSize="30sp"/>
                <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content"
                             android:id="@+id/rb_girl"
                             android:text="女"
                             android:layout_marginLeft="30dp"
                             android:textColor="@color/material_on_primary_emphasis_high_type"
                             android:textSize="30dp"/>
            </RadioGroup>

        </LinearLayout>

        <View style="@style/hLine"/>

        <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
                      android:orientation="vertical"
                      android:padding="15dp">

            <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                      android:text="请选择你的兴趣和爱好"
                      android:textColor="@color/white"
                      android:textSize="20dp"
                      android:layout_marginLeft="20dp"
                      android:textStyle="bold"/>

            <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
                          android:orientation="horizontal">

                <CheckBox android:layout_width="wrap_content" android:layout_height="wrap_content"
                          android:id="@+id/cb_sing"
                          android:text="唱歌"
                          android:layout_marginLeft="10dp"
                          android:textColor="@color/white"
                          android:textSize="20dp"/>

                <CheckBox android:layout_width="wrap_content" android:layout_height="wrap_content"
                          android:id="@+id/cb_dance"
                          android:text="跳舞"
                          android:layout_marginLeft="10dp"
                          android:textColor="@color/white"
                          android:textSize="20dp"/>

                <CheckBox android:layout_width="wrap_content" android:layout_height="wrap_content"
                          android:id="@+id/cb_read"
                          android:text="阅读"
                          android:layout_marginLeft="10dp"
                          android:textColor="@color/white"
                          android:textSize="20dp"/>

                <CheckBox android:layout_width="wrap_content" android:layout_height="wrap_content"
                          android:id="@+id/cb_chess"
                          android:text="下棋"
                          android:layout_marginLeft="10dp"
                          android:textColor="@color/white"
                          android:textSize="20dp"/>
                
            </LinearLayout>
            
        </LinearLayout>
        
        <View style="@style/hLine"/>
        
    </LinearLayout>
    
    <View android:layout_width="match_parent" android:layout_height="1dp"
          android:id="@+id/v_line"
          android:layout_above="@+id/btn_submit"
          android:background="@android:color/darker_gray"/>
    
    <Button android:layout_width="match_parent" android:layout_height="50dp"
            android:id="@+id/btn_submit"
            android:layout_alignParentBottom="true"
            android:gravity="center"
            android:text="提交"
            android:textSize="20dp"
            android:textStyle="bold"/>

</RelativeLayout>

三、代码简述

avtivity_main.xml代码片段是一个用于Android应用的XML布局文件，它定义了MainActivity的用户界面结构。整个布局采用RelativeLayout作为根布局，并且设置了背景为@drawable/gg。以下是代码中各组件的框架解释：

  1. 根布局 RelativeLayout：

    • 包含整个屏幕的布局，并设置了宽度和高度为父容器（match_parent），即全屏显示。
    • 背景引用了资源@drawable/gg。

  2. 内部第一个LinearLayout：

    • 垂直方向排列子视图。
    • 含有以下组件：
      • TextView：标题栏，居中显示文字“注册”。
      • 一个水平排列的LinearLayout，包含两个TextView和一个分割线View（vLine样式），分别代表两种社交账号登录方式（QQ和微信）。
      • 分割线View（hLine样式）。
      • 一个包含ImageView和TextView的LinearLayout，提示用户使用电子邮件注册。
      • 更多的分割线和垂直排列的LinearLayouts，分别对应姓名、邮箱、密码的输入框，每个输入框都包括一个标签（TextView）和一个实际输入控件（EditText）。
      • 性别选择部分：一个RadioGroup内含两个RadioButton，分别代表男女选项。
      • 兴趣爱好选择部分：一个TextView提示选择兴趣爱好，紧接着是一个包含四个CheckBox的LinearLayout，用于勾选用户的兴趣（唱歌、跳舞、阅读、下棋）。
      • 最后一个分割线View。

  3. 底部元素：

    • 一个细线View (v_line)，位于提交按钮上方，作为视觉分隔。
    • 一个Button元件，id为btn_submit，位于屏幕底部，带有文字“提交”，用于用户完成表单并发送数据至服务器或执行相应的提交操作。

整体上，这段代码构建了一个注册界面，允许用户通过多种方式进行注册，并提供了填写个人信息如姓名、邮箱、密码、性别以及选择兴趣爱好的功能。最后，用户可以通过点击提交按钮来完成注册流程。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1545151.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

看漫画学Python：有趣好玩

看漫画学Python：有趣好玩

书籍介绍 Python是一门既简单又强大的编程语言&#xff0c;被广泛应用于数据分析、大数据、网络爬虫、自动化运维、科学计算和人工智能等领域。Python也越来越重要&#xff0c;成为国家计算机等级考试科目&#xff0c;某些中小学也开设了Python编程课程。本书秉承有趣、有料、…
阅读更多...
js实现操作浏览器返回时，页面有弹窗则关闭弹窗而不实际返回

js实现操作浏览器返回时，页面有弹窗则关闭弹窗而不实际返回

关于popstate、pushState参考：HTML5的popstate、pushState、replaceState如何玩转浏览器历史记录-CSDN博客文章浏览阅读1.3w次，点赞8次，收藏30次。一、popstate用来做什么的？简而言之就是HTML5新增的用来控制浏览器历史记录的api。二、过去如何操纵浏览器历史记录？window.…
阅读更多...
自定义组件学习

自定义组件学习

效果 自定义组件模块 <template> <div class"flex-1"><div :style"{width: wrapWidth}" class"flex-margin mb8"><OprateSteps :operateHtml"operateHtml" /></div><ul class"datacollect-…
阅读更多...
Ftrans安全数据摆渡系统 构建便捷的内外网数据交换通道

Ftrans安全数据摆渡系统 构建便捷的内外网数据交换通道

安全数据摆渡系统是一种设计用于解决内外网环境下&#xff0c;数据传输、管理、共享问题的安全系统&#xff0c;通过加密、访问控制等策略&#xff0c;提供安全可靠的数据传输和共享服务&#xff0c;尤其适用于对网络安全建设要求高的行业&#xff0c;比如研发型企业、党政机构…
阅读更多...
异步引入组件

异步引入组件

defineAsyncComponent 函数&#xff1a;用于异步引入组件。 Suspense 标签&#xff1a;异步组件加载时&#xff0c;显示的默认内容。 应用场景&#xff1a;当子组件的数据量较大&#xff0c;导致父组件延迟显示时使用。 语法格式 异步引入组件&#xff1a; import { define…
阅读更多...
Java：ArrayList与顺序表

Java：ArrayList与顺序表

一、线性表 线性表是n个具有相同特征的数据元素的有限序列&#xff0c;它是一种在实际中广泛使用的数据结构&#xff0c;常见的线性表有&#xff1a;顺序表、链表、栈、队列...... 如图&#xff1a;顺序表与链表的区别看了标题的伙伴就应该知道&#xff0c;我们这次要讲解的主…
阅读更多...
Java多线程实战-从零手搓一个简易线程池(一)定义任务等待队列

Java多线程实战-从零手搓一个简易线程池(一)定义任务等待队列

&#x1f3f7;️个人主页&#xff1a;牵着猫散步的鼠鼠 &#x1f3f7;️系列专栏&#xff1a;Java全栈-专栏 &#x1f3f7;️本系列源码仓库&#xff1a;多线程并发编程学习的多个代码片段(github) &#x1f3f7;️个人学习笔记&#xff0c;若有缺误&#xff0c;欢迎评论区指正…
阅读更多...
router.push是同步还是异步？push.then和子组件onMounted谁先触发？

router.push是同步还是异步？push.then和子组件onMounted谁先触发？

直接做实验&#xff1a; <el-button type"danger" click"test">toAbout</el-button>// -----const test () >{router.push(about).then((e)>{console.log(then里面, e);}).finally((e)>{console.log(finally里面, e);})console.log…
阅读更多...
【Unity3D小功能】Unity3D中实现点击‘文字’出现‘UI面板’

【Unity3D小功能】Unity3D中实现点击‘文字’出现‘UI面板’

推荐阅读 CSDN主页GitHub开源地址Unity3D插件分享简书地址QQ群&#xff1a;398291828 大家好&#xff0c;我是佛系工程师☆恬静的小魔龙☆&#xff0c;不定时更新Unity开发技巧&#xff0c;觉得有用记得一键三连哦。 一、前言 宠粉博主又来了&#xff0c;今天有粉丝问我如何实…
阅读更多...
机器学习 - 神经网络分类

机器学习 - 神经网络分类

什么叫做分类问题&#xff1f; A classification problem involves predicting whether something is one thing or another. Problem typeWhat is it?ExampleBinary classificationTarget can be one of two options, e.g. yes or noPredict whether or not someone has hea…
阅读更多...
AXI_Lite协议详解

AXI_Lite协议详解

文章目录 摘要一、AXI_Lite接口全局信号&#xff1a;1、写地址通道&#xff1a;2、写数据通道&#xff1a;3、写响应通道&#xff1a;4、读地址通道&#xff1a;5、读数据通道&#xff1a; 二、仿真波形 摘要 AXI4-lite是AXI4-full的简化版。用于简单、低吞吐量的内存映射通信…
阅读更多...
基于CNN-RNN的动态手势识别系统构建与应用

基于CNN-RNN的动态手势识别系统构建与应用

一、引言 随着人机交互技术的不断发展&#xff0c;动态手势识别成为了近年来的研究热点。动态手势识别技术能够识别和理解人类的手势动作&#xff0c;从而实现更自然、更直观的人机交互。本文旨在构建一种基于CNN-RNN的动态手势识别系统&#xff0c;以提高手势识别的准确性和实…
阅读更多...
36.基于SpringBoot + Vue实现的前后端分离-高校汉服租赁网站系统（项目 + 论文）

36.基于SpringBoot + Vue实现的前后端分离-高校汉服租赁网站系统（项目 + 论文）

项目介绍 本站是一个B/S模式系统&#xff0c;采用SpringBoot Vue框架&#xff0c;MYSQL数据库设计开发&#xff0c;充分保证系统的稳定性。系统具有界面清晰、操作简单&#xff0c;功能齐全的特点&#xff0c;使得基于SpringBoot Vue技术的高校汉服租赁网站系统设计与实现管理…
阅读更多...
Go第三方框架--gin框架（二）

Go第三方框架--gin框架（二）

4. gin框架源码–Engine引擎和压缩前缀树的建立 讲了这么多 到标题4才开始介绍源码&#xff0c;主要原因还是想先在头脑中构建起 一个大体的框架 然后再填肉 这样不容易得脑血栓。标题四主要涉及标题2.3的步骤一 也就是 标题2.3中的 粗线框中的内容 4.1 Engine 引擎的建立 见…
阅读更多...
Filter、Listener、AJAX

Filter、Listener、AJAX

Filter 概念&#xff1a;Filter 表示过滤器&#xff0c;是JavaWeb三大组件(Servlet、Filter、 Listener)之一。 过滤器可以把对资源的请求拦截下来&#xff0c;从而实现一些特殊的功能。 过滤器一般完成一些通用的操作&#xff0c;比如&#xff1a;权限控制、统一编码处理、敏感…
阅读更多...
Mac 装 虚拟机 vmware、centos7等

Mac 装 虚拟机 vmware、centos7等

vmware&#xff1a; https://www.vmware.com/products/fusion.html centos7 清华镜像&#xff1a; 暂时没有官方的 m1 arm架构镜像 centos7 链接: https://pan.baidu.com/s/1oZw1cLyl6Uo3lAD2_FqfEw?pwdzjt4 提取码: zjt4 复制这段内容后打开百度网盘手机App&#xff0c;操…
阅读更多...
【Python】Scrapy整合FastAPI实现爬虫API 附大量示例

【Python】Scrapy整合FastAPI实现爬虫API 附大量示例

文章目录 前言1. 网页分析入门1.1 基本原理1.2 Scrapy 原理 2. 创建项目2.1 创建Scrapy项目2.2.1 创建Scrapy项目2.2.2 创建Spider2.2.3 执行Demo 2.2 引入FastAPI 2. 获取Cookie3. 数据建模3.1 Scrapy 数据建模3.2 SQLAlchemy 创建实体类 3. 分析网页3.1 xpath 分析3.2 css 分…
阅读更多...
计算机进制转换：二进制、八进制、十进制、十六进制。原码、补码、反码。

计算机进制转换：二进制、八进制、十进制、十六进制。原码、补码、反码。

一、什么是进制 在生活中&#xff0c;我们通常都是使用阿拉伯数字计数的&#xff0c;也就是10进制&#xff0c;以10为单位&#xff0c;遇10进一&#xff0c;所以是由0&#xff0c;1&#xff0c;2、3、4、5、6、7、8、9组成的&#xff1b;而在计算机中&#xff0c;计算机是无法…
阅读更多...
AI工具排行榜：最全工具汇总

AI工具排行榜：最全工具汇总

如今,人工智能技术正在快速崛起,AI助手、语音识别、机器翻译等工具深深渗透到我们的工作和生活中。这些智能工具极大地提高了我们的工作效率,使我们能更加专注于创造性的任务。 本文将为读者推荐一些实用的AI神器,只要掌握其中一个,就能极大地提升你的工作能力,事半功倍。这些…
阅读更多...
YOLOv9代码解读[01] readme解读

YOLOv9代码解读[01] readme解读

文章目录 YOLOv9COCO数据集上指标&#xff1a;环境安装训练验证重参数化 Re-parameterization推断相关链接 YOLOv9 paper: YOLOv9: Learning What You Want to Learn Using Programmable Gradient Information github: https://github.com/WongKinYiu/yolov9 COCO数据集上指…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023