iOS实现网易新闻首页

主要就是这个页面,实现的主要功能有:1.点击上面的标题栏,下方的红色滚动条跟着到所点击的标题的下方;2中间的图片进行循环自动播放;3,点击下面的各项标签将所点击的标签添加到上面的标题栏,4当点击下面的标签在上面已经存在的时候将其从上面的标题栏移除

//viewDidLoad里面调用各种方法
- (void)viewDidLoad
{
    // Do any additional setup after loading the view.
    self.titleArray = [NSMutableArray arrayWithObjects:@"头条",@"世界杯",@"推荐",@"娱乐",@"体育",@"财经", nil];
    [self setupTopView];//设置最上面的红色视图
    [self setupScrollView];//设置红色视图下面的标题栏
    [self setupImageScrollView];//设置中间图片的布局
    [self setupPageControl];//设置图片右下角的pageControl
    [self setupLabel];//设置中间的"添加标签"
    [self setupAllButton];//设置最下面的所有标签
    [NSTimer scheduledTimerWithTimeInterval:0.5 target:self selector:@selector(cyclePlay) userInfo:nil repeats:YES];//使用定时器实现图片的循环播放

}
- (void)setupTopView
{
    UIView *redView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 60)];
    redView.backgroundColor = [UIColor redColor];
    [self.view addSubview:redView];
    [redView release];

    UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(120, 20, 80, 20)];
    label.text = @"网易新闻";
    [redView addSubview:label];
    [label release];

    UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
    button.frame = CGRectMake(280, 30, 30, 20);
    [button setTitle:@"+" forState:UIControlStateNormal];
    button.titleLabel.font = [UIFont systemFontOfSize:40];
    [redView addSubview:button];
}
//设置上面标题栏的scrollView
- (void)setupScrollView
{
    self.scrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 60, 320, 30)];
    _scrollView.contentSize = CGSizeMake(640 , 30);
    [self.view addSubview:_scrollView];
        _scrollView.showsVerticalScrollIndicator = NO;
    for (int i = 0; i < [_titleArray count]; i++) {
        UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
        button.frame = CGRectMake(50 * i, 0, 50, 30);
        [button setTitle:_titleArray[i] forState:UIControlStateNormal];
        [button setTintColor:[UIColor blackColor]];
        [button addTarget:self action:@selector(titleClick:) forControlEvents:UIControlEventTouchUpInside];
        button.tag = 110 + i;
        button.titleLabel.font = [UIFont systemFontOfSize:15];
        [_scrollView addSubview:button];
    }
    _scrollView.bounces = NO;
    _scrollView.tag = 300;
    self.titleView = [[UIView alloc]initWithFrame:CGRectMake(10, 27, 50, 3)];
    _titleView.backgroundColor = [UIColor redColor];
    [_scrollView addSubview:_titleView];
    [_titleView release];
}
//设置标题栏键的点击事件,保证下边的进度条和上面的文字同步
- (void)titleClick:(UIButton *)button
{
    _titleView.frame = CGRectMake(button.frame.origin.x, 27, 50, 3);
}
</pre><pre name="code" class="objc">//设置中间图片的scrollView
//虽然播放的是3张图片但是为了进行循环播放,要设置5个空间大小,是怎么实现循环的具体请看http://blog.csdn.net/canyeyj/article/details/38963435
- (void)setupImageScrollView
{
    self.imageScrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 90, 320, 240)];
    _imageScrollView.contentSize = CGSizeMake(320 * 5, 240);
    _imageScrollView.contentOffset = CGPointMake(320, 0);
    for (int i = 0; i < 5; i++) {
        _imageView = [[UIImageView alloc]initWithFrame:CGRectMake(320 * i, 0, 320, 240)];
        if (0 == i) {
            _imageView.image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:@"v6_guide_3"] ofType:@"png"]];
        } else if (i >= 1 && i <= 3) {
            _imageView.image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:@"v6_guide_%d", i] ofType:@"png"]];
        } else if (4 == i) {
            _imageView.image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:@"v6_guide_1"] ofType:@"png"]];
        }
        //        _imageView.tag = 300 + i;
        [_imageScrollView addSubview:_imageView];
        [_imageView release];
    }
    _imageScrollView.tag = 150;
    _imageScrollView.showsHorizontalScrollIndicator = NO;
    _imageScrollView.showsVerticalScrollIndicator = NO;
    _imageScrollView.delegate = self;
    [self.view addSubview:_imageScrollView];
    _imageScrollView.pagingEnabled = YES;
    [_imageScrollView release];
}
//设置pageControl
- (void)setupPageControl
{
    self.pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(250, 290, 30, 20)];
    _pageControl.numberOfPages = 3;
    _pageControl.currentPageIndicatorTintColor = [UIColor orangeColor];
    _pageControl.pageIndicatorTintColor = [UIColor blackColor];
    _pageControl.tag = 160;
    [_pageControl addTarget:self action:@selector(handlePageControl:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:_pageControl];
    [_pageControl release];
}
//设置pageControl的点击事件
- (void)handlePageControl:(UIPageControl *)pageControl
{
    UIScrollView *scrollView = (UIScrollView *)[self.view viewWithTag:150];
   [scrollView setContentOffset:CGPointMake (320 * (pageControl.currentPage + 1), 0) animated:YES];
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
    UIPageControl *pageControl = (UIPageControl *) [self.view viewWithTag:160];
    pageControl.currentPage = (scrollView.contentOffset.x  - 320 )/ 320;
    int i = (scrollView.contentOffset.x  - 320 ) / 320 + 1;
    if (0 == i) {
        scrollView.contentOffset = CGPointMake(320 * 3, 0);
        pageControl.currentPage = 2;

    } else if (4 == i){
        scrollView.contentOffset = CGPointMake(320, 0);
        pageControl.currentPage = 0;
    }
}
//设置添加标签拦
- (void)setupLabel
{
    _labelView = [[UIView alloc]initWithFrame:CGRectMake(0, 330, 320, 80)];
    _labelView.backgroundColor = [UIColor colorWithRed: 255 / 225.0  green:182 / 225.0 blue: 193 / 225.0 alpha:1.0];
    [self.view addSubview:_labelView];
    [_labelView release];
    UILabel *label2 = [[UILabel alloc]initWithFrame:CGRectMake(10, 10, 60, 40)];
    label2.text = @"添加标签";
    label2.font = [UIFont systemFontOfSize:15];
    [_labelView addSubview:label2];
    [label2 release];

}
</pre>//下面的各标签的button是自定义的一个继承于UIButton的类,设置属性flag<pre name="code" class="objc">//设置下面的选项按钮
- (void)setupAllButton
{
    NSArray *labelArray = @[@"科技",@"轻松一刻",@"数码",@"时尚",@"游戏",@"原创",@"汽车",@"CBA",@"精选",@"房产",@"手机",@"家居"];
     int n = 0;
    for (int i = 0 ; i < 4; i++) {
        for (int j = 0; j < 3; j++) {
            _button = [YJButton buttonWithType:UIButtonTypeSystem];
            _button.frame = CGRectMake(10 + i * 75, 430 + j * 40, 65, 30);
            _button.backgroundColor = [UIColor lightGrayColor];
            [_button setTintColor:[UIColor blackColor]];
            _button.tag = 116 + n;
            _button.flag = YES;
            [_button setTitle:labelArray[n++] forState:UIControlStateNormal];
            [self.view addSubview:_button];
            [_button addTarget:self action:@selector(click:) forControlEvents:UIControlEventTouchUpInside];
        }
    }
}
//设置下面各标签的点击事件
- (void)click:(YJButton *)button
{
    UIScrollView *scrollView = (UIScrollView *)[self.view viewWithTag:300];
    [scrollView removeFromSuperview];
   if (button.flag) {
        [self.titleArray addObject:button.currentTitle];
        [self setupScrollView];
        button.flag = NO;
    } else {
        [self.titleArray removeObject:button.currentTitle];
        [self setupScrollView];
        button.flag = YES;
    }
}
//定时器的播放事件
- (void)cyclePlay
{
    NSInteger pageNum =  _pageControl.currentPage;
    pageNum++;
    if (pageNum > 2) {
        pageNum = 0;
    }
    _pageControl.currentPage = pageNum;
    [self handlePageControl:_pageControl];
}

//内存处理
- (void)dealloc
{
    [_titleArray release];
    [_scrollView release];
    [_titleArray release];
    [_imageScrollView release];
    [_pageControl release];
    [super dealloc];
}

时间: 2024-07-31 17:54:32

iOS实现网易新闻首页的相关文章

IOS 类似于网易新闻首页新闻轮播的组件

一.需求分析 1.可横向循环滚动新闻图片 2.滚动到对应图片时显示新闻标题 3.每张新闻图片可点击 4.有pageControl提示 5.具有控件的扩展能力 二.设计实现 1.显示图片使用SDWebImage第三方库,可缓存图片.通过url异步加载图片 2.使用一个横向滚动的UITableView实现循环滚动 3.使用一个黑色半透明的背景.白色文字的UILabel显示标题 4.定义每个新闻的数据结构: /** @brief 默认使用本地地址,如果本地没有的话,使用网络图片 */ @interfa

iOS 网易新闻首页进化版Demo(MXSegmentedPager),自带平行头部拉伸

网易新闻首页类似的界面简直太常见了,需求不同自然做出来的效果不同了,之前 用ScrollView写过一个控制器的封装,但是这里根本没有考虑到控制器的复用以及预加 载机制,如果没考虑复用的话当界面爆炸的时候估计你的App会很卡,例如半塘这样 的,我抓包发现貌似会预加载当前界面后三个界面,让用户滑动的时候能第一时间看到 数据,这样的机制蛮不错的,今天来介绍个能复用的框架,顺带介绍个另一个高斯模糊 的Catagory. 上图 这里的三个界面分别是最普通的控制器,webview以及双TableView

网易新闻首页iOS

// //  ViewController.m //  wyy // //  Copyright © 2016年 zm. All rights reserved. // #import "ViewController.h" #import "ZMViewController.h" #import "ZMLabel.h" @interface ViewController ()<UIScrollViewDelegate> @proper

网易新闻首页骨架(父子控制器实现)

一:父子控制器的应用:效果如图: 二:代码 1 #import "RHMainViewController.h" 2 #import "RHNewsTableViewController.h" 3 #import "RHLable.h" 4 static const CGFloat lableCount = 8; 5 static const CGFloat lableWidth = 80; 6 static const CGFloat labl

android 仿网易新闻首页框架

   首页布局: 1 SliddingMenu  +  ViewPagerIndicator 2 JSON 解析   FastJson 3 网络请求  Volley 4 sqlite 数据库简单封装,主要处理数据库版本升级问题 5 微信.微博 API 简单封装 6 代码混淆 ...... github: https://github.com/lesliebeijing/MyAndroidFramework.git

新版网易新闻客户端应用iOS源码

这是一个不错的iOS项目源码. 源码下载: http://code.662p.com/view/11510.html 演示图:   1.这次更新的亮点是添加了天气效果以后也可以用网易新闻看天气预报了,各种轻微的动画效果也没有放过. 2.新版的网易新闻,整改了首页UI,在底部加上了tabbar,因此多了很多页面这里也都编了,但是无法交互.毕竟东西太多了,我觉得能点击看到效果就算不能进一步深入,就一个壳子也比全空没有强是吧.. 3.主页-主页的下方加了tabbar,nav的两个按钮做了改变 4.详情

ActionBar+DrawerLayout实现网易新闻客户端首页

一.概述 随着android版本的不断的更新,google推出了越来越多的高级组件,采用这些官方组件我们可以方便的实现一些以前需要通过复杂编码或者使用第三方组件才能实现的效果,比如slidingmenu.sherlockactionbar等.在这里,我们通过使用android的官方组件ActionBar和DrawerLayout来实现网易新闻客户端首页的效果. 由于ActionBar和DrawerLayout都是后来推出的,如果需要兼容低版本必须在项目中添加v7支持库.具体如何添加支持库在此不做

ios 开发日记 13-剖析网易新闻标签栏视图切换(addChildViewController属性介绍)

iOS开发 剖析网易新闻标签栏视图切换(addChildViewController属性介绍) 时间 2014-06-25 21:45:21  CSDN博客 原文  http://blog.csdn.net/hmt20130412/article/details/34523235 主题 网易iOS开发 本来只是打算介绍一下addChildViewController这个方法的,正好今天朋友去换工作面试问到网易新闻标签栏效果的实现,就结合它,用个小Demo实例介绍一下:(具体解释都写在了Demo里

IOS之分析网易新闻存储数据(CoreData的使用,增删改查)

用过网易新闻客户端的朋友们都知道,获取新闻列表时有的时候他会请求网络有时候不会,查看某条新闻的时候再返回会标注已经查看的效果,接下来分析一下是如何实现的. 首先: 1.网易新闻用CoreData存储了新闻列表,因为我打开网易新闻的Documents时看到了三个文件: newsapp.sqlite,newsapp.sqlite-shm,newsapp.sqlite-wal:这三个文件是你在用CoreData时自动生成的.所以我确定他是用coredata存储的数据而不是sqlite数据库.(Core