你的位置:首页 > 操作系统

[操作系统]主程序底部TabBar功能跟登录页面布局


1:主程序底部TabBar的功能实现

效果图:

 

主要代码如下:

- (UITabBarController*)setRootVC:(BOOL)bShowCart{  //创建一个子控制器 用于显示当前的tab  TabHomeVC *homeVC = [[TabHomeVC alloc] init];  //每个tab都是一个nav的内容,这样每个都是自个的nav,进行跳转  UINavigationController *homeNav = [[UINavigationController alloc] initWithRootViewController:homeVC];  UIImage *unselectedImage = [UIImage imageNamed:@"tab-home"];  UIImage *selectedImage = [UIImage imageNamed:@"tab-home-s"];    homeVC.tabBarItem = [[UITabBarItem alloc] initWithTitle:@"首页"                           image:[unselectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]                       selectedImage:[selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];  homeVC.tabBarItem.tag = 0;    TabProductVC *proVC = [[TabProductVC alloc] init];  UINavigationController *proNav = [[UINavigationController alloc] initWithRootViewController:proVC];  unselectedImage = [UIImage imageNamed:@"tab-pro"];  selectedImage = [UIImage imageNamed:@"tab-pro-s"];    proNav.tabBarItem = [[UITabBarItem alloc] initWithTitle:@"所有商品"                           image:[unselectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]                       selectedImage:[selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];  proNav.tabBarItem.tag = 1;    TabNewestVC * newVc = [[TabNewestVC alloc] init];  UINavigationController * newNav = [[UINavigationController alloc] initWithRootViewController:newVc];  unselectedImage = [UIImage imageNamed:@"tab-new"];  selectedImage = [UIImage imageNamed:@"tab-new-s"];    newNav.tabBarItem = [[UITabBarItem alloc] initWithTitle:@"最新揭晓"                            image:[unselectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]                        selectedImage:[selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];  newNav.tabBarItem.tag = 2;    TabShopCartVC * cartVc = [[TabShopCartVC alloc] init];  UINavigationController * cartNav = [[UINavigationController alloc] initWithRootViewController:cartVc];  unselectedImage = [UIImage imageNamed:@"tab-cart"];  selectedImage = [UIImage imageNamed:@"tab-cart-s"];    cartNav.tabBarItem = [[UITabBarItem alloc] initWithTitle:@"购物车"                           image:[unselectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]                       selectedImage:[selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];  cartNav.tabBarItem.tag = 3;    TabMineVC * mineVc = [[TabMineVC alloc] init];  UINavigationController * mineNav = [[UINavigationController alloc] initWithRootViewController:mineVc];  unselectedImage = [UIImage imageNamed:@"tab-mine"];  selectedImage = [UIImage imageNamed:@"tab-mine-s"];    mineNav.tabBarItem = [[UITabBarItem alloc] initWithTitle:@"我的云购"                            image:[unselectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]                        selectedImage:[selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];  mineNav.tabBarItem.tag = 4;      //把上面的控制器增加到uitabbarcontroller的数组里  UITabBarController *tabBarController = [[UITabBarController alloc] init];  if(bShowCart)    tabBarController.viewControllers = @[homeNav,proNav,newNav,cartNav,mineNav];  else    tabBarController.viewControllers = @[homeNav,proNav,newNav,mineNav];  tabBarController.delegate = self;      //设置一些样式内容  // customise TabBar UI Effect  [UITabBar appearance].tintColor = BG_COLOR;    [[UITabBarItem appearance] setTitleTextAttributes:@{NSForegroundColorAttributeName:TABBAR_TEXT_NOR_COLOR} forState:UIControlStateNormal];  [[UITabBarItem appearance] setTitleTextAttributes:@{NSForegroundColorAttributeName:TABBAR_TEXT_HLT_COLOR} forState:UIControlStateSelected];    // customise NavigationBar UI Effect  [[UINavigationBar appearance] setBackgroundImage:[UIImage imageWithRenderColor:NAVBAR_COLOR renderSize:CGSizeMake(10., 10.)] forBarMetrics:UIBarMetricsDefault];  [[UINavigationBar appearance] setTitleTextAttributes:@{NSFontAttributeName:[UIFont boldSystemFontOfSize:16.],NSForegroundColorAttributeName:[UIColor blackColor]}];      UITabBar *tabBar = tabBarController.tabBar;  tabBar.backgroundColor = BG_COLOR;    return tabBarController;}- (void)setCartNum{  //获得UITabBarController  UITabBarController* tabVC = (UITabBarController*)self.window.rootViewController;  //获得其中第四个 也就是购物车那个tabbar  UINavigationController* navVC = [tabVC.viewControllers objectAtIndex:3];  __weak typeof (navVC) wNav = navVC;  //给它增加一个数字标识  [CartModel quertCart:nil value:nil block:^(NSArray* result){    if(result.count > 0)      wNav.tabBarItem.badgeValue = [NSString stringWithFormat:@"%d",(int)result.count];    else      wNav.tabBarItem.badgeValue = nil;  }];}- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {  [self setWindow:[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]];  //加载初始化的那个tab  UIViewController *rootViewController = [self setRootVC:YES];  [[self window] setRootViewController:rootViewController];  //显示是否有数字标识  [self setCartNum];  // set backgroundColor  [[self window] setBackgroundColor:[UIColor whiteColor]];  // set makeKeyAndVisible  [[self window] makeKeyAndVisible];  return YES;}

注意:这边为每个tabBarController的子控件都增加一个nav,这样就可以在每个选项卡里都实现nav的跳转,把这个tabBarController作为整个的rootViewController;其中在其它控制器调用AppDelegate的方法setCarNum,可以[(AppDelegate*)[[UIApplication sharedApplication] delegate] setCartNum];

 

2:登录页面两输入框效果的实现

效果图:

 

主要代码:

- (void)viewDidLoad {  [super viewDidLoad];    self.title = @"登录";  self.view.backgroundColor = [UIColor hexFloatColor:@"f8f8f8"];  __weak typeof (self) wSelf = self;  [self actionCustomLeftBtnWithNrlImage:@"btnback" htlImage:@"btnback" title:@"" action:^{    [wSelf btnBackAction];  }];    UIImageView* line1 = [[UIImageView alloc] initWithFrame:CGRectMake(16, 20, mainWidth - 32, 0.5)];  line1.backgroundColor = [UIColor hexFloatColor:@"dedede"];  [self.view addSubview:line1];    UIImageView* line3 = [[UIImageView alloc] initWithFrame:CGRectMake(16, 108, mainWidth - 32, 0.5)];  line3.backgroundColor = [UIColor hexFloatColor:@"dedede"];  [self.view addSubview:line3];    UIImageView* line4 = [[UIImageView alloc] initWithFrame:CGRectMake(16, 20, 0.5, 88)];  line4.backgroundColor = [UIColor hexFloatColor:@"dedede"];  [self.view addSubview:line4];    UIImageView* line5 = [[UIImageView alloc] initWithFrame:CGRectMake(mainWidth - 16, 20, 0.5, 88)];  line5.backgroundColor = [UIColor hexFloatColor:@"dedede"];  [self.view addSubview:line5];    UIView* vUser = [[UIView alloc] initWithFrame:CGRectMake(16.5, 20.5, mainWidth - 33, 87)];  vUser.backgroundColor = [UIColor whiteColor];  [self.view addSubview:vUser];    UIImageView* line2 = [[UIImageView alloc] initWithFrame:CGRectMake(16, 64, mainWidth - 32, 0.5)];  line2.backgroundColor = [UIColor hexFloatColor:@"dedede"];  [self.view addSubview:line2];  UIImageView* imgUser = [[UIImageView alloc] initWithFrame:CGRectMake(10, 12, 20, 20)];  imgUser.image = [UIImage imageNamed:@"login_name"];  [vUser addSubview:imgUser];    txtUser = [[UITextField alloc] initWithFrame:CGRectMake(35, 0, vUser.frame.size.width - 35, 44)];  txtUser.placeholder = @"请输入您的手机号/邮箱号";  txtUser.clearButtonMode = UITextFieldViewModeWhileEditing;  txtUser.font = [UIFont systemFontOfSize:14];  txtUser.text = [[NSUserDefaults standardUserDefaults] objectForKey:kLoginUsername];  [vUser addSubview:txtUser];    UIImageView* imgPwd = [[UIImageView alloc] initWithFrame:CGRectMake(10, 56, 20, 20)];  imgPwd.image = [UIImage imageNamed:@"login_password"];  [vUser addSubview:imgPwd];    txtPwd = [[UITextField alloc] initWithFrame:CGRectMake(35, 44, vUser.frame.size.width - 35, 44)];  txtPwd.placeholder = @"请输入您的密码";  txtPwd.clearButtonMode = UITextFieldViewModeWhileEditing;  txtPwd.font = [UIFont systemFontOfSize:14];  txtPwd.secureTextEntry = YES;  [vUser addSubview:txtPwd];    UIButton* btnLogin = [[UIButton alloc] initWithFrame:CGRectMake(16, 120, mainWidth - 32, 44)];  btnLogin.layer.cornerRadius = 5;  btnLogin.backgroundColor = mainColor;  [btnLogin setTitle:@"登录" forState:UIControlStateNormal];  [btnLogin addTarget:self action:@selector(btnLoginAction) forControlEvents:UIControlEventTouchUpInside];  [self.view addSubview:btnLogin];    UIButton* btnReg = [[UIButton alloc] initWithFrame:CGRectMake(mainWidth - 120, 170, 100, 44)];  [btnReg setTitle:@"新用户注册" forState:UIControlStateNormal];  btnReg.titleLabel.font = [UIFont systemFontOfSize:13];  [btnReg setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];  [btnReg addTarget:self action:@selector(btnRegAction) forControlEvents:UIControlEventTouchUpInside];  [self.view addSubview:btnReg];}

注意:它是通过几条背景线跟图片和输入框进行一个组合