百思不得姐框架(一)

一 框架效果图和原理图

1 框架的效果图:

2 根据总体的app的效果图,我们总结了采用的方案是:

—-> 采用主流的框架来搭建.

搭建效果图:

3 采用纯代码的形式来搭建框架(下面是设置窗口部分代码)

—-> 代码块一:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{

}

—-> 3.1 创建窗口

//1.创建窗口
    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];

—-> 3.2 创建窗口的根控制器

//2.设置根控制器
    //2.1 创建根控制器
    XFJTabBarController *tabBarController = [[XFJTabBarController alloc] init];
    self.window.rootViewController = tabBarController;

—-> 3.3 显示窗口

 //显示窗口
    [self.window makeKeyAndVisible];

二 UITabBarController知识的补充

1 如何查看UITabBarController中有多少个子控制器?

—-> 解答:通过查看tabBar中有多少个按钮.

2 界面显示的时候,为什么默认切换到第0个控制器?

—-> 解答:直接将第0个子控件的view添加上去.

3 点击tabBar上面的按钮,UITabBarController的切换原理?

—-> 解答:点击下面的安妮,就会把对应子控制器view添加上去,移除上一个子控件的view

三 划分项目结构和自定义加载根控制器

1 根据tabBar上面的按钮,设置对应的控制器来管理对应的控制器的业务逻辑.(每个控制器的内部按MVC思想来划分)

2 自定义控制器(通过整个APP的整体结构,我们知道系统的控制器是无法满足需求的,所以我们自定义相应的控制器)

2.1 自定义控制器的好处:方便以后修改需求,如果有需求就直接找到对应的控制器修改就行
2.2 自定义UITabBarController用来管理控制器—>XFJTabBarController

四 添加控制器(由于添加控制器的代码比较多,我们直接抽一个方法,在该方法中直接添加控制器)

#pragma mark - 添加子控制器
- (void)setUpAllChildController
{
    //设置导航控制器的子控制器
    XFJEssenceViewController *essence = [[XFJEssenceViewController alloc] init];
    //创建添加到UITabBarController的根控制器(为导航控制器)
    UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:essence];
    //添加控制器到装控制器的数组中
    [self addChildViewController:nav];
    // initWithRootViewController -> push
    // 导航控制器会把栈顶控制器的view添加到上去
    XFJNewViewController *new = [[XFJNewViewController alloc] init];
    UINavigationController *nav1 = [[UINavigationController alloc] initWithRootViewController:new];
    [self addChildViewController:nav1];

    XFJPublishViewController *publish = [[XFJPublishViewController alloc] init];
    [self addChildViewController:publish];

    XFJFriendTrendsViewController *friendThrends = [[XFJFriendTrendsViewController alloc] init];
    UINavigationController *nav3 = [[UINavigationController alloc] initWithRootViewController:friendThrends];
    [self addChildViewController:nav3];

    XFJMeViewController *me = [[XFJMeViewController alloc] init];
    UINavigationController *nav4 = [[UINavigationController alloc] initWithRootViewController:me];
    [self addChildViewController:nav4];
}

五 添加tabBar中的按钮图片和标题(这里也抽出一个放方法来,用作添加标题和图片的方法)

1 添加的代码块:

#pragma makr - 设置标题和图片
- (void)setUpWithTitle
{
    //拿到所有的子控制器
    UINavigationController *nav = self.childViewControllers[0];
    //设置对应的控制器的标题
    nav.tabBarItem.title = @"精华";
    //未被选中的图片
    nav.tabBarItem.image = [UIImage imageNamed:@"tabBar_essence_icon"];
    //添加选中的图片
    nav.tabBarItem.selectedImage = [UIImage originalWithImage:@"tabBar_essence_click_icon"];

    UINavigationController *nav1 = self.childViewControllers[1];
    nav1.tabBarItem.title = @"新帖";
    nav1.tabBarItem.image = [UIImage imageNamed:@"tabBar_new_icon"];
    nav1.tabBarItem.selectedImage = [UIImage originalWithImage:@"tabBar_new_click_icon"];

    UINavigationController *nav2 = self.childViewControllers[2];
    nav2.tabBarItem.image = [UIImage imageNamed:@"tabBar_publish_icon"];
    nav2.tabBarItem.selectedImage = [UIImage originalWithImage:@"tabBar_publish_click_icon"];

    UINavigationController *nav3 = self.childViewControllers[3];
    nav3.tabBarItem.title = @"关注";
    nav3.tabBarItem.image = [UIImage imageNamed:@"tabBar_friendTrends_icon"];
    nav3.tabBarItem.selectedImage = [UIImage originalWithImage:@"tabBar_friendTrends_click_icon"];

    UINavigationController *nav4 = self.childViewControllers[4];
    nav4.tabBarItem.title = @"我";
    nav4.tabBarItem.image = [UIImage imageNamed:@"tabBar_me_icon"];
    nav4.tabBarItem.selectedImage = [UIImage originalWithImage:@"tabBar_me_click_icon"];
}

2 添加控制器的背景颜色(交给指定的控制器,让控制器自己管理颜色)

六 出现的问题

1 图片选中的图片被渲染了

—-> 解决办法:
—-> 1>直接在对应的图片上设置
—-> 2>用代码的方法设定

1.1 通过设置对应的图片

—-> 图一:

—-> 图二:

—-> 图三:

—-> 图四:

—-> 图五:

1.2 通过代码设置(我们封装一个分类来实现)

//根据一张传入的图片,返回一张未被渲染的图片
+ (UIImage *)originalWithImage:(NSString *)imageName
{
    //传入一张图片
    UIImage *image = [UIImage imageNamed:imageName];
    //返回一张未被渲染的图片
    return [image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
}

2 标题被渲染了

—-> 解决办法:直接用代码设置
—-> 2.1 通过拿到全局的tabBarItem来设置
#pragma mark - 设置选中的控制器的底部标题的字体不被渲染
- (void)setUpTabBarItemAttr
{
    //获取全局的tabBarItem
    UITabBarItem *attr = [UITabBarItem appearance];
    //创建一个字典,用字典来描述选中的字体颜色
    NSMutableDictionary *dict = [NSMutableDictionary dictionary];
    //设置选中字体的颜色
    dict[NSForegroundColorAttributeName] = [UIColor blackColor];

    [attr setTitleTextAttributes:dict forState:UIControlStateSelected];
}

3 发布的按钮被遮住了

—-> 解决办法一:试着将发布按钮未被选中的状态图片设置为未被渲染的图片(确实可以解决)
—-> 解决后出现的问题:设置完后,点击发布按钮,发现不符合整个app的效果.这样不能解决问题.

4 解决办法二:自定义tabBar(明天介绍)

七 总结

1 以上只是百思不得姐的框架一,里面还有很多的问题没有被解决,后续我们将一 一解决,并且不断的完善百思不得姐的整个app,希望大家持续关注我的官方博客,有什么建议,麻烦大家多多留言,谢谢!!!!

时间: 2024-10-08 14:45:09

百思不得姐框架(一)的相关文章

百思不得姐框架(二)

一 该部分框架效果图和实现思路 框架二的效果图: 实现思路: -- 1> 先完善tabBar(主要是自定义) -- 2> 再完善导航条 -- 3> 其次完善屏幕侧滑(主要是全屏侧滑功能) 二 抽取分类(设置到插件中) 1 抽取分类的思想: 实现复用 --> 1.1 上部分代码中,我们需要设置tabBar中图片成未被渲染的格式,因此我们抽取了一个分类,用分类里面的方法实现了效果. --> 分类代码: //传入一张图片的名称返回一张未被渲染的图片 + (UIImage *)ori

百思不得姐第1天

一:项目环境的搭建: 项目环境的搭建包括:1:新建类的前缀   2:项目支持的旋转方向,版本   3:项目名称,软件名称 4:APP的icon,启动图片的设置 5:项目的文件夹分层 6:根控制器的设置 等 具体详情请参照新浪微博的项目环境配置 二:cocoaPods的安装与使用 1:具体参照新浪微博项目cocoaPods的安装与使用:安装并导入所需要的依赖库 三:百思不得姐主框架的搭建 1:删除storyBoard,重新定义窗口的根视图控制器 #import "AppDelegate.h&quo

分分钟教你学习一个新的框架--Photos FrameWork

相关链接:ios-深度解析二维码的生成与使用 swfit项目初体验Photo-Browser 一.点击查看大图 1.点击图片或按钮(点击查看大图按钮),modal出来一个控制器,显示大图片 2.怎么处理能让点击图片就能查看大图? 两种方法:1.给图片添加点按手势 2.给图片所在的view上添加 - (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event 2.1 添加点按手势 优点:适用于任何场景下,不受

百思不得姐数据刷新数据部分(七)

一 刷新功能图和内部计算原理图 1 刷新功能图: 2 内部计算原理图 二 解析步骤 1 分析整个精华模块 2 真实数据请求部分 3 模型 4 先添加尾部刷新控件 5 再添加头部刷新控件 6 处理刷新业务逻辑 7 知识点补充 三 分析模块 1 从一个完整的app中可以看出,在精华模块中处于全部标题的部分数据包括了其它几部分的数据,内部有视频;声音;图片和段子,所以我们只需要将"全部"做好,就能很快的搞定其它模块了. 四 真实数据请求 1 大致步骤: --> 1 查看百思不得姐该部分

百思不得姐之&quot;我的&quot;模块功能(六)

一 功能图和知识点 1 功能图部分:(由于网速的原因,网页部分没有加载出来,但是功能完好) 2 该部分能学到的知识点概括: >1 UITableView的使用(简单) >2 UICollectionView的使用 >3 请求数据 >4 模型 >5 自定义cell >6 清除缓存 >7 细节处理 二 确定搭建方式 1 思考: 由整个app运行的效果图来看,是一个tableView,并且需要分组.界面的下半部分可以通过设置footerView来加载collection

如何学习新的框架(保存图片到相册)

一.点击查看大图 1.点击图片或按钮(点击查看大图按钮),modal出来一个控制器,显示大图片 2.怎么处理能让点击图片就能查看大图? 两种方法:1.给图片添加点按手势 2.给图片所在的view上添加 - (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event 2.1 添加点按手势 优点:适用于任何场景下,不受限制 缺点:代码量大 2.2 给图片所在view添加touchesEnded:方法 优点:能快

百思不得姐之图片处理(保存与下载)

一 功能图 二 讲解思路 1 回顾上一篇内容 2 创建加载图片类(同时创建xib) 3 点击图片查看大图 4 点击查看大图(查看长图) 5 model出展示图片的控制器 6 保存图片 7 封装根据网络状态展示不同的图片 三 回顾上一篇内容 1 上一篇内容讲到对整个cell的分析,通过创建一个类(XIB)来管理cell的顶部和尾部总共九个控件.然后创建三个不同的类(xib),各自负责自己的中间部分,然后根据服务器返回的帖子类型,拼接上对应的cell,展示在用户眼前. 四 处理图片 1 处理原因:

百思不得姐之&amp;quot;我的&amp;quot;模块功能(六)

一 功能图和知识点 1 功能图部分:(因为网速的原因,网页部分没有载入出来,可是功能完善) 2 该部分能学到的知识点概括: >1 UITableView的使用(简单) >2 UICollectionView的使用 >3 请求数据 >4 模型 >5 自己定义cell >6 清除缓存 >7 细节处理 二 确定搭建方式 1 思考: 由整个app运行的效果图来看,是一个tableView,而且须要分组.界面的下半部分能够通过设置footerView来载入collectio

主流界面搭建原理(类似百思不得姐主界面)

一.界面搭建 1.项目需求 主界面能左右滚动,还能上下滚动,点击按钮跳转界面 2.分析界面 点击按钮跳转界面可以自定义UITabBarCotroller来实现 左右滚动,可以利用scrollView来实现  或 UICollectionView 上下滚动,用tableView可以实现 3.选择实现方案 方案一:   UITabBarCotroller + scrollView + tableView + titleView(TabBar条) UIScrollView弊端:没有做离屏渲染优化 使用