简介这是一份面向Android初学者的登录注册界面示例工程聚焦应用首次触达用户时的视觉与交互体验。工程基于Material Design规范展示了输入框浮动标签、密码明文切换、按钮样式定制以及页面切换动画等实现细节同时涵盖Intent跳转、SharedPreferences本地存储和网络请求的基础写法适合希望快速搭建美观登录模块的开发者参考。压缩包共52个文件以XML布局资源、PNG切图、Java源码和class编译文件为主另含可直接安装的APK与调试用dex、jar库整体体积仅1.27MB结构精简便于逐项拆解。已有6483人学习下载可作为UI布局、事件处理与数据交互综合练习的入门范例。1. 登录注册界面看着越简单越是 Android 工程里翻车率最高的页面登录注册界面大概是 Android 里视觉上最不起眼、实际最容易出问题的一类页面两个输入框、一个按钮背后却牵扯软键盘遮挡、焦点切换、表单校验、倒计时防重和页面转场。你从网上下载一份漂亮源码很容易但换个手机装上就会出现按钮被键盘顶飞、输入框聚焦后背景变灰、状态栏颜色和页面不融合之类的问题。这篇文章不打算把源码当黑匣子丢给你而是把一套可运行的漂亮登录注册界面拆开讲——布局怎么搭、交互状态怎么维护、哪些参数必须动、哪几个坑绕不开。照着写完这份登录注册界面源码就能落到你自己的工程里跑起来。2. 界面选型与源码组织XML 和 Compose 怎么选资源放哪一层2.1 XML 布局和 Compose 的差异先看工程再看喜好现在做登录注册界面第一道选择题是用传统 XML 布局还是 Jetpack Compose。很多人在这一步纠结很久但判断标准其实很粗暴你要是往一个已经跑了两三年的老工程里塞登录页主工程八成还是 View 体系贸然引 Compose 会带来编译器版本、依赖体积和团队学习成本一堆问题反过来新项目从零起团队愿意接受声明式 UICompose 写动画确实爽快。我的习惯是老工程跟主栈走新项目看团队。登录注册这种页面控件是固定的EditText、Button、倒计时 TextView 三件套XML 写起来一点不慢而且网上大量现成资源和老同事的经验都沉淀在 View 体系里。Compose 的优势在状态驱动和动画编排登录页用得到的只有边缘一点。另外要澄清一个常见误区所谓漂亮不是依赖某个炫酷框架而是颜色、圆角、间距和状态反馈的统一。这套东西在 XML 里用 shape、selector 就能做得很细不需要为了好看就上重框架。选型定了之后源码组织就顺理成章。2.2 模块结构页面、控件、资源按三层放拿到或写完一份登录注册界面源码第一步是看清楚文件结构。我见过不少新手把布局、背景、颜色全塞在 Activity 一个文件里改起来非常痛苦。常见做法是分成页面层、控件层、资源层三层页面层只管业务逻辑控件层管输入框按钮的视觉状态资源层放颜色、尺寸和动画定义。一份结构清晰的登录注册模块大概长这样app/src/main/ ├── java/com/example/app/ │ ├── login/LoginActivity.kt │ ├── login/RegisterActivity.kt │ └── login/RegisterFormValidator.kt └── res/ ├── layout/activity_login.xml ├── layout/activity_register.xml ├── drawable/bg_input.xml ├── drawable/bg_btn_login.xml ├── drawable/bg_code.xml ├── anim/slide_in_right.xml ├── anim/slide_out_left.xml ├── values/colors.xml └── values/dimens.xml包名按你自己的工程改这里只是示意。Layout 里只放结构和尺寸引用背景全部指向 drawable颜色统一在 colors.xml这样换主题色的时候只改一处不用在每个页面里翻找十六进制色值。登录和注册两个 Activity 各管各的页面共用的校验逻辑抽成 RegisterFormValidator输入框背景、按钮背景这些跨页面复用的资源放 drawable 公共目录。这套结构的好处很实际改按钮圆角不用动 Java/Kotlin 代码换主色调不用碰布局排查问题的时候一眼就知道该去哪个文件。2.3 设计参数先定死颜色、圆角、间距动手写代码之前先把设计参数固定下来。登录注册界面最容易做飘的地方就是参数不统一——左边输入框圆角 12dp右边按钮圆角 30dp看着就散。我一般先定一张参数表所有页面共用。参数取值说明主色#3D7EFF按钮、聚焦描边、链接文字渐变深色#2E68E6按钮渐变终点、按压态页面背景#F7F8FA灰白底和白色输入框拉开层次输入框背景#FFFFFF纯白配 1dp 浅灰描边输入框圆角14dp圆润但不显幼稚输入框高度52dp点击区域充足单手操作舒服按钮圆角26dp胶囊感和输入框区分内容左右边距24dp屏宽 360dp 时留白比例合适这几个值不是标准答案但它们是一套值。主色和渐变深色用于按钮输入框用白底加描边聚焦时描边换成主色。圆角分两档输入框 14dp按钮 26dp对比出层级。高度统一 52dp避免有的页面 48dp、有的 56dp 导致视觉高低不一。这些参数定完后进入实现阶段看到的代码就全是围绕着这张表在写。后面所有小节里的代码都基于这组值。3. 登录页实现从空工程到可运行的登录界面3.1 布局骨架ScrollView 包住表单是基本操作登录页布局看起来简单但有一个原则从一开始就要守住表单区域必须被 ScrollView 包住。原因很实际小屏手机或横屏状态下软键盘弹起来会压缩可视区域如果不让表单可滚动登录按钮就会被顶出屏幕用户得先把键盘缩回去才能点击。这不是玄学是每天都会遇到的场景。下面是登录页的布局骨架根布局用 ConstraintLayoutScrollView 占满全屏里面套一个 LinearLayout 垂直排列所有控件?xml version1.0 encodingutf-8? androidx.constraintlayout.widget.ConstraintLayout xmlns:androidhttp://schemas.android.com/apk/res/android xmlns:apphttp://schemas.android.com/apk/res-auto android:layout_widthmatch_parent android:layout_heightmatch_parent android:backgroundcolor/page_bg ScrollView android:idid/scroll_root android:layout_width0dp android:layout_height0dp android:fillViewporttrue android:scrollbarsnone app:layout_constraintTop_toTopOfparent app:layout_constraintBottom_toBottomOfparent LinearLayout android:layout_widthmatch_parent android:layout_heightwrap_content android:orientationvertical android:paddingLeft24dp android:paddingRight24dp android:paddingTop64dp android:paddingBottom24dp TextView android:idid/tv_logo android:layout_widthwrap_content android:layout_heightwrap_content android:text模拟项目X android:textSize28sp android:textStylebold android:textColorcolor/text_main / EditText android:idid/et_phone android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop48dp android:hint请输入手机号 android:inputTypephone android:maxLength11 android:backgrounddrawable/bg_input android:paddingLeft16dp android:paddingRight16dp android:textSize15sp / EditText android:idid/et_password android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop16dp android:hint请输入密码 android:inputTypetextPassword android:backgrounddrawable/bg_input android:paddingLeft16dp android:paddingRight16dp / Button android:idid/btn_login android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop32dp android:backgrounddrawable/bg_btn_login android:stateListAnimatornull android:text登录 android:textColorcolor/white android:enabledfalse / TextView android:idid/tv_go_register android:layout_widthwrap_content android:layout_heightwrap_content android:layout_gravitycenter_horizontal android:layout_marginTop16dp android:text没有账号去注册 android:textColorcolor/primary android:padding4dp / /LinearLayout /ScrollView /androidx.constraintlayout.widget.ConstraintLayout这里有几个参数需要特别说明。ScrollView 的fillViewporttrue很关键它让 ScrollView 在内容不足一屏时仍然撑满视口高度这样后续如果想让按钮固定在屏幕底部LinearLayout 才有条件使用layout_gravitybottom。scrollbarsnone是为了美观登录页内容量少不需要显示滚动条。EditText 的maxLength11是配合手机号输入的场景限制inputTypephone会弹出数字键盘。Button 上的stateListAnimatornull是去掉 Android 5.0 以后默认的阴影高度变化不然圆角背景在点击时会带一个突兀的投影很丑。初始状态把登录按钮enabledfalse配合下面的背景 selector按钮会呈现灰色等输入合法后再点亮。这里不要图省事让按钮一直可点交互上不可点就明确灰掉比点了报错体验好很多。3.2 输入框背景 selector 与焦点反馈输入框的美感很大程度来自聚焦反馈。默认 EditText 的底线式样式在白色背景上不显眼我一般用圆角白底加描边聚焦时描边变主色。这个效果不用写代码控制一个 selector 就能搞定?xml version1.0 encodingutf-8? selector xmlns:androidhttp://schemas.android.com/apk/res/android item android:state_focusedtrue shape android:shaperectangle solid android:color#FFFFFF / stroke android:width1.5dp android:colorcolor/primary / corners android:radius14dp / /shape /item item shape android:shaperectangle solid android:color#FFFFFF / stroke android:width1dp android:color#E6E8EB / corners android:radius14dp / /shape /item /selectorselector 的顺序有讲究state_focused的 item 必须放在最前面系统按从上到下的顺序匹配状态。如果放在最后聚焦时前面的默认 item 已经匹配上了聚焦效果就不会生效。stroke的宽度在聚焦时从 1dp 变成 1.5dp不要小看这 0.5dp视觉上描边会明显实起来和颜色变化叠加焦点一眼就能看出来。还有一点要注意不要在 EditText 上同时设置android:background和android:backgroundTint。backgroundTint 会给 drawable 叠加一层着色常常把 shape 里的颜色染成系统主题色导致聚焦后背景发灰。用了这个 selectorbackgroundTint 就不再需要了删干净。3.3 登录按钮状态流转与点击处理界面画好了接下来是交互逻辑。登录按钮的可用状态由两个输入框的内容驱动手机号符合正则、密码长度不小于 6 位按钮才点亮。这里用 TextWatcher 监听输入变化每次输入都重新计算按钮状态class LoginActivity : AppCompatActivity() { private lateinit var binding: ActivityLoginBinding private val phoneRegex Regex(^1[3-9]\\d{9}$) override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) binding ActivityLoginBinding.inflate(layoutInflater) setContentView(binding.root) binding.etPhone.addTextChangedListener(loginWatcher) binding.etPassword.addTextChangedListener(loginWatcher) binding.btnLogin.setOnClickListener { hideKeyboard() login() } binding.tvGoRegister.setOnClickListener { startActivity(Intent(this, RegisterActivity::class.java)) overridePendingTransition(R.anim.slide_in_right, R.anim.slide_out_left) } } private val loginWatcher object : TextWatcher { override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {} override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {} override fun afterTextChanged(s: Editable?) { val phone binding.etPhone.text.toString().trim() val pwd binding.etPassword.text.toString() binding.btnLogin.isEnabled phoneRegex.matches(phone) pwd.length 6 } } private fun login() { val phone binding.etPhone.text.toString().trim() val pwd binding.etPassword.text.toString() if (!phoneRegex.matches(phone)) { Toast.makeText(this, 手机号格式不对, Toast.LENGTH_SHORT).show() return } // 这里替换成你的真实登录接口 binding.btnLogin.isEnabled false } private fun hideKeyboard() { val imm getSystemService(INPUT_METHOD_SERVICE) as InputMethodManager imm.hideSoftInputFromWindow(currentFocus?.windowToken, 0) } }TextWatcher 要求实现三个回调beforeTextChanged和onTextChanged在这个场景下用不到但必须空实现。真正起作用的是afterTextChanged每次文本变化后统一刷新按钮状态比分别在两个输入框里写监听更省代码。currentFocus?.windowToken用了安全调用防止焦点为空时传 null 给系统方法导致异常。手机号正则^1[3-9]\d{9}$是最常见的校验方式但注意它只是客户端交互反馈拦截明显的手误真正严格的号段判断应该在后端做。按钮点击后先收起键盘再进入登录逻辑这是移动端的基本礼仪——不收起键盘请求成功跳转时键盘还挂在旧页面上视觉上很脏。btnLogin.isEnabled false是为了防止用户在请求期间再次点击等接口回调后再恢复或者直接跳转。4. 注册页与登录联动校验、倒计时、转场一次到位4.1 注册页布局比登录页多出的三个控件注册页和登录页的骨架完全一样还是 ScrollView 包表单但内容上多了三个部分验证码输入框、获取验证码按钮、确认密码输入框。验证码那行是一个横向布局左边输入框占剩余宽度右边一个固定宽度的获取验证码按钮这是注册页最典型的结构。LinearLayout android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop16dp android:orientationhorizontal EditText android:idid/et_code android:layout_width0dp android:layout_heightmatch_parent android:layout_weight1 android:backgrounddrawable/bg_input android:hint验证码 android:inputTypenumber android:maxLength6 android:paddingLeft16dp android:paddingRight16dp / TextView android:idid/btn_send_code android:layout_width110dp android:layout_heightmatch_parent android:layout_marginLeft12dp android:gravitycenter android:backgrounddrawable/bg_code android:text获取验证码 android:textColorcolor/primary android:textSize14sp / /LinearLayoutlayout_weight1让输入框吃掉剩余宽度验证码按钮固定 110dp这是经过测试的宽度既能放下60s 后重发这种中文字符串又不会把输入框挤得太窄。验证码的inputTypenumber弹出纯数字键盘maxLength6限制长度。验证码按钮用 TextView 而不用 Button是为了去掉 Button 自带的内边距和阴影规则圆角胶囊样式完全由bg_code这个 drawable 控制。点击区域仍然够大因为 TextView 本身撑满了 110dp 乘 52dp 的矩形区域。4.2 表单校验独立成类手机号、验证码、密码一致性注册页的校验比登录页多如果全部堆在 Activity 里onClick里会长出一大串 if 判断看着累而且没法复用。我一般把校验逻辑抽成一个独立对象Activity 只管调用拿到错误信息就直接提示object RegisterFormValidator { private val phoneRegex Regex(^1[3-9]\\d{9}$) fun validate(phone: String, code: String, pwd: String, confirm: String): String? { if (!phoneRegex.matches(phone)) return 手机号格式不正确 if (code.length ! 6) return 验证码不完整 if (pwd.length 6) return 密码至少 6 位 if (pwd ! confirm) return 两次密码不一致 return null } }返回String?的设计意图是返回 null 表示校验通过返回字符串表示错误信息。调用方拿到非空就直接 Toast不需要在 Activity 里写判断逻辑。校验顺序也有讲究先查手机号格式再查验证码然后密码长度最后确认密码一致性——这个顺序符合用户填表的直觉报错不会跳跃。密码长度限制写在客户端的价值是提前拦截明显弱密码但真正的密码策略仍然要服务端把关客户端校验只是体验层的一环。pwd ! confirm直接比较字符串注意不要在比较前对密码做 trim密码中的空格是合法字符trim 反而会误导用户。4.3 验证码倒计时60 秒防重复请求的实现获取验证码按钮的交互核心是倒计时防重。用户点一次之后按钮进入 60 秒倒计时期间不可再点标题上每秒刷新剩余秒数。实现上用 CountDownTimer但有几个细节不做就会出问题private var countDownTimer: CountDownTimer? null private var counting false private fun startCountDown() { if (counting) return counting true binding.btnSendCode.isEnabled false countDownTimer?.cancel() countDownTimer object : CountDownTimer(60_000L, 1_000L) { override fun onTick(millisUntilFinished: Long) { binding.btnSendCode.text ${millisUntilFinished / 1000}s后重发 } override fun onFinish() { counting false binding.btnSendCode.text 重新获取 binding.btnSendCode.isEnabled true } }.start() } override fun onDestroy() { super.onDestroy() countDownTimer?.cancel() }countDownTimer?.cancel()这段很关键。用户手速快在倒计时结束前退出了页面又进来如果不先 cancel 掉旧 Timer旧的回调还在跑可能同时存在两条倒计时在改同一个按钮的文案显示就会乱跳。counting是一个布尔闸门防止连点导致启动多个 Timer。onDestroy里 cancel 是必须做的一步。Activity 销毁后 Timer 如果还在运行回调持有的 Context 就泄漏了轻则资源无法释放重则在回调里访问已经销毁的 View 时直接崩溃。这个习惯养成之后登录页那种只请求一次的短操作可以不管但倒计时和轮询这类长生命周期任务一定要清理。4.4 页面转场与输入法收起细节登录页和注册页之间的跳转默认动画是从左边滑入新页面但现在的登录注册设计多半是从右侧推进去返回时弹回来。处理方式很简单在 startActivity 后调用overridePendingTransitionstartActivity(Intent(this, RegisterActivity::class.java)) overridePendingTransition(R.anim.slide_in_right, R.anim.slide_out_left)对应的入场动画资源?xml version1.0 encodingutf-8? set xmlns:androidhttp://schemas.android.com/apk/res/android android:duration220 translate android:fromXDelta100% android:toXDelta0% android:interpolatorandroid:interpolator/decelerate_quad / /setfromXDelta100%表示新页面从屏幕右侧完全移入场decelerate_quad插值器让动画先快后慢手感更柔和。slide_out_left就是当前页面从 0% 到 -100% 移出两个动画同时播放就得到了标准的推入效果。返回注册页到登录页时在 RegisterActivity 里用相同的方法调用但动画资源换成slide_in_left和slide_out_right保持视觉逻辑统一。这里有个容易漏的处理从注册页返回时如果登录页的输入框还停留在之前的焦点状态键盘会在返回瞬间自动弹起。常见做法是在登录页的onResume里把焦点清掉让hideKeyboard()在跳转前已经执行过这样返回时页面是干净的不会出一半键盘。5. 登录注册界面的常见坑键盘、背景、重复提交的排查清单5.1 软键盘把登录按钮顶出屏幕现象在小屏手机或横屏状态下点击密码输入框登录按钮整个消失怎么滑动都看不到。原因Activity 没有配置软键盘模式系统默认的adjustUnspecified在部分设备上会走adjustPan把整个布局往上顶而不是压缩可滚动区域。ScrollView 在这种情况下形同虚设。解决在 Manifest 里的 Activity 节点上显式配置android:windowSoftInputModeadjustResize同时保证布局是本文第 3 章的结构——ScrollView 包住表单。adjustResize 会让窗口缩小并把压缩后的空间交给 ScrollView 滚动按钮自然能滚动到可视区。这两个条件缺一个都不行只配 adjustResize 但没有 ScrollView布局会被硬压缩控件挤成一团。5.2 输入框聚焦后背景变灰、圆角消失现象点击输入框准备输入原本白底圆角的输入框突然变成灰色矩形或者聚焦后颜色变成系统主题色圆角还在但颜色非常脏。原因多半是在 EditText 上同时设置了android:background和android:backgroundTint。backgroundTint 会把 selector 里定义的白色 solid 覆盖成主题色而部分 ROM 的主题色是灰色系聚焦时状态变化触发重绘灰底就冒出来了。解决删掉 EditText 上所有 backgroundTint 相关属性背景只保留显式的 selector drawable。检查主题里有没有全局的colorControlActivated影响着色如果有且不方便改就在 EditText 的android:background上做文章——selector 里的state_focused项覆盖了大部分情况Tint 被显式 background 阻挡后不再生效。5.3 沉浸式状态栏和 adjustResize 打架现象页面配置了透明状态栏或全屏沉浸式键盘弹起时布局纹丝不动登录按钮被键盘盖住或者页面顶部多出一块空白。原因从 Android 15 开始系统强制 Edge-to-Edge大量应用也主动setDecorFitsSystemWindows(false)让内容延伸到状态栏后面。但这种模式下adjustResize不再自动生效系统把 IME 的 insets 交给你自己处理不处理就只能等键盘盖内容。解决不要只在 Manifest 层面折腾在根布局上手动监听 WindowInsets。对 ScrollView 设置一个OnApplyWindowInsetsListener把键盘高度作为 paddingBottom 加给根布局让滚动区域缩小到键盘上方ViewCompat.setOnApplyWindowInsetsListener(binding.scrollRoot) { v, insets - val ime insets.getInsets(WindowInsetsCompat.Type.ime()) v.setPadding(0, 0, 0, ime.bottom) insets }这段代码放在setContentView之后即可。ime.bottom拿到的是键盘实际高度设为根布局的 padding 后ScrollView 的可视区域被压缩按钮就能通过滚动露出来。注意不要把这个逻辑和 fitsSystemWindows 混用两个机制同时开会出现 padding 叠加页面上下各空一块。5.4 连续点击按钮造成重复提交现象登录按钮或获取验证码按钮快速连点两下发出两个请求注册流程里收到两条验证码短信。原因按钮点击后虽然有禁用逻辑但禁用发生在请求发起之后连点的两次点击之间不存在状态切换窗口两次onClick都执行了。解决登录按钮在点击回调的第一行就isEnabled false并且在网络请求返回前不做恢复。验证码按钮则是在倒计时启动前检查counting为 true 直接 return。更通用的做法是给按钮设一个点击防抖的扩展函数记录上次点击时间间隔小于 500ms 就忽略private fun View.setClickThrottle(intervalMs: Long 500, action: () - Unit) { var lastClick 0L setOnClickListener { val now System.currentTimeMillis() if (now - lastClick intervalMs) { lastClick now action() } } }防抖不能替代禁用按钮但可以作为第二道保险。网络慢的场景下用户等得不耐烦会反复点防抖至少保证回调不会连续触发。5.5 自动填充让输入框变成黄色现象手机号输入框获得焦点后系统自动填充弹窗弹出来选中填充内容后输入框背景变成黄色和整套白色圆角设计格格不入。原因Android 8.0 以上的 Autofill 框架会标注所有可自动填充的输入框填充发生后系统绘制一层高亮底色提示用户这里被系统填充了。这个颜色跟随系统主题很多 ROM 用的就是淡黄色。解决登录注册界面里如果不希望系统接管填充在输入框上显式声明android:importantForAutofillno。注意这是全量关闭自动填充如果产品上希望保留建议填写功能就不能这么干需要接 AutofillManager 提交填充数据。对于大部分以演示为主或内部使用的登录注册源码直接关掉是省心的做法黄底对界面观感破坏太大。6. 进阶让登录注册界面动起来并验证交互闭环6.1 输入框聚焦时的轻微动画selector 的描边变色是静态反馈加上轻微缩放会让界面活起来。对输入框设置焦点监听聚焦时放大到 1.02 倍失焦时恢复。幅度不能大登录页是表单场景放太大显得轻浮binding.etPhone.setOnFocusChangeListener { view, hasFocus - view.animate() .scaleX(if (hasFocus) 1.02f else 1f) .scaleY(if (hasFocus) 1.02f else 1f) .setDuration(180) .start() }这个动画成本极低ViewPropertyAnimator 在 UI 线程直接跑登录页两三个输入框完全没有性能压力。注意不要在列表类页面里这么干滚动时焦点变化会触发频繁动画掉帧。登录注册这种固定控件页面它是最划算的精致感来源。6.2 登录成功后的清栈跳转登录成功后跳主页不能直接在当前 Activity 上 startActivity否则用户按返回键会退回登录页这是最典型的交互错误。正确做法是清掉任务栈里所有页面val intent Intent(this, MainActivity::class.java).apply { flags Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK } startActivity(intent)FLAG_ACTIVITY_CLEAR_TASK会清空之前的 Activity 实例FLAG_ACTIVITY_NEW_TASK在新任务中启动主页两个配合返回键直接退到桌面永远不会回到登录界面。注册成功的跳转同理。演示源码里如果没写这一步你接到自己工程时一定要补上。6.3 没有后端时怎么验证交互最后说一个我自己的习惯接不到后端的阶段先把交互闭环跑通。登录按钮点击后用一个协程延迟模拟请求1 秒后跳转主页验证码按钮则真实走倒计时本地随机生成四位验证码打印到日志里模拟发送。这样动画、按钮状态、键盘逻辑全都被真实触发前端交互的每个细节都验证一遍。等后端接口真的给出来了只需要把模拟请求替换成网络调用登录跳转、倒计时防重、异常提示这些逻辑全部复用不需要重新测一遍。这种交互先行、接口后接的做法让登录注册页的开发不受后端进度卡脖子。说句大实话登录注册界面好不好看是评审一眼的事但稳不稳是用户天天在用的事。我从做完第一个界面到现在每次自测都把键盘顶起、insets 冲突、重复提交这三件事列在清单最前面检查完再谈设计稿还原度。希望帮到你。本文还有配套的精品资源点击获取
简介这是一份面向Android初学者的登录注册界面示例工程聚焦应用首次触达用户时的视觉与交互体验。工程基于Material Design规范展示了输入框浮动标签、密码明文切换、按钮样式定制以及页面切换动画等实现细节同时涵盖Intent跳转、SharedPreferences本地存储和网络请求的基础写法适合希望快速搭建美观登录模块的开发者参考。压缩包共52个文件以XML布局资源、PNG切图、Java源码和class编译文件为主另含可直接安装的APK与调试用dex、jar库整体体积仅1.27MB结构精简便于逐项拆解。已有6483人学习下载可作为UI布局、事件处理与数据交互综合练习的入门范例。1. 登录注册界面看着越简单越是 Android 工程里翻车率最高的页面登录注册界面大概是 Android 里视觉上最不起眼、实际最容易出问题的一类页面两个输入框、一个按钮背后却牵扯软键盘遮挡、焦点切换、表单校验、倒计时防重和页面转场。你从网上下载一份漂亮源码很容易但换个手机装上就会出现按钮被键盘顶飞、输入框聚焦后背景变灰、状态栏颜色和页面不融合之类的问题。这篇文章不打算把源码当黑匣子丢给你而是把一套可运行的漂亮登录注册界面拆开讲——布局怎么搭、交互状态怎么维护、哪些参数必须动、哪几个坑绕不开。照着写完这份登录注册界面源码就能落到你自己的工程里跑起来。2. 界面选型与源码组织XML 和 Compose 怎么选资源放哪一层2.1 XML 布局和 Compose 的差异先看工程再看喜好现在做登录注册界面第一道选择题是用传统 XML 布局还是 Jetpack Compose。很多人在这一步纠结很久但判断标准其实很粗暴你要是往一个已经跑了两三年的老工程里塞登录页主工程八成还是 View 体系贸然引 Compose 会带来编译器版本、依赖体积和团队学习成本一堆问题反过来新项目从零起团队愿意接受声明式 UICompose 写动画确实爽快。我的习惯是老工程跟主栈走新项目看团队。登录注册这种页面控件是固定的EditText、Button、倒计时 TextView 三件套XML 写起来一点不慢而且网上大量现成资源和老同事的经验都沉淀在 View 体系里。Compose 的优势在状态驱动和动画编排登录页用得到的只有边缘一点。另外要澄清一个常见误区所谓漂亮不是依赖某个炫酷框架而是颜色、圆角、间距和状态反馈的统一。这套东西在 XML 里用 shape、selector 就能做得很细不需要为了好看就上重框架。选型定了之后源码组织就顺理成章。2.2 模块结构页面、控件、资源按三层放拿到或写完一份登录注册界面源码第一步是看清楚文件结构。我见过不少新手把布局、背景、颜色全塞在 Activity 一个文件里改起来非常痛苦。常见做法是分成页面层、控件层、资源层三层页面层只管业务逻辑控件层管输入框按钮的视觉状态资源层放颜色、尺寸和动画定义。一份结构清晰的登录注册模块大概长这样app/src/main/ ├── java/com/example/app/ │ ├── login/LoginActivity.kt │ ├── login/RegisterActivity.kt │ └── login/RegisterFormValidator.kt └── res/ ├── layout/activity_login.xml ├── layout/activity_register.xml ├── drawable/bg_input.xml ├── drawable/bg_btn_login.xml ├── drawable/bg_code.xml ├── anim/slide_in_right.xml ├── anim/slide_out_left.xml ├── values/colors.xml └── values/dimens.xml包名按你自己的工程改这里只是示意。Layout 里只放结构和尺寸引用背景全部指向 drawable颜色统一在 colors.xml这样换主题色的时候只改一处不用在每个页面里翻找十六进制色值。登录和注册两个 Activity 各管各的页面共用的校验逻辑抽成 RegisterFormValidator输入框背景、按钮背景这些跨页面复用的资源放 drawable 公共目录。这套结构的好处很实际改按钮圆角不用动 Java/Kotlin 代码换主色调不用碰布局排查问题的时候一眼就知道该去哪个文件。2.3 设计参数先定死颜色、圆角、间距动手写代码之前先把设计参数固定下来。登录注册界面最容易做飘的地方就是参数不统一——左边输入框圆角 12dp右边按钮圆角 30dp看着就散。我一般先定一张参数表所有页面共用。参数取值说明主色#3D7EFF按钮、聚焦描边、链接文字渐变深色#2E68E6按钮渐变终点、按压态页面背景#F7F8FA灰白底和白色输入框拉开层次输入框背景#FFFFFF纯白配 1dp 浅灰描边输入框圆角14dp圆润但不显幼稚输入框高度52dp点击区域充足单手操作舒服按钮圆角26dp胶囊感和输入框区分内容左右边距24dp屏宽 360dp 时留白比例合适这几个值不是标准答案但它们是一套值。主色和渐变深色用于按钮输入框用白底加描边聚焦时描边换成主色。圆角分两档输入框 14dp按钮 26dp对比出层级。高度统一 52dp避免有的页面 48dp、有的 56dp 导致视觉高低不一。这些参数定完后进入实现阶段看到的代码就全是围绕着这张表在写。后面所有小节里的代码都基于这组值。3. 登录页实现从空工程到可运行的登录界面3.1 布局骨架ScrollView 包住表单是基本操作登录页布局看起来简单但有一个原则从一开始就要守住表单区域必须被 ScrollView 包住。原因很实际小屏手机或横屏状态下软键盘弹起来会压缩可视区域如果不让表单可滚动登录按钮就会被顶出屏幕用户得先把键盘缩回去才能点击。这不是玄学是每天都会遇到的场景。下面是登录页的布局骨架根布局用 ConstraintLayoutScrollView 占满全屏里面套一个 LinearLayout 垂直排列所有控件?xml version1.0 encodingutf-8? androidx.constraintlayout.widget.ConstraintLayout xmlns:androidhttp://schemas.android.com/apk/res/android xmlns:apphttp://schemas.android.com/apk/res-auto android:layout_widthmatch_parent android:layout_heightmatch_parent android:backgroundcolor/page_bg ScrollView android:idid/scroll_root android:layout_width0dp android:layout_height0dp android:fillViewporttrue android:scrollbarsnone app:layout_constraintTop_toTopOfparent app:layout_constraintBottom_toBottomOfparent LinearLayout android:layout_widthmatch_parent android:layout_heightwrap_content android:orientationvertical android:paddingLeft24dp android:paddingRight24dp android:paddingTop64dp android:paddingBottom24dp TextView android:idid/tv_logo android:layout_widthwrap_content android:layout_heightwrap_content android:text模拟项目X android:textSize28sp android:textStylebold android:textColorcolor/text_main / EditText android:idid/et_phone android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop48dp android:hint请输入手机号 android:inputTypephone android:maxLength11 android:backgrounddrawable/bg_input android:paddingLeft16dp android:paddingRight16dp android:textSize15sp / EditText android:idid/et_password android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop16dp android:hint请输入密码 android:inputTypetextPassword android:backgrounddrawable/bg_input android:paddingLeft16dp android:paddingRight16dp / Button android:idid/btn_login android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop32dp android:backgrounddrawable/bg_btn_login android:stateListAnimatornull android:text登录 android:textColorcolor/white android:enabledfalse / TextView android:idid/tv_go_register android:layout_widthwrap_content android:layout_heightwrap_content android:layout_gravitycenter_horizontal android:layout_marginTop16dp android:text没有账号去注册 android:textColorcolor/primary android:padding4dp / /LinearLayout /ScrollView /androidx.constraintlayout.widget.ConstraintLayout这里有几个参数需要特别说明。ScrollView 的fillViewporttrue很关键它让 ScrollView 在内容不足一屏时仍然撑满视口高度这样后续如果想让按钮固定在屏幕底部LinearLayout 才有条件使用layout_gravitybottom。scrollbarsnone是为了美观登录页内容量少不需要显示滚动条。EditText 的maxLength11是配合手机号输入的场景限制inputTypephone会弹出数字键盘。Button 上的stateListAnimatornull是去掉 Android 5.0 以后默认的阴影高度变化不然圆角背景在点击时会带一个突兀的投影很丑。初始状态把登录按钮enabledfalse配合下面的背景 selector按钮会呈现灰色等输入合法后再点亮。这里不要图省事让按钮一直可点交互上不可点就明确灰掉比点了报错体验好很多。3.2 输入框背景 selector 与焦点反馈输入框的美感很大程度来自聚焦反馈。默认 EditText 的底线式样式在白色背景上不显眼我一般用圆角白底加描边聚焦时描边变主色。这个效果不用写代码控制一个 selector 就能搞定?xml version1.0 encodingutf-8? selector xmlns:androidhttp://schemas.android.com/apk/res/android item android:state_focusedtrue shape android:shaperectangle solid android:color#FFFFFF / stroke android:width1.5dp android:colorcolor/primary / corners android:radius14dp / /shape /item item shape android:shaperectangle solid android:color#FFFFFF / stroke android:width1dp android:color#E6E8EB / corners android:radius14dp / /shape /item /selectorselector 的顺序有讲究state_focused的 item 必须放在最前面系统按从上到下的顺序匹配状态。如果放在最后聚焦时前面的默认 item 已经匹配上了聚焦效果就不会生效。stroke的宽度在聚焦时从 1dp 变成 1.5dp不要小看这 0.5dp视觉上描边会明显实起来和颜色变化叠加焦点一眼就能看出来。还有一点要注意不要在 EditText 上同时设置android:background和android:backgroundTint。backgroundTint 会给 drawable 叠加一层着色常常把 shape 里的颜色染成系统主题色导致聚焦后背景发灰。用了这个 selectorbackgroundTint 就不再需要了删干净。3.3 登录按钮状态流转与点击处理界面画好了接下来是交互逻辑。登录按钮的可用状态由两个输入框的内容驱动手机号符合正则、密码长度不小于 6 位按钮才点亮。这里用 TextWatcher 监听输入变化每次输入都重新计算按钮状态class LoginActivity : AppCompatActivity() { private lateinit var binding: ActivityLoginBinding private val phoneRegex Regex(^1[3-9]\\d{9}$) override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) binding ActivityLoginBinding.inflate(layoutInflater) setContentView(binding.root) binding.etPhone.addTextChangedListener(loginWatcher) binding.etPassword.addTextChangedListener(loginWatcher) binding.btnLogin.setOnClickListener { hideKeyboard() login() } binding.tvGoRegister.setOnClickListener { startActivity(Intent(this, RegisterActivity::class.java)) overridePendingTransition(R.anim.slide_in_right, R.anim.slide_out_left) } } private val loginWatcher object : TextWatcher { override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {} override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {} override fun afterTextChanged(s: Editable?) { val phone binding.etPhone.text.toString().trim() val pwd binding.etPassword.text.toString() binding.btnLogin.isEnabled phoneRegex.matches(phone) pwd.length 6 } } private fun login() { val phone binding.etPhone.text.toString().trim() val pwd binding.etPassword.text.toString() if (!phoneRegex.matches(phone)) { Toast.makeText(this, 手机号格式不对, Toast.LENGTH_SHORT).show() return } // 这里替换成你的真实登录接口 binding.btnLogin.isEnabled false } private fun hideKeyboard() { val imm getSystemService(INPUT_METHOD_SERVICE) as InputMethodManager imm.hideSoftInputFromWindow(currentFocus?.windowToken, 0) } }TextWatcher 要求实现三个回调beforeTextChanged和onTextChanged在这个场景下用不到但必须空实现。真正起作用的是afterTextChanged每次文本变化后统一刷新按钮状态比分别在两个输入框里写监听更省代码。currentFocus?.windowToken用了安全调用防止焦点为空时传 null 给系统方法导致异常。手机号正则^1[3-9]\d{9}$是最常见的校验方式但注意它只是客户端交互反馈拦截明显的手误真正严格的号段判断应该在后端做。按钮点击后先收起键盘再进入登录逻辑这是移动端的基本礼仪——不收起键盘请求成功跳转时键盘还挂在旧页面上视觉上很脏。btnLogin.isEnabled false是为了防止用户在请求期间再次点击等接口回调后再恢复或者直接跳转。4. 注册页与登录联动校验、倒计时、转场一次到位4.1 注册页布局比登录页多出的三个控件注册页和登录页的骨架完全一样还是 ScrollView 包表单但内容上多了三个部分验证码输入框、获取验证码按钮、确认密码输入框。验证码那行是一个横向布局左边输入框占剩余宽度右边一个固定宽度的获取验证码按钮这是注册页最典型的结构。LinearLayout android:layout_widthmatch_parent android:layout_height52dp android:layout_marginTop16dp android:orientationhorizontal EditText android:idid/et_code android:layout_width0dp android:layout_heightmatch_parent android:layout_weight1 android:backgrounddrawable/bg_input android:hint验证码 android:inputTypenumber android:maxLength6 android:paddingLeft16dp android:paddingRight16dp / TextView android:idid/btn_send_code android:layout_width110dp android:layout_heightmatch_parent android:layout_marginLeft12dp android:gravitycenter android:backgrounddrawable/bg_code android:text获取验证码 android:textColorcolor/primary android:textSize14sp / /LinearLayoutlayout_weight1让输入框吃掉剩余宽度验证码按钮固定 110dp这是经过测试的宽度既能放下60s 后重发这种中文字符串又不会把输入框挤得太窄。验证码的inputTypenumber弹出纯数字键盘maxLength6限制长度。验证码按钮用 TextView 而不用 Button是为了去掉 Button 自带的内边距和阴影规则圆角胶囊样式完全由bg_code这个 drawable 控制。点击区域仍然够大因为 TextView 本身撑满了 110dp 乘 52dp 的矩形区域。4.2 表单校验独立成类手机号、验证码、密码一致性注册页的校验比登录页多如果全部堆在 Activity 里onClick里会长出一大串 if 判断看着累而且没法复用。我一般把校验逻辑抽成一个独立对象Activity 只管调用拿到错误信息就直接提示object RegisterFormValidator { private val phoneRegex Regex(^1[3-9]\\d{9}$) fun validate(phone: String, code: String, pwd: String, confirm: String): String? { if (!phoneRegex.matches(phone)) return 手机号格式不正确 if (code.length ! 6) return 验证码不完整 if (pwd.length 6) return 密码至少 6 位 if (pwd ! confirm) return 两次密码不一致 return null } }返回String?的设计意图是返回 null 表示校验通过返回字符串表示错误信息。调用方拿到非空就直接 Toast不需要在 Activity 里写判断逻辑。校验顺序也有讲究先查手机号格式再查验证码然后密码长度最后确认密码一致性——这个顺序符合用户填表的直觉报错不会跳跃。密码长度限制写在客户端的价值是提前拦截明显弱密码但真正的密码策略仍然要服务端把关客户端校验只是体验层的一环。pwd ! confirm直接比较字符串注意不要在比较前对密码做 trim密码中的空格是合法字符trim 反而会误导用户。4.3 验证码倒计时60 秒防重复请求的实现获取验证码按钮的交互核心是倒计时防重。用户点一次之后按钮进入 60 秒倒计时期间不可再点标题上每秒刷新剩余秒数。实现上用 CountDownTimer但有几个细节不做就会出问题private var countDownTimer: CountDownTimer? null private var counting false private fun startCountDown() { if (counting) return counting true binding.btnSendCode.isEnabled false countDownTimer?.cancel() countDownTimer object : CountDownTimer(60_000L, 1_000L) { override fun onTick(millisUntilFinished: Long) { binding.btnSendCode.text ${millisUntilFinished / 1000}s后重发 } override fun onFinish() { counting false binding.btnSendCode.text 重新获取 binding.btnSendCode.isEnabled true } }.start() } override fun onDestroy() { super.onDestroy() countDownTimer?.cancel() }countDownTimer?.cancel()这段很关键。用户手速快在倒计时结束前退出了页面又进来如果不先 cancel 掉旧 Timer旧的回调还在跑可能同时存在两条倒计时在改同一个按钮的文案显示就会乱跳。counting是一个布尔闸门防止连点导致启动多个 Timer。onDestroy里 cancel 是必须做的一步。Activity 销毁后 Timer 如果还在运行回调持有的 Context 就泄漏了轻则资源无法释放重则在回调里访问已经销毁的 View 时直接崩溃。这个习惯养成之后登录页那种只请求一次的短操作可以不管但倒计时和轮询这类长生命周期任务一定要清理。4.4 页面转场与输入法收起细节登录页和注册页之间的跳转默认动画是从左边滑入新页面但现在的登录注册设计多半是从右侧推进去返回时弹回来。处理方式很简单在 startActivity 后调用overridePendingTransitionstartActivity(Intent(this, RegisterActivity::class.java)) overridePendingTransition(R.anim.slide_in_right, R.anim.slide_out_left)对应的入场动画资源?xml version1.0 encodingutf-8? set xmlns:androidhttp://schemas.android.com/apk/res/android android:duration220 translate android:fromXDelta100% android:toXDelta0% android:interpolatorandroid:interpolator/decelerate_quad / /setfromXDelta100%表示新页面从屏幕右侧完全移入场decelerate_quad插值器让动画先快后慢手感更柔和。slide_out_left就是当前页面从 0% 到 -100% 移出两个动画同时播放就得到了标准的推入效果。返回注册页到登录页时在 RegisterActivity 里用相同的方法调用但动画资源换成slide_in_left和slide_out_right保持视觉逻辑统一。这里有个容易漏的处理从注册页返回时如果登录页的输入框还停留在之前的焦点状态键盘会在返回瞬间自动弹起。常见做法是在登录页的onResume里把焦点清掉让hideKeyboard()在跳转前已经执行过这样返回时页面是干净的不会出一半键盘。5. 登录注册界面的常见坑键盘、背景、重复提交的排查清单5.1 软键盘把登录按钮顶出屏幕现象在小屏手机或横屏状态下点击密码输入框登录按钮整个消失怎么滑动都看不到。原因Activity 没有配置软键盘模式系统默认的adjustUnspecified在部分设备上会走adjustPan把整个布局往上顶而不是压缩可滚动区域。ScrollView 在这种情况下形同虚设。解决在 Manifest 里的 Activity 节点上显式配置android:windowSoftInputModeadjustResize同时保证布局是本文第 3 章的结构——ScrollView 包住表单。adjustResize 会让窗口缩小并把压缩后的空间交给 ScrollView 滚动按钮自然能滚动到可视区。这两个条件缺一个都不行只配 adjustResize 但没有 ScrollView布局会被硬压缩控件挤成一团。5.2 输入框聚焦后背景变灰、圆角消失现象点击输入框准备输入原本白底圆角的输入框突然变成灰色矩形或者聚焦后颜色变成系统主题色圆角还在但颜色非常脏。原因多半是在 EditText 上同时设置了android:background和android:backgroundTint。backgroundTint 会把 selector 里定义的白色 solid 覆盖成主题色而部分 ROM 的主题色是灰色系聚焦时状态变化触发重绘灰底就冒出来了。解决删掉 EditText 上所有 backgroundTint 相关属性背景只保留显式的 selector drawable。检查主题里有没有全局的colorControlActivated影响着色如果有且不方便改就在 EditText 的android:background上做文章——selector 里的state_focused项覆盖了大部分情况Tint 被显式 background 阻挡后不再生效。5.3 沉浸式状态栏和 adjustResize 打架现象页面配置了透明状态栏或全屏沉浸式键盘弹起时布局纹丝不动登录按钮被键盘盖住或者页面顶部多出一块空白。原因从 Android 15 开始系统强制 Edge-to-Edge大量应用也主动setDecorFitsSystemWindows(false)让内容延伸到状态栏后面。但这种模式下adjustResize不再自动生效系统把 IME 的 insets 交给你自己处理不处理就只能等键盘盖内容。解决不要只在 Manifest 层面折腾在根布局上手动监听 WindowInsets。对 ScrollView 设置一个OnApplyWindowInsetsListener把键盘高度作为 paddingBottom 加给根布局让滚动区域缩小到键盘上方ViewCompat.setOnApplyWindowInsetsListener(binding.scrollRoot) { v, insets - val ime insets.getInsets(WindowInsetsCompat.Type.ime()) v.setPadding(0, 0, 0, ime.bottom) insets }这段代码放在setContentView之后即可。ime.bottom拿到的是键盘实际高度设为根布局的 padding 后ScrollView 的可视区域被压缩按钮就能通过滚动露出来。注意不要把这个逻辑和 fitsSystemWindows 混用两个机制同时开会出现 padding 叠加页面上下各空一块。5.4 连续点击按钮造成重复提交现象登录按钮或获取验证码按钮快速连点两下发出两个请求注册流程里收到两条验证码短信。原因按钮点击后虽然有禁用逻辑但禁用发生在请求发起之后连点的两次点击之间不存在状态切换窗口两次onClick都执行了。解决登录按钮在点击回调的第一行就isEnabled false并且在网络请求返回前不做恢复。验证码按钮则是在倒计时启动前检查counting为 true 直接 return。更通用的做法是给按钮设一个点击防抖的扩展函数记录上次点击时间间隔小于 500ms 就忽略private fun View.setClickThrottle(intervalMs: Long 500, action: () - Unit) { var lastClick 0L setOnClickListener { val now System.currentTimeMillis() if (now - lastClick intervalMs) { lastClick now action() } } }防抖不能替代禁用按钮但可以作为第二道保险。网络慢的场景下用户等得不耐烦会反复点防抖至少保证回调不会连续触发。5.5 自动填充让输入框变成黄色现象手机号输入框获得焦点后系统自动填充弹窗弹出来选中填充内容后输入框背景变成黄色和整套白色圆角设计格格不入。原因Android 8.0 以上的 Autofill 框架会标注所有可自动填充的输入框填充发生后系统绘制一层高亮底色提示用户这里被系统填充了。这个颜色跟随系统主题很多 ROM 用的就是淡黄色。解决登录注册界面里如果不希望系统接管填充在输入框上显式声明android:importantForAutofillno。注意这是全量关闭自动填充如果产品上希望保留建议填写功能就不能这么干需要接 AutofillManager 提交填充数据。对于大部分以演示为主或内部使用的登录注册源码直接关掉是省心的做法黄底对界面观感破坏太大。6. 进阶让登录注册界面动起来并验证交互闭环6.1 输入框聚焦时的轻微动画selector 的描边变色是静态反馈加上轻微缩放会让界面活起来。对输入框设置焦点监听聚焦时放大到 1.02 倍失焦时恢复。幅度不能大登录页是表单场景放太大显得轻浮binding.etPhone.setOnFocusChangeListener { view, hasFocus - view.animate() .scaleX(if (hasFocus) 1.02f else 1f) .scaleY(if (hasFocus) 1.02f else 1f) .setDuration(180) .start() }这个动画成本极低ViewPropertyAnimator 在 UI 线程直接跑登录页两三个输入框完全没有性能压力。注意不要在列表类页面里这么干滚动时焦点变化会触发频繁动画掉帧。登录注册这种固定控件页面它是最划算的精致感来源。6.2 登录成功后的清栈跳转登录成功后跳主页不能直接在当前 Activity 上 startActivity否则用户按返回键会退回登录页这是最典型的交互错误。正确做法是清掉任务栈里所有页面val intent Intent(this, MainActivity::class.java).apply { flags Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK } startActivity(intent)FLAG_ACTIVITY_CLEAR_TASK会清空之前的 Activity 实例FLAG_ACTIVITY_NEW_TASK在新任务中启动主页两个配合返回键直接退到桌面永远不会回到登录界面。注册成功的跳转同理。演示源码里如果没写这一步你接到自己工程时一定要补上。6.3 没有后端时怎么验证交互最后说一个我自己的习惯接不到后端的阶段先把交互闭环跑通。登录按钮点击后用一个协程延迟模拟请求1 秒后跳转主页验证码按钮则真实走倒计时本地随机生成四位验证码打印到日志里模拟发送。这样动画、按钮状态、键盘逻辑全都被真实触发前端交互的每个细节都验证一遍。等后端接口真的给出来了只需要把模拟请求替换成网络调用登录跳转、倒计时防重、异常提示这些逻辑全部复用不需要重新测一遍。这种交互先行、接口后接的做法让登录注册页的开发不受后端进度卡脖子。说句大实话登录注册界面好不好看是评审一眼的事但稳不稳是用户天天在用的事。我从做完第一个界面到现在每次自测都把键盘顶起、insets 冲突、重复提交这三件事列在清单最前面检查完再谈设计稿还原度。希望帮到你。本文还有配套的精品资源点击获取
