IOS开发---菜鸟学习之路--（四）-登录界面

本篇的内容其实你们 参照橘子的那本开发的书的话  上面讲解的是更详细的 一些实现.

我这边惟一的区别就是 作了网络数据的获取 以及 验证成功后 进行界面的跳转..

第四篇了 本篇主讲登录模块

首先先放效果图

图一

图二

图三

 

首先总体效果如图一所示

2个uilabel

2个textfield　

1个Button 按钮

实现功能的话有如下几点

1.其中输入帐号后点击 NEXT 跳到 密码框.

2.点击密码输入框 显示DONE 点击done的话 直接进行登录验证

3.点击背景 将 键盘隐藏

4.点击 登录按钮 进行登录 验证 

 

首先先新建一个项目.以下图,选择单一视图项目

而后 将对应的控件拖拽到对应的位置.并修改文字描述

排成图一的样子

控件的细节属性我就不作介绍了,选择对应的Textfield控件 分别在 Placeholder中输入"请输入帐号" 和"请输入密码" 该属性就是 在文本输入框没有输入内容时显示的数据

完成后的效果以下

还有个两个属性分别是return key 和Secure  

修改return key的话就是修改 键盘上的结束键.这个你们能够修改下看看就知道了

而后是Secure属性.该属性就是常见的密码选项.选择了后 输入的内容就会显示为****** 因此在密码的Textfield  的属性中须要选择该属性

 

.xib文件暂时就修改这么多了. 

而后是.h文件 .仍是同样的 直接上代码

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController
{
    UIButton *loginButton;
    UITextField *pwdTextField;
    UITextField *uidTextField;
}
@property(nonatomic,retain) IBOutlet UIButton *loginButton;
@property(nonatomic,retain) IBOutlet UITextField *uidTextField;
@property(nonatomic,retain) IBOutlet UITextField *pwdTextField;

-(IBAction)loginButtonPressed:(id)sender;
-(IBAction)backgroundTap:(id)sender;
-(IBAction)uidDidEndOnExit:(id)sender;
-(void)initNav:(NSString *)pid;
@end

这边我分别定义了三个属性和4个方法 

loginButton  pwdTextField  uidTextField  

这三个就分别对应着咱们 的 登录按钮 . 密码输入框和帐号输入框三个稍后会讲怎么样造成关联

 

而后是4个方法分别用来处理  登录按钮点击事件, 背景点击事件 , 帐号输入完成事件,以及登录成功后界面切换事件  initNav

 

而后回到XIB文件

按住CTRL键同时左键点击 而后移动鼠标,会出现一条蓝色的线. 将蓝色的线链接到 帐号输入框上

便会出现刚刚在.H文件中的属性.而后选择与之相对应的 属性 ,就完成了链接了(这边是QQ截图的  有点暗可能看步清楚.不过你们试下就知道了)

而后用一样的方法 分别链接 密码输入框和按钮. 就完成了链接

 

接下来咱们选择 帐号输入框 在右边属性栏选择事件 

选择Did End on Exit 点击右边的小圆圈 一样的拉动话,会出现一条蓝线,而后 拖拽到左边的 

而后选择uidDidEndOnExit事件,

用一样的方法 分别将密码输入 的Did End on Exit事件链接到 loginButtonPressed

登录按钮的Touch up inside 事件链接到loginButtonPressed

这样的话 咱们就将 对应的事件绑定到对应的控件上面了 

最后还有一个点击背景的事件这边有点复杂

首先须要选择 背景

而后找到属性中的class 将其修改成UIControl  不然的话 他是没有对应的点击事件的

而后一样的 选择 tuochdown 事件 链接到 

backgroundTap 事件上去

 

最后进入.m文件实现具体的 操做

好了直接上代码

//点击背景隐藏输入框
-(IBAction)backgroundTap:(id)sender
{
    [pwdTextField resignFirstResponder];
    [uidTextField resignFirstResponder];
    
}
-(IBAction)uidDidEndOnExit:(id)sender{
    [pwdTextField  becomeFirstResponder];
}

这个方法 分别是 移除对应的焦点,以及使某个控件成为焦点 ..就实现了 点击背景 .隐藏键盘 以及点击NEXT 跳转到 密码输入框的功能

 

而后就是咱们的重点了 

longinbutton点击事件

-(void)loginButtonPressed:(id)sender{

    GetWebInfo *getwebinfo=[GetWebInfo alloc];
    NSString *myparameters=[[NSString alloc] initWithString:[NSString stringWithFormat:@"&Method=Login&uid=%@&pwd=%@",uidTextField.text,pwdTextField.text]];
    getwebinfo.parameters=myparameters;
    NSString *webReturnMessage=[getwebinfo dogetWebInfo];
    NSData* jsonData=[webReturnMessage dataUsingEncoding:NSUTF8StringEncoding];
    NSArray *keys =   [NSJSONSerialization
                       JSONObjectWithData:jsonData
                       options:NSJSONReadingMutableContainers
                       error:nil];
    NSString *result=[keys valueForKey:@"Result"];
    if([result isEqual:@"False"])
    {
        UIAlertView *alert=[[UIAlertView alloc] initWithTitle:@"登录失败" message:@"密码错误或者网络链接失败" delegate:self
                                            cancelButtonTitle:@"肯定" otherButtonTitles: nil];
        [alert show];
    }
    else{

        [self initNav:[[keys valueForKey:@"Data"] valueForKey:@"ID"]];
    
    }

 }

首先是利用咱们前两篇建的GETWEBINFO 类来获取数据

而后判断是否登陆成功

若是登陆成功就调用initNav方法 并传递数据过去.不然就提示密码输入错误

 

最后要讲的就是 initNav 方法了 .initNav方法主要就是实现登陆后的页面跳转..之前刚学的时候在这里纠结了很久 好了直接上代码吧.

 

这边咱们首先要新建两个 UIViewController 分别命名为A和B 吧

-(void)initSmallP:(NSString *)pid
{
    AViewController *aViewController =[[AViewController alloc]initWithNibName:@"AViewController" bundle:nil];
    BViewController *bViewController = [[BViewController alloc]initWithNibName:@"BViewController" bundle:nil] ;
    UINavigationController *aNavController=[[UINavigationController alloc]initWithRootViewController:aViewController];
 　　UINavigationController *bNavController=[[UINavigationController alloc] initWithRootViewController:bViewController]; 
　　UITabBarController *tabController=[[UITabBarController alloc] init];
　　 [tabController setViewControllers:[NSMutableArray arrayWithObjects:aNavController,bNavController,nil]]; 
　　AppDelegate * app = (AppDelegate*)[[UIApplication sharedApplication] delegate] ;
　　 [app.window setRootViewController:tabController];
 }

 

而后就完成了 

代码的意思呢.就是咱们首先 实例化两个  视图,而后 建立两个导航控制器.

最后添加到 一个tabbarcontroller里面

最后将程序的 rootviewcontroller 设置成tabbarcontroller 就完成了就完成了.

由于手头没有资源.因此就把之前作好的登录后的效果图贴在下面了

不过咱们接下来也要实现如下的效果  

接下来的内容主要是围绕着UITableView 来说解的  

你们若是熟练的掌握了 UITABLEVIEW的话 基本上就能完成一个简单的基本项目了

 

PS:一样的再次声明,本文为本人随意所写(看着确定感受怪怪的乱七八糟的..很是很差意思对不起观众了.)

另外若是有错请莫怪楼主误人子弟..也请及时指出,好让本人修改..