本文仅为自己学习整理,方便自己画原型时可以直接参考,不用再去别的地方整理,如果错误之处,欢迎各位老师、同学指正!
本文中试用的原型工具为Axure,本文只写了IOS 6的一些设计规范,包含了各种常用页面的设计尺寸。
IOS6的页面布局
IOS6的页面一般高为667px,宽为375px(ios6屏幕是4.7英寸的,设计稿的大小为750x1334px,这里直接写成平时设计用的尺寸了,方便自己用的直接直接参考)
其中页面主要分为了四大块,分别为状态栏(即平时看到的电量条区)、导航栏、标签栏、内容区
状态栏尺寸:20px,导航栏尺寸:44px,标签栏尺寸:49px
标题字号
导航栏里标题的字号一般是17px,返回和按钮的字体大小一般是16px。
返回和按钮的坐标 y轴位置一般是(44-16)/2+20=34
x轴坐标,一般可以设为15px,或者20px。我这里设置的为20px。
如果有副标题,副标题的大小一般为12px。
搜索框的大小
搜索框的高一般为28px,宽度一般为355px,搜索框内的字体大小一般为15px,圆角大小为10px。x轴坐标为10px,y轴坐标为28px。
带取消的搜索框,搜索框的高为28px,宽为311px,圆角大小为10px,x轴位置为10px,y轴位置为28px。
取消的字体大小一般为17px,前后间距为5px,x轴位置为331px,y轴位置为32px。
带按钮的搜索框,左边按钮的大小为28px×28px