听说最近这个系列火了????
我的iOS开发生涯可以追溯到2013年的那个寒冬。要是没记错的话应该是2013年。今年是2015,不可能是今年。去年是2014,好像也不是去年,没那么晚。那就应该是前年了。当初接触iOS的原因就不说了。实际上从我开始接触iOS到现在,真正有所突破的也只是在今年了。而且所谓的突破也只是从小白到入门而已。入门级的iOS开发者的水平嘛,一个大神概括的非常好,就是会写写界面,发发HTTP请求。这句话,我深以为然啊。当然,会这两个就已经能保证你开发出一个凑合能用的App了。所以,这系列教程我就沿着这个路线来。
画界面的基础
首先来看一个App中常见的登录界面。在画这个界面之前,首先要分析它由哪些部分组成。
上图标示出了这个界面的组成,从上往下依次是一个带有A字的背景图,登录按钮,注册按钮,邮箱文本框,密码文本框,下一步按钮,进入忘记密码界面的按钮。登录和注册按钮点击后会触发界面变化操作,这个先不考虑,暂时就把他们当做普通按钮处理。Ok,如果是我平时的思路,开发这个界面可能会按照以下这个顺序:
- 将这个界面的背景设为暗黑色,即文本框,下一步按钮所在区域的背景颜色。
- 在顶部增加带A字的背景图。
- 在带A字背景图上的底部左侧加登录按钮。
- 在带A字背景图上的底部右侧加注册按钮。
- 在带A字背景图下方添加邮箱文本框。
- 在邮箱文本框下方添加密码文本框。
- 在界面底部添加下一步按钮。
- 在下一步按钮下方增加忘记密码按钮。
好,上述顺序描述中频繁出现关于位置的信息。iOS中位置(绝对位置,以后再讲怎么适配不同尺寸的设备)的设定其实很简单。
上图解释了iOS位置的设定方法。屏幕的左上角,为笛卡尔坐标系的原点,我们可以将整个界面当做笛卡尔坐标系的第四象限,只是y轴的负数变为了正数。以注册按钮为例,它的坐标在x轴上为屏幕宽度的一半,在y轴上为带A字背景图的高度减50。为啥是减50,因为我将这个按钮的高度设定了为50,所以说背景图高度减去50就是按钮在背景图中的y轴的起始位置了。
好,突然发现整篇文章还没写过一行代码。。。�设定位置的代码长这样
CGRectMake(x,y,width,height)
CGRectMake函数里面带的四个参数意思分别是,x轴,y轴的数值,控件的宽度以及高度。一般来说这个函数会赋值给控件的frame属性。类似这样:
signUpButton.frame = CGRectMake(ScreenWidth/2, imageHeight - 50, ScreenWidth/2, 50);
画界面的基础就讲的差不多了,主要是阐述了一下怎么分析一个界面的元素,然后大致讲了下iOS开发的位置系统。就是这么简单啊,你看不懂肯定是你智商的问题。
基本控件
(下一章待续)