ios,ui是怎么排版的

时间:2016-05-11    来源:手抄报内容    点击:

ios,ui是怎么排版的(一):一份详尽全面的UI设计字体与排版指南

一份详尽全面的UI设计字体与排版指南

无论你是做网页还是App设计,文字内容总是能占到整个版面将近80%的区域。因此理解字体与排版对UI设计师来说非常关键。你需要始终把内容的可读性放在首位去考虑和权衡你对字体与排版的选择。

字体的基础术语

了解字体设计的基础术语非常重要,这些术语在介绍字体设计的相关文章中经常出现。比如 x-height(X字高)指的是从字母的基准线开始往上到最矮字母的顶端的距离,当X字高的比例相对大一些的话就能增加易读性。

汉字字形

在大多数情况下我们都选择使用系统自带的字体,比如微软雅黑、宋体、黑体等来定义标题和内容,但有时,我们在做Logo,banner设计时也需要通过对字体进行改造,来达到更加理想的效果。这时我们就需要掌握汉字的字形结构以及一些最基本的设计原则。

衬线字与非衬线字

在西方国家的字母体系,分成两大字族:serif(衬线字体)及sans serif(无衬线字体)。衬线字(下图中的宋体、Times New Roman)是指在字的笔画开始及结束的地方有额外的装饰,而且笔画的粗细会因直横的不同而有所不同。 相反的,无衬线字(下图中的思源黑体、Helvetica)就没有这些额外装饰,而且笔画粗细大致上是差不多。

衬线字的字体较易辨识,也因此具有较高的易读性。 反之无衬线字则较醒目。通常来说,需要强调、突出的小篇幅文字一般使用无衬线字,而在长篇正文中,为了阅读的便利,一般使用衬线字。在实际应用中,因为中文的宋体和西文的衬线体,中文的黑体和西文的无衬线体,在风格和应用场景上相似,所以通常搭配使用。

字体排版建议

【ios,ui是怎么排版的】

在你对字体排版技巧了如指掌之前,首先需要保证你的内容能够简单且清晰地展现出来。优秀的文字与排版使我们更愿意去阅读,所以最好先关注你所设定的字体和排版是否便于阅读,然后再考虑为了美观改进行修饰。我们可以参考这篇英文指南:优秀字体排版的5条原则 并且将文中的这些原则应用到我们的App和Web设计中去。

iOS中的系统字体

随着iOS 9系统以及EI Capitan系统的发布,现在的系统字体变为了Apple自己设计的 [San Francisco]。iOS仍然在其他地方使用SF UI,而在Apple Watch中使用SF Compact。【ios,ui是怎么排版的】

San Francisco 有两类尺寸: 文本模式(SF UI Text)和展示模式(SF UI

Display)。 文本模式适用于小于20 points的尺寸,展示模式则适用于大于20 points的尺寸。当你在你的app中使用San Francisco时,iOS会自动在适当的时机在文本模式和展示模式中切换。

注:如果你使用诸如Sketch或Photoshop的工具来进行设计,那么当你设置的字体大于等于20 points的时候,你需要切换到展示模式。iOS会根据字体大小为San Francisco自动调整字间距。

选择Body字体

【ios,ui是怎么排版的】

为body text挑选合适的字体是最重要的。务必选择那些可读性强的,看上去干净易读的字体。我推荐的常用英文字体有:San Francisco, Helvetica Neue, Avenir Next, Open Sans, Museo Sans。中文字体则有,华文细黑,思源黑体。

ios,ui是怎么排版的(二):iOS开发UI篇—IOS开发中Xcode的一些使用技巧

iOS开发UI篇—IOS开发中Xcode的一些使用技巧

一、快捷键的使用

经常用到的快捷键如下:

新建

shift + cmd + n 新建项目

cmd + n 新建文件

视图

option + cmd + 回车 打开助理编辑器

cmd + 回车 显示主窗口

cmd + 0 导航窗口

option + cmd + 0 工具窗口

在.m & .h之间切换 control + cmd + 上/下

按照浏览文件的前后顺序切换 control + cmd + 左右

查看头文件 control + cmd + j

切换到对应的函数control + 6 支持智能输入,注意输入法

运行

cmd + r 运行

cmd + . 停止

cmd + b 编译

cmd + shift + b 静态内存分析编译,可以检查程序结构上是否存在内存泄露

排版

control + i 将选中按钮重新缩进

cmd + ] 向右增加缩进

cmd + [ 向左减少缩进

cmd + / 注释/取消注释,提示:取消注释时,注释双斜线必须在行首

cmd + 向上 到文件开始位置

cmd + 向下 到文件末尾位置

二、OC专有注释

注释形式和效果

(1)#pragma mark 注释

(2)#pragma mark- 注释【ios,ui是怎么排版的】

三、warning的使用(注意)

使用形式:

#warning 代码还没有写完

可以帮助我们对代码进行快速的定位

四、代码块的使用

对于经常使用的代码块,可以以代码块的方式保存起来,设置提示词,以便快速的编码。

对代码块进行适当的编辑

使用<#name#>和<#type#>让保存的代码块不被“写死”;

设置后的提示效果:【ios,ui是怎么排版的】

五、打印内容查看(重写description方法的技巧)

代码示例: - (NSString *)description {

// 包含对象类型名称,以及对象的指针地址

return [NSString stringWithFormat:@"<%@: %p> {answer: %@, title: %@, icon: %@, options: %@}", [self class], self, self.answer, self.title, self.icon, self.options];

}

提示:

如果要在开发时,跟踪对象的明细信息,可以重写description方法,类似于java的toString()

为根类添加一个扩展

1 #import

"NSArray+Log.h"

2

3 @implementation NSArray (Log)

【ios,ui是怎么排版的】

4

5 - (NSString *)descriptionWithLocale:(id)locale

6 {

7 // 遍历数组中的所有内容,将内容拼接成一个新的字符串返回

8 NSMutableString *strM = [NSMutableString string];

9

10 [strM appendString:@"(\n"];

11

12 // 遍历数组,self就是当前的数组

13 for (id obj in self) {

14 // 在拼接字符串时,会调用obj的description方法

15 [strM appendFormat:@"\t%@,\n", obj];

16 }

17 [strM appendString:@")"];

18 return strM;

19 }

20

21 @end

ios,ui是怎么排版的

http://m.gbppp.com/jy/233793/

推荐访问:

最新文章
推荐文章
推荐内容