iOS开发UI篇—模仿ipad版QQ空间登录界面

简介: iOS开发UI篇—模仿ipad版QQ空间登录界面 一、实现和步骤 1.一般ipad项目在命名的时候可以加一个HD,标明为高清版 2.设置项目的文件结构,分为home和login两个部分    3.

iOS开发UI篇—模仿ipad版QQ空间登录界面

一、实现和步骤

1.一般ipad项目在命名的时候可以加一个HD,标明为高清版

2.设置项目的文件结构,分为home和login两个部分

  

3.登陆界面的设置

(1)设置第一个控制器和自定义的控制器类(登陆)关联

    

(2)设置控制器的view的颜色,RGB三个值都为42

  

(3)导入相关的素材图片

关于图片:一般给竖屏用的图片,以portrait名称标识,给横屏用的图片,以Landscape名称标识

修改plist文件,调整图片

    

提示:在项目中(ipad的使用中)有很多的地方都会用到图标

补充:关于apple开发运用中图标的尺寸,可以查看官方文档(apple icon)。

(4)初步的界面设置

添加一个UIimageView到storyboard中,设置其对应的图片。

使用outLayOut对其进行布局。设置其距离view的顶部有50的距离并固定,设置其水平居中。

       

添加一个view到storyboard中,用来装载密码,登陆等控件。

添加一个imageView到storyboard中,用来设置密码和登陆。(注意:这里提供的图片需要拉伸,设置拉伸最中间的1个像素)。

设置账号,调整约束。添加一个对应的textfield控件,设置约束,设置内部的文字颜色为白色,设置取出白色的背景,设置当编辑时提供一个清除按钮,设置键盘为数字键盘。

设置其边框样式

 

设置账号输入框的弹出键盘为数字键盘

 

设置弹出的数字键盘的return键位Next.

 

设置密码,步骤类似于账号,设置账号内部文字为密文。

  

设置清除按钮

  

设置密码输入框的弹出键盘的return键位Done.

  

(5)关于键盘的处理。

默认键盘。next,和Done。

让控制器称为文本框的代理。控制器需要遵守协议。

  

关于自动对文本框当前是否有数值进行判断,勾选选项,当textField中没有值的时候,(return)为灰色按钮,有值的时候可点。

  

点击Next按键,光标移动到密码输入框上,点击Done按键,执行登录相关操作。

实现代码如下(注意已经对两个textField进行了拖线处理)

  

说明:这里最简单的办法是在storyboard中给两个textfield设置两个tag值,在代码处理中根据其tag值取出相对应的textField,但是不推荐这么做。

二、登陆的设置

提示:在storyboard或者xib中对一块图片进行拉伸只对imageView有效,对按钮是没有效果的。

如何设置按钮填充:

第一种方式:使用代码拉伸最中间的一个像素。

  

第二种方式:直接对图片进行设置。

  

 

     

目录
相关文章
|
8月前
|
机器学习/深度学习 算法 定位技术
Baumer工业相机堡盟工业相机如何通过YoloV8深度学习模型实现裂缝的检测识别(C#代码UI界面版)
本项目基于YOLOv8模型与C#界面,结合Baumer工业相机,实现裂缝的高效检测识别。支持图像、视频及摄像头输入,具备高精度与实时性,适用于桥梁、路面、隧道等多种工业场景。
1050 27
|
iOS开发 开发者
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
859 67
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
|
iOS开发 开发者 MacOS
深入探索iOS开发中的SwiftUI框架
【10月更文挑战第21天】 本文将带领读者深入了解Apple最新推出的SwiftUI框架,这一革命性的用户界面构建工具为iOS开发者提供了一种声明式、高效且直观的方式来创建复杂的用户界面。通过分析SwiftUI的核心概念、主要特性以及在实际项目中的应用示例,我们将展示如何利用SwiftUI简化UI代码,提高开发效率,并保持应用程序的高性能和响应性。无论你是iOS开发的新手还是有经验的开发者,本文都将为你提供宝贵的见解和实用的指导。
434 66
|
JavaScript 搜索推荐 Android开发
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
519 8
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
|
存储 JSON JavaScript
WEB CAD插件通过上下文对象MxPluginContext修改UI界面的方法
本文介绍了如何使用MxPluginContext动态控制MxCAD项目的UI界面。通过该上下文对象,开发者可以灵活设置UI配置,如控制操作栏显隐、编辑按钮、添加侧边栏等。具体方法包括调用`getUiConfig()`获取并修改`mxUiConfig.json`中的属性,实现界面的定制化。此外,还提供了控制命令行聚焦的功能,解决输入框焦点锁定问题。详细代码示例和效果对比图展示了具体实现步骤,帮助开发者更好地适配项目需求。
|
移动开发 前端开发 Java
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)
JavaFX是Java的下一代图形用户界面工具包。JavaFX是一组图形和媒体API,我们可以用它们来创建和部署富客户端应用程序。 JavaFX允许开发人员快速构建丰富的跨平台应用程序,允许开发人员在单个编程接口中组合图形,动画和UI控件。本文详细介绍了JavaFx的常见用法,相信读完本教程你一定有所收获!
13601 5
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)
|
存储 监控 API
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
1640 11
|
人工智能 程序员 API
iOS|记一名 iOS 开发新手的前两次 App 审核经历
啥,这玩意也有新手保护期?
418 0
|
10月前
|
开发框架 前端开发 JavaScript
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发一
本文介绍了方舟开发框架(ArkUI)及其两种开发范式:基于ArkTS的声明式开发范式和类Web开发范式。ArkUI是用于构建HarmonyOS应用界面的UI框架,提供极简UI语法和基础设施。声明式开发范式使用ArkTS语言,以组件、动画和状态管理为核心,适合复杂团队协作;类Web开发范式采用HML、CSS、JavaScript三段式开发,适用于简单界面应用,贴近Web开发者习惯。文中还概述了两者的架构和基础能力,帮助开发者选择合适的范式进行高效开发。
344 15
|
10月前
|
编解码 前端开发 Java
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发三
本文介绍了基于声明式UI范式的图形绘制与动画效果实现方法,涵盖绘制图形、添加动画效果及常见组件说明三部分内容。在绘制图形部分,详细讲解了如何通过Circle组件为食物成分表添加圆形标签,以及使用Path组件结合SVG命令绘制自定义图形(如应用Logo)。动画效果部分则展示了如何利用animateTo实现闪屏动画,包括渐出、放大效果,并设置页面跳转;同时介绍了页面间共享元素转场动画的实现方式。最后,文章列举了声明式开发范式中的各类组件及其功能,帮助开发者快速上手构建复杂交互页面。
370 11

热门文章

最新文章