新闻客户端制作(第一部分)

这个新闻客户端重点是掌握UIScorllView,UITableView的运用和代理模式的理解

废话不多说现在开始,我会尽量把类容写的详细,这个教程我会分几个部分来写,因此每一个部分不会涉及太多的功能

这次的功能是搭建一个基础的框架出来,然后做出一个展示新闻列表的页面,我这里使用的是xcode6,有什么问题欢迎大家交流 我的新建QQ群:313901489,

大概是这个样子的


在创建的AppDeleget.m文件中创建一个UITabBarController,代码片段如下

//1,创建一个UITabBar
UITabBarController *tabBarController = [[UITabBarControlleralloc]init];
    
//2,创建一个controller
NewsViewController *newsVC = [[NewsViewControlleralloc]init];
newsVC.title =@"新闻";
//3,这次先完成这个新闻栏目,以后会加上其他栏目
tabBarController.viewControllers =@[newsVC];
//4,设置根视图
self.window.rootViewController = tabBarController;



这里的代码片段其实很简单,主要的时来看看我们的NewsViewController中到底会发生什么

像新闻客户端中,一般一个页面上会出现不同种类的新闻,这里制作的也是一样的,例如想网易客户端,会分出财经新闻、房产新闻、娱乐新闻等

仔细分析就会发现这些不同新闻页面是可以左右滑动而且每个页面基本上都是UITableView

说了这么多废话现在来看看我们的NewsViewController.h文件中创建的各种变量

@interface NewsViewController :UIViewController<UITableViewDelegate,UITableViewDataSource,UIScrollViewDelegate>
{
    //用于记录所有数据
    NSMutableArray *datas;
    //用于记录当前页的数据
   NSMutableArray *currentData;
    //当前数据的tableView
   NewTableView *currentTableView;
   //
   UIScrollView *newsScrollView;
   //高度
   CGFloat tableViewHeight;
   //宽度
   CGFloat tableViewWidth;
    //当前展示的第几个页面,可以通过UIScrollView计算得出
   NSInteger currentPage;  
    //当前展示信息的页面
   NSNumber *currentDataPage;
}
@end



这就是这个NewsViewController创建的各种属性,实现个各种代理协议也是后面我们会需要的后面我会解释


接下来是NewsViewController.m文件

当程序进入到这里的时候我们会创建需要的UITableView,并设置各种数据


- (void)viewDidLoad {
    [superviewDidLoad];
    //1,初始化数据源
    datas = [NSMutableArrayarrayWithCapacity:10];
   for(int i =0;i<[NEWS_EN_ARRAYcount];i++)
    {
        [datasaddObject:[NSMutableArrayarrayWithCapacity:20]];
    }
    //2,
    tableViewHeight = [UIScreenmainScreen].bounds.size.height -64.0;
    tableViewWidth = [UIScreenmainScreen].bounds.size.width;
    newsScrollView = [[UIScrollViewalloc]initWithFrame:CGRectMake(0,20,tableViewWidth, tableViewHeight)];
    currentPage = 0;
    currentDataPage =0;
   for(int i =0;i <[NEWS_EN_ARRAYcount];i++)
    {
    //3,
        NewTableView *tableView = [[NewTableViewalloc]initWithFrame:CGRectMake(320*i,0,tableViewWidth,tableViewHeight)];
        tableView.tag = [NewTableViewgetViewTage] + i;
        tableView.delegate =self;
        tableView.dataSource =self;
        
       if(i ==0)
        {
    //这里是默认第一个页面
            currentTableView = tableView;
        }
        [newsScrollViewaddSubview:tableView];
    }
    //4,
    newsScrollView.contentSize =CGSizeMake(320 * [NEWS_EN_ARRAYcount],tableViewHeight);
    newsScrollView.delegate =self;
    newsScrollView.pagingEnabled =YES;
    [self.viewaddSubview:newsScrollView];
    //判断当前显示的tableView是否第一次加载
    [selfisFirstLoadData];//下面我会告诉你实现它
}




其实上面代码也不算复杂,看到我代码中标示的数字了吗?我会一个个来解释

1,初始化数据源,后面会向里面添加各种我们需要的数据

2,设置一下接下来会创建各种TableView的高度和宽度 

3,创建不同的新闻种类页面,每一个种类对应一个UITableView

4,把这么多的tableView放到UIScrollView中后,要出现类似于翻页的效果,需要设置各个参数和属性


其实UIScrollView可以做出各种各样的效果,例如相册里的相册浏览功能也是基于此种,只不过这里我们换成了UITableView而不是UIImageView


接下来我们去网上来取数据,所有的数据链接我会放到我最后的代码下载中,欢迎下载

看到我上面代码中的最后一句中的方法了吗?现在我们来实现它

-(void) isFirstLoadData
{
    
    if(currentTableView.isFirstLoad ==NO)
    {
        return;
    }
    //通过网络发生请求数据
    [self loadData];
    currentTableView.isFirstLoad =NO;
}

-(void)loadData
{
//这里的currentDataPage默认是0 ,其实这部分没有多大用处,后面的下拉刷新会用到他,这部分不实现这个功能
    NSString *url = [[NSStringalloc]initWithFormat:@"%@%@",[API_NEWSobjectForKey:[NEWS_EN_ARRAYobjectAtIndex:currentPage]],currentDataPage];
    //这个方法会在我的完整代码中出现,这里不会再详细写出,主要是放松一个URL请求
    [New getDataWithBlock:^(NSArray *d,NSError *error){
        if(!error)
        {
            [[datasobjectAtIndex:currentPage]addObjectsFromArray:d];
            currentData = [datasobjectAtIndex:currentPage];
            //当请求到数据后需要让tableView重新加载一下
            [currentTableView reloadData];
        }else{
            NSLog(@"%@",error);
        }
    } :url];
}




现在数据也取到啦,怎么展示到页面上咧,这里就需要UITableView的代理方法啦!

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return [currentDatacount];
}

-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
   staticNSString *cellIdentifier =@"newsCell";
   FKNewsCell *cell = (FKNewsCell *)[tableViewdequeueReusableCellWithIdentifier:cellIdentifier];
   if (cell ==nil) {
        cell = [[FKNewsCellalloc]initWithStyle:UITableViewCellStyleDefault
                                reuseIdentifier:cellIdentifier];
    }
    //这里自定义的cell依然只会出现在完整代码中
    cell.news = [currentDataobjectAtIndex:(NSUInteger)indexPath.row];
    
   return cell;
    
}
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
   return 80;
}



这几个方法非常重要,涉及到UITableView中每个cell的数据展示,而且也这里的cell是自定义的,不然不能满足需求的。

但是数据展示出来后还有一个问题,由于不同的新闻种类展示的页面不一样,而且是可以左右滑动的,滑动后会再次向网上请求数据,再向UITableView中加载数据

现在我们来实现UIScrollView的代理方法


#pragma mark UIScrollView delegate
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
   //这里是说当你左右滑动一下,如果滑动的范围小,页面还是停留在当前页面的话,我们就不要再请求数据啦
   if([scrollViewisKindOfClass:[NewTableViewclass]])
    {
       return;
    }
}


- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
    //这里是说当你左右滑动一下,如果滑动的范围小,页面还是停留在当前页面的话,我们就不要再请求数据啦
   if([scrollViewisKindOfClass:[NewTableViewclass]])
    {
       return;
    }
    //如果滑动一页,需要计算当前页是第几页
   currentPage = (NSInteger)scrollView.contentOffset.x/320;
    [selfsetCurrentElement];
    //如果是滑动到已经滑动的页面了,就不需要加载数据了,这也是为什么我们要在NewTableView中设置一个BOOL属性了
    [selfisFirstLoadData];
    
}

-(void)setCurrentElement
{
   //当前页要展示的数据
    currentData = [datasobjectAtIndex:currentPage];
   //当前要展示的currentTableView,这里可以根据当前页创建的
   currentTableView = (NewTableView*)[self.viewviewWithTag:[NewTableViewgetViewTage] +currentPage];
}



基于以上我们的核心代码就基本上完成了。后面会加上导航栏,给每一个页面确定一个新闻栏目,然后跟上面创建的各种UITableView关联起来。

最后的效果图是这样的,我们会一步步完善这个项目的功能。欢迎交流,我的新建QQ群:313901489


http://download.csdn.net/detail/leighton11/8134083  源代码下载

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值