美文网首页
财联社APP的头部刷新效果的实现

财联社APP的头部刷新效果的实现

作者: RedQ | 来源:发表于2016-07-17 22:03 被阅读148次
    公司最近做财经新闻相关的应用,所以在自己的手机上下载了几款财经相关的金融的APP使用下,使用的时候发现了财联社这个APP的头部刷新有点意思,如图

    刷新状态栏的文字是一些财经方面的一些名言名句,每成功刷新一次,刷新状态栏文字就变换一次,无聊就去试着尝试实现一下这个效果。在他的刷新block内调用[self changRefreshTitle]

    [self changRefreshTitle];}] ```  
    而changRefreshTitle方法的内部实现为
    

    -(void)changRefreshTitle
    {
    NSString *path = [[NSBundle mainBundle] pathForResource:@"title" ofType:@"json"];
    NSDictionary *dictionary = [NSJSONSerialization JSONObjectWithData:[NSData dataWithContentsOfFile:path] options:NSJSONReadingMutableLeaves error:nil];
    NSArray *arr = [dictionary allKeys];
    int value = arc4random() % dictionary.count;
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
    self.refreshTitle =[dictionary objectForKey:arr[value]];
    [header setTitle:self.refreshTitle forState:MJRefreshStateIdle];
    [header setTitle:self.refreshTitle forState:MJRefreshStatePulling];
    [header setTitle:self.refreshTitle forState:MJRefreshStateRefreshing];
    });
    }```
    将财经方面的名言名句放入一个json文件中,也可以从网络上获取一个json数据,解析json数据成字典,将字典中的元素全部放入数组中,随机选取,dispatch_after让文字更换延后执行这样用户就在刷新结束时看不到更新文字这个动作。还有一个要注意的由于刷新状态文字有时候比较长,而在文字下面有一个箭头图片,可能会跟他有重合,这时候我们可以去MJRefresh的源文件中将默认的箭头图片的位置修改一下,如修改箭头的Y值,在MJRefreshNormalHeader.h中将arrowCenterY 的值增加10。

    一些看法

    财联社的APP将刷新玩出了另一种味道,财联社主打的是财经方面的内容,用户大多为财经方面的爱好者,他让用户在刷新的同时还能学到一些小东西,让用户在刷新的等待间隙不会觉得那么无聊,有可能还会让用户爱上刷新。Pull to refresh 刷新方式,引发产品交互的一个小浪潮,大大小小的app争先效仿,下拉刷新的玩法有很多种,也可以做成很精致的细节,我在人人都是产品经理上面看到一篇关于刷新的文字,里面分享了各类app的刷新效果也说了一些不错的想法,分享文章链接

    最后

    这个只是我个人实现的方法肯定还有更好更简单的方法去实现,如果哪位大神有更好的方法还望告知,大家一起交流学习,本人菜鸟一枚,如果错误还望告知,我会及时修改。

    相关文章

      网友评论

          本文标题:财联社APP的头部刷新效果的实现

          本文链接:https://www.haomeiwen.com/subject/zwqpjttx.html