上篇文章中讲到了如何实现一个ViewController上面显示背景图,这次我们继续往下开发。
我们把这个ViewController当作一个splash界面,ios本身其实是自带有这个功能的,个人喜好,我自己写一个自定义的
splash,显示一下qq图片3秒再跳转到下一个ViewController。
要实现等待3秒,可以用到线程,切不可在主线程中直接sleep,不管是android还是ios或是mfc中,在主线程sleep界面就
卡死了。在ViewController中添加线程代码,效果如下。
由于我们现在还没有创建LoginViewController,现在是会报错的。先点工程右键选择cocoa(不懂的看ios语法简介一文),
New File->objective C class->next,然后输入文件名,subclass默认是UIViewController,这是视图,要显示在window上面。
成功之后我们就在ViewController.h里面添加以下代码,要导入LoginViewController头文件及申明
接下来在LoginViewController中实现登录界面上的内容,包括背景、登录头像图片、输入框、按钮及点击事件……
万事开头难,一步一个脚印慢慢实现呗!
首先添加背景图片,和第一篇实现是一样的。代码如下:
然后添加登录头像,在居中显示,我们可以计算坐标。或者有别的方法居中,不过在下菜鸟目前还不知道,嘿嘿……
坐标的计算大家相信都没总是,就是算数字嘛,小学里面都有的。取屏幕宽度也很简单,一句代码的事……
下面添加输入框,这个就有点小厉害了。不管是什么平台,都会有这个方法的实现,图片自动填充。做过Android开发的
朋友知道,用.9的格式图片,然后自动去填充指定的区域进行内容填充,这样就能达到一个非常完美的效果,一张很小的
图片,可以在任意大小的控制正常显示,不会发生变形,这个可以看看iOS图片拉伸技巧这篇文章。
再继续实现输入框背景和输入框,下面代码都有注释特别重要的部分
实现按钮,点击登录的按钮
写到这里,基本上差不多完成了,但是会有一个警告的提示, pwdText.delegate = self;提示类型不正确,为啥呢?因为
这个controller还没有实现系统的委托,只要加一句代码即可,在.h文件中添加,效果如下:
就是它了,,加上直接编译运行,是不是很棒!最后看下效果图
我们把这个ViewController当作一个splash界面,ios本身其实是自带有这个功能的,个人喜好,我自己写一个自定义的
splash,显示一下qq图片3秒再跳转到下一个ViewController。
要实现等待3秒,可以用到线程,切不可在主线程中直接sleep,不管是android还是ios或是mfc中,在主线程sleep界面就
卡死了。在ViewController中添加线程代码,效果如下。
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
UIImageView *imgBg = [[UIImageView alloc]initWithFrame:self.view.frame];
imgBg.image = [UIImage imageNamed:@"splash.jpg"];
[self.view addSubview:imgBg];
NSThread *myThread = [[NSThread alloc]initWithTarget:self selector:@selector(threadFunc) object:nil];
[myThread start];
}
-(void)threadFunc
{
sleep(1);//休眠3秒进入登录界面
self.loginView = [[LoginViewController alloc]init];
[self presentViewController:self.loginView animated:NO completion:nil];
}
由于我们现在还没有创建LoginViewController,现在是会报错的。先点工程右键选择cocoa(不懂的看ios语法简介一文),
New File->objective C class->next,然后输入文件名,subclass默认是UIViewController,这是视图,要显示在window上面。
成功之后我们就在ViewController.h里面添加以下代码,要导入LoginViewController头文件及申明
// // ViewController.h // XQQ // // Created by leehom on 14-11-12. // Copyright (c) 2014年 ___FULLUSERNAME___. All rights reserved. // #import#import "LoginViewController.h" @interface ViewController : UIViewController @property (strong,nonatomic) LoginViewController *loginView; @end // 负责跳转的代码[self presentViewController:self.loginView animated:NO completion:nil];
接下来在LoginViewController中实现登录界面上的内容,包括背景、登录头像图片、输入框、按钮及点击事件……
万事开头难,一步一个脚印慢慢实现呗!
首先添加背景图片,和第一篇实现是一样的。代码如下:
UIImageView *imgBg = [[UIImageView alloc]initWithFrame:self.view.frame];
imgBg.image = [UIImage imageNamed:@"login_bg.jpg"];
[self.view addSubview:imgBg];
CGRect wRect = self.view.frame;
然后添加登录头像,在居中显示,我们可以计算坐标。或者有别的方法居中,不过在下菜鸟目前还不知道,嘿嘿……
坐标的计算大家相信都没总是,就是算数字嘛,小学里面都有的。取屏幕宽度也很简单,一句代码的事……
CGRect wRect = self.view.frame;
NSLog(@"%0f,%0f",wRect.size.width,wRect.size.height);
//qq头像图标
int x = (int)(wRect.size.width-108)>>1;
UIImageView *avatar = [[UIImageView alloc]initWithFrame:CGRectMake(x, 60, 108, 108)];
[avatar setImage:[UIImage imageNamed:@"login_default_avatar.png"]];
[self.view addSubview:avatar];
下面添加输入框,这个就有点小厉害了。不管是什么平台,都会有这个方法的实现,图片自动填充。做过Android开发的
朋友知道,用.9的格式图片,然后自动去填充指定的区域进行内容填充,这样就能达到一个非常完美的效果,一张很小的
图片,可以在任意大小的控制正常显示,不会发生变形,这个可以看看iOS图片拉伸技巧这篇文章。
再继续实现输入框背景和输入框,下面代码都有注释特别重要的部分
//qq用户名输入框
int tw = (int)(wRect.size.width-76);
UIImageView *loginBgView = [[UIImageView alloc]initWithFrame:CGRectMake(35, 190, tw, 87)];
{
UIImage *imgInput = [UIImage imageNamed:@"login_input.png"];
CGFloat top = 25; // 顶端盖高度
CGFloat bottom = 25 ; // 底端盖高度
CGFloat left = 10; // 左端盖宽度
CGFloat right = 10; // 右端盖宽度
UIEdgeInsets insets = UIEdgeInsetsMake(top, left, bottom, right);
// 指定为拉伸模式,伸缩后重新赋值
imgInput = [imgInput resizableImageWithCapInsets:insets resizingMode:UIImageResizingModeStretch];
[loginBgView setImage:imgInput];
}
[self.view addSubview:loginBgView];
UITextField *nameText = [[UITextField alloc]initWithFrame:CGRectMake(42, 192, tw, 40)];
nameText.placeholder = @"号码";//提示用户文字,相当于android里面的hint
[self.view addSubview:nameText];
UIView *line = [[UIView alloc]initWithFrame:CGRectMake(38, 232, tw-6, 1)];
[line setBackgroundColor:[UIColor colorWithRed:0xCC/255.0 green:0xCC/255.0 blue:0xCC/255.0 alpha:1]];
[self.view addSubview:line];
UITextField *pwdText = [[UITextField alloc]initWithFrame:CGRectMake(42, 235, tw, 40)];
pwdText.secureTextEntry = YES;//安全文本选项,yes不显示内容,只显示一个黑色的圆点
pwdText.placeholder = @"密码";
[self.view addSubview:pwdText];
//委托,会自动调用系统实现的(BOOL)textFieldShouldReturn:(UITextField *)textField函数
//可以理解为注册监听,事件通知,和android的addListener类似。
实现按钮,点击登录的按钮
x = (int)(wRect.size.width-162)>>1;
UIButton *login = [[UIButton alloc]initWithFrame:CGRectMake(x, 300, 162, 60)];
login.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;//文本内容居中显示
//下面是添加点击事件,事件响应函数为loginEvent,无任何参数,响应的条件是UIControlEventTouchUpInside,就是弹起还在这个按钮所在的区域范围之内有效
[login addTarget:self action:@selector(loginEvent) forControlEvents:UIControlEventTouchUpInside];
{
UIImage *imgNor = [UIImage imageNamed:@"login_button_nor.png"];
UIImage *imgPre = [UIImage imageNamed:@"login_button_press.png"];
CGFloat top = 25; // 顶端盖高度
CGFloat bottom = 25 ; // 底端盖高度
CGFloat left = 10; // 左端盖宽度
CGFloat right = 10; // 右端盖宽度
UIEdgeInsets insets = UIEdgeInsetsMake(top, left, bottom, right);
// 指定为拉伸模式,伸缩后重新赋值
imgNor = [imgNor resizableImageWithCapInsets:insets resizingMode:UIImageResizingModeStretch];
imgPre = [imgPre resizableImageWithCapInsets:insets resizingMode:UIImageResizingModeStretch];
[login setBackgroundImage:imgNor forState:UIControlStateNormal];//设置普通状态图片样式
[login setBackgroundImage:imgPre forState:UIControlStateHighlighted];//设置点击后图片样式
[login setTitle:@"登录" forState:UIControlStateNormal];
[login setTitle:@"登录" forState:UIControlStateHighlighted];
[login setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
}
[self.view addSubview:login];
- (BOOL)textFieldShouldReturn:(UITextField *)textField
{
NSLog(@"%s",textField.text.UTF8String);
[textField resignFirstResponder];
return YES;
}
-(void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex
{
//NSLog(@"%d",buttonIndex);
if(buttonIndex == 0)
{
NSLog(@"\n点击取消");
//关闭当前view视图
}
else if(buttonIndex == 1)
{
NSLog(@"\n点击确定");
[self dismissViewControllerAnimated:NO completion:nil];
}
}
-(void)loginEvent
{
UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@"" message:@"登录中" delegate:self cancelButtonTitle:@"取消" otherButtonTitles:@"确定", nil];
[alert show];
}
写到这里,基本上差不多完成了,但是会有一个警告的提示, pwdText.delegate = self;提示类型不正确,为啥呢?因为
这个controller还没有实现系统的委托,只要加一句代码即可,在.h文件中添加,效果如下:
// // LoginViewController.h // XQQ // // Created by leehom on 14-11-12. // Copyright (c) 2014年 leehom. All rights reserved. // #import@interface LoginViewController : UIViewController @end
就是它了,,加上直接编译运行,是不是很棒!最后看下效果图

收藏的用户(0) X
正在加载信息~
推荐阅读
最新回复 (0)
站点信息
- 文章2313
- 用户1336
- 访客11756491
每日一句
Life is short; Live it!
人生苦短,活出精彩。
人生苦短,活出精彩。
信鸽推送报错NSObject checkTargetOtherLinkFlagForObjc
简单利用Clover四叶草安装U盘安装黑苹果
学习使用Java注解
OllyDbg中如何找出B模块中所有调用了A模块的C方法的地方
解决SSH客户端中文乱码
10年后,Android应用程序仍然比iOS应用程序差
C++11特性里面的thread
XPosed微信自动生成二维码
解决android studio "found an invalid color"的问题
T9社区注册方法【勼适様鲃女尔懟死】
Thinkpad x1 Extreme黑苹果10.14.5安装完成
基于大白主题增加图片本地化的功能
Linux系统查看CPU使用率的几个命令
新会员