Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >专栏 >《Motion Design for iOS》(十五)

《Motion Design for iOS》(十五)

作者头像
Cloudox
发布于 2021-11-23 05:02:33
发布于 2021-11-23 05:02:33
8560
举报
文章被收录于专栏:月亮与二进制月亮与二进制

从UIKit和CoreAnimation开始

通常情况下,iOS app中屏幕上的物体都是UIView对象。它们是矩形的并且有坐标和大小来定义它们在屏幕上的位置和尺寸。UIView是用来构建你的界面的UIKit Framework中基本的界面对象。每个视图都可能伴随着文本、形状或图片绘制。比如说,iOS app中的状态栏是一个长且瘦的视图,处于屏幕的顶端,并且状态栏目中的每个物体(时间、电池指示器、信号强度指示器等等)都是状态栏视图中的其它视图。

这些是为某些功能或特性特定的特殊的UIView对象。包括作为界面按钮的UIButton、用来显示图片的UIImageView、显示文本的UILabel和显示列表的UITableView。你也可以通过绘制任何你想要的东西来完全自定义UIView

这是我的app Interesting for iPhone的截屏和界面中一些视图的分解。

  1. 运营商图像视图(苹果控制)
  2. wifi信号强度视图(苹果控制)
  3. 当前时间视图(苹果控制)
  4. 电池等级视图(苹果控制)
  5. “汉堡包”菜单按钮
  6. 标题栏中的标题标签
  7. 改变子板的按钮
  8. 一个UITableViewCell视图,用来包含UITableView中一行的元素
  9. UILabel中的帖子标题
  10. 评论数量UIButton,由一个评论气泡图和评论的数量组成
  11. 显示帖子URL的UILable
  12. UILabel中显示帖子的点值和子板

如果你不熟悉iOS用户界面开发,看看一些你喜欢的app,看能不能找出界面中所有的视图,以此作为分解你自己设计的练习,这样你就可以学习在代码中构建它们。

UIView对象有很多的职责,其中之一就是事件处理,即响应触摸事件。如果你想的话你界面中的所有视图都可以响应触摸事件,或者你可以指定只有特定的视图会在用户触摸它们时响应。

一个UIView本质上是一个包含内部图形的矩形。在屏幕上布局,靠近或在其他视图的顶部,还可能会有高级的透明效果来整合到一起或者快速绘制。像你想象的一样,让大量的视图在屏幕上移动确实是一个挑战,尤其是在一个小的,低功率的设备上。

这就是为什么苹果公司开发了Core Animation。

查看完整合集:https://github.com/Cloudox/Motion-Design-for-iOS

查看作者首页

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2017/11/20 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
《Motion Design for iOS》(四十三)
汉堡按钮和滑出式菜单可能是整个产业中最两极分化的界面元素。苹果的狂热支持者反对汉堡按钮和相应的滑出式菜单,说设计师(以及工程师、产品经理和CEO们)喜欢在那堆积尽可能多的东西,因为你有了很多垂直地空间。
Cloudox
2021/11/23
5540
《Motion Design for iOS》(四十三)
【iOS 开发】从 setNeedsLayout 说起
本文从 <code>setNeedsLayout</code> 这个方法说起,分享与其相关的 UIKit 视图交互、使用场景等内容。
KyXu
2019/04/11
7170
【iOS 开发】从 setNeedsLayout 说起
《Motion Design for iOS》(三十五)
这8个元素(或元素组,因为箭头和“Dance Club”文本是一起动画的)是通过不同的开始时间递进进入视图的,这就是我们要在动画中获取的非常酷的波浪感效果。
Cloudox
2021/11/23
5060
《Motion Design for iOS》(三十五)
ios入门之界面基础
学习移动app开发,我们常常从讲解基本的控件开始,如UILabel、UISearchBar、UIButton、UITextField等等。在实现一个简单的ios 应用之前,我们首先来看ios开发中一些基本的概念。 视图控制器(View Controllers) 视图控制器是MVC(Modl-View-Controller)模式的逻辑部分。按照字面意思,这个控制器能够控制某个视图。 UIViewController 苹果极力推崇MVC这种开发模式,并且帮我们实现了一个叫做UIViewController的控制
xiangzhihong
2018/02/06
1.7K0
ios入门之界面基础
《Motion Design for iOS》(十八)
从iOS 7开始,苹果在他现有的一套动画方法中添加了类弹簧的动画能力。实际上,他们还添加了很多东西;他们的UIKit Dynamics 框架是一个整合到了UIKit中的完整的物理引擎,允许你添加地心引力、弹簧附着、动力等到你的界面元素中。
Cloudox
2021/11/23
3860
《Motion Design for iOS》(十八)
《Motion Design for iOS》(四十二)
你玩过Loren Brichter的游戏Letterpress吗?我很喜欢的Loren构建的一个关于界面的东西可能不是每个人都明显喜欢的:我喜欢每个按钮在用户按下时立即切换到一个不同的状态的样子。绝对不会延迟。这不是一个简单实现的行为,因为即使你可以将一个图片设为UIButton的UIControlStateHighlighted状态图,它也只会在点击发生后一小会启动,而且它不允许更进一步的代码来运行它。如果我想要在用户点击一个UIButton后立即运行一个动画,我就不得不自己写一个简单的自定义按钮类。但首先,先来看一看我们要构建的是什么。
Cloudox
2021/11/23
3530
《Motion Design for iOS》(四十二)
《Motion Design for iOS》(三十二)
这是一个非常典型的添加图标按钮的方式。UIButton类有一个便利的方式来构建一个按钮:+buttonWithType:类方法。我将按钮类型设为UIButtonTypeCustom,意味着没有默认的风格会被设置,完全取决于我。这是一种实用的简单图标按钮,没有边界和其他怪异的风格需要移除。有点类似于CSS中对按钮进行重置。
Cloudox
2021/11/23
4680
《Motion Design for iOS》(三十二)
【iOS 开发】iOS 开发 简介 (IOS项目文件 | MVC 模式 | 事件响应机制 | Storyboard 控制界面 | 代码控制界面 | Retina 屏幕图片适配)
创建一个 HelloWorld 项目, 在这个 IOS 项目中有四个目录 : 如下图;
韩曙亮
2023/03/27
5K0
【iOS 开发】iOS 开发 简介 (IOS项目文件 | MVC 模式 | 事件响应机制 | Storyboard 控制界面 | 代码控制界面 | Retina 屏幕图片适配)
Texture
Texture原名是AsyncDisplayKit,是Facebook的paper团队发布的一个基于UIKit的库,这个库能够将图片加载、布局计算以及UI渲染等操作均放在后台线程,进而可以极大地优化APP界面的流畅度。
拉维
2019/08/12
2.4K1
Texture
iOS面试题-UI篇
面试题持续整理更新中,如果你正在面试或者想一起进阶,不妨添加一下交流群1012951431一起交流。
会写bug的程序员
2020/06/29
2K0
iOS面试题-UI篇
IOS开发之视图和视图控制器
        视图(View), 视图控制器(ViewController)是IOS开发UI部分比较重要的东西。在学习视图这一块的东西的时候,感觉和Java Swing中的Panel差不多。在UIKit框架中都有一个UIWindow来容纳我们的View。应用程序中几乎全部的可视控件都是UIView以及UIView的子类的实例,并且UIWindow也是UIView的子类。UIWindow可以不借助于父类视图显示在屏幕上,其余的视图都需要添加到父视图中才能显示。窗口是用来显示视图的,下面我们将会结合着实例来具
lizelu
2018/01/11
1.8K0
IOS开发之视图和视图控制器
《Motion Design for iOS》(十六)
Core Animation是一个动画和图形合成框架,用于提高速度和效率。虽然在名字中有动画的单词,不要让它误导你以为它只能做这个;它实际上负责屏幕上显示的所有视图的整体渲染体系结构,可以非常快速地进行透明度计算、图像过滤和视觉效果。它是为iOS创造的,但从OS X10.5开始,也可以在Mac上应用。
Cloudox
2021/11/23
2810
《Motion Design for iOS》(十六)
《Motion Design for iOS》(三十六)
现在让我们添加我们的行。它们也都是UIImageView,所以也只用直接在背景图片上放置就可以了。
Cloudox
2021/11/23
5280
《Motion Design for iOS》(三十六)
iOS开发常用之网络
表相关与的TabBar SWTableViewCell - 国内开源作者,带很多手势的表单元格。 MCSwipeTableViewCell - 带很多手势的表单元格。 TMQuiltView - 瀑布流。 XRWaterfallLayout - 超简单的瀑布流实现,实现说明。 WaterfallFlowDemo - 一个简单的UICollectionView瀑布流布局演示demo。 XLForm - 很多表格类的表,写法更高冷一点,推荐使用。 Eureka.swift - Eur
GuangdongQi
2018/12/18
23.7K0
【IOS开发基础系列】UIView专题
https://developer.apple.com/library/ios/documentation/WindowsViews/Conceptual/ViewPG_iPhoneOS/CreatingViews/CreatingViews.html
江中散人_Jun
2023/10/16
7090
【IOS开发基础系列】UIView专题
《Motion Design for iOS》(三十八)
我在我自己的iPhone app Interesting中也使用了波浪形的动画。来看看我的app的动画并构建它。
Cloudox
2021/11/23
4550
《Motion Design for iOS》(三十八)
iOS UI控件了解一下
5. UIView的操作方法 1)添加视图 UIView的addSubview:方法可以添加子视图,对于同一个视图的所有子视图来讲,后添加的子视图会把已加的子视图盖在下面。 UIView提供了其他添加视图的方法(详见下表):
用户5521279
2020/11/25
2.6K0
iOS UI控件了解一下
iOS 事件处理机制与图像渲染过程
致歉声明: Peter在开发公众号功能时触发了一个bug,导致群发错误。对此我们深表歉意,并果断开除了Peter。以下交回给正文时间: iOS 事件处理机制与图像渲染过程 iOS RunLoop都干了什么 iOS 为什么必须在主线程中操作UI 事件响应 CALayer CADisplayLink 和 NSTimer iOS 渲染过程 渲染时机 CPU 和 GPU渲染 Core Animation Facebook Pop介绍 AsyncDisplay介绍 参考文章 iOS RunLoop都干了什么 Ru
微信终端开发团队
2018/01/29
5.6K2
iOS 事件处理机制与图像渲染过程
最新iOS设计规范七|10大视觉规范(Visual Design)
iOS是运行于iPhone、iPad和iPod touch设备上、最常用的移动操作系统之一。作为互联网应用的开发者、产品经理、体验设计师,都应当理解并熟悉平台的设计规范。这有利于提高我们的工作效率,保证用户良好的体验。 本文是iOS设计规范系列第7篇,介绍视觉设计(Visual Design)。
晓吾
2021/04/08
8.1K0
最新iOS设计规范七|10大视觉规范(Visual Design)
View编程指南
在iOS中,您可以使用windows和views在屏幕上显示应用程序的内容。 Windows本身没有任何可见的内容,但为应用程序的views提供了一个基本的容器。 views定义了您想要填充某些内容的windows的一部分。 例如,您可能具有显示图像,文本,形状或其组合的views。 您还可以使用views来组织和管理其他views。
Helloted
2022/06/07
2.3K0
View编程指南
相关推荐
《Motion Design for iOS》(四十三)
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文