LGFlapJackStackView 1.0.3

LGFlapJackStackView 1.0.3

×

测试已测试✗
Lang语言 Obj-CObjective C
许可证 MIT
发布最后发布2015 年 6 月

由 Luke Geiger 维护。

LGFlapJackStackView 1.0.3

动机

在创建我的应用程序 HoopMetrics 时，我发现我需要一种类型的图表来显示特定类别中两个数字相互竞争的结果。竞争差异越大，它需要以更具有视觉威力的方式出现。这就是我为解决这个问题设计的图表。如果您需要显示一对一的对抗，这个图表可能对您有用。

用法

有三个类协同作用以创建此图表。一个 LGFlapJack，一个 LGFlapJackCell 和一个 LGFlapJackStackView。您需要做的事情只是创建 LGFlapJack 模型项，将它们存储在数组中，并将它们传递给 LGFlapJackView，其余的由您处理。此图表可通过 CSV 和图像导出。（见可导出性）

    //For the purposes of this demo
    NSMutableArray*flapJacks = [NSMutableArray new];
    for (int i = 0; i<12; i++) {
        LGFlapJack *flapJack = [LGFlapJack new];
        flapJack.leftBarTotal = [NSNumber numberWithInt:[self getRandomNumberBetween:0 to:100]];
        flapJack.rightBarTotal = [NSNumber numberWithInt:[self getRandomNumberBetween:0 to:100]];
        //Each bar can be its own color.
        flapJack.leftBarColor = [UIColor colorWithRed:17/255. green:159/255. blue:194/255. alpha:1.0];
        flapJack.rightBarColor = [UIColor colorWithRed:206/255. green:218/255. blue:60/255. alpha:1.0];
        flapJack.inlineString = [self randomCategoryName];
        [flapJacks addObject:flapJack];
    }

    self.lgFlapJackStackView = [[LGFlapJackStackView alloc]initWithFrame:self.view.bounds];
    self.lgFlapJackStackView.flapJacks = flapJacks;
    self.lgFlapJackStackView.flapJackHeight = 42;
    self.lgFlapJackStackView.barLabelFont = [UIFont fontWithName:@"HelveticaNeue-Light" size:12];
    self.lgFlapJackStackView.barLabelTextColor = [UIColor colorWithRed:85/255. green:85/255. blue:85/255. alpha:1.0];
    self.lgFlapJackStackView.inlineLabelFont =  [UIFont fontWithName:@"HelveticaNeue-Light" size:12];
    self.lgFlapJackStackView.inlineLabelTextColor = [UIColor colorWithRed:100/255. green:100/255. blue:100/255. alpha:1.0];
    self.lgFlapJackStackView.tableFooterView = [self sampleFooterView];

    //Name of the graph that is shown in email attachements.
    self.lgFlapJackStackView.name = @"lukegeiger";

    [self.view addSubview:self.lgFlapJackStackView];

可导出性

目前，LGFlapJackStackView 支持导出为 CSV 或图像。您可能会发现这些功能对您很有用。要进一步自定义，请查看 LGFlapJackStack 视图的子类化，或在 GitHub 上提交问题。

//LGFlapJackStackView.h
-(UIImage*)graphAsImage;
-(NSString*)graphAsCSVStringWithColOne:(NSString*)colOne colTwo:(NSString*)colTwo colThree:(NSString*)colThree;

提醒一下，要将 CSV 字符串添加到电子邮件附件中，您可以这样做。

//An excerpt from the demo. 
MFMailComposeViewController *mailViewController = [MFMailComposeViewController new];
[mailViewController setMessageBody:@"If you enjoyed this demo, follow me on twitter! @lukejgeiger" isHTML:NO];
mailViewController.mailComposeDelegate = self;

//Converts NSString to NSData. You then take this data and add it to the MFMailComposeViewController.
NSData*data = [[self.lgFlapJackStackView graphAsCSVStringWithColOne:@"Category" colTwo:@"Blue Team" colThree:@"Green Team"]dataUsingEncoding:NSUTF8StringEncoding];

//Adding it the controller. Don't forget this step!
[mailViewController addAttachmentData:data mimeType:@"text/csv" fileName:[NSString stringWithFormat:@"%@.csv",self.lgFlapJackStackView.name]];

[self presentViewController:mailViewController animated:YES completion:nil];

CSV 附件看起来像这样。条形柱的列名是可定制的。

类别 蓝队 绿队
PTS 34 53
RBD 44 22
AST 10 55

定制

所有颜色、字体等均可编辑。如果您想编辑条形中显示的标签，只需子类化 LGFlapJack，并覆盖 rightBarFormatString 或 leftBarFormatString。

目前，此图表没有默认的标题或页脚，但您可以使用自定义视图传递。 （见可能改进部分）

特殊情况

目前，如果一个 FlapJack 的右侧或左侧数字严重占优，它将较小的数字推到无法在图表上显示的程度。我计划尽快为条形添加最大宽度属性。

可能改进

  • 某种动画。但这种动画应该有一定的作用，而不仅仅是动画本身。
  • 默认页脚/页眉。
  • 添加/删除薄煎饼。
  • 排序薄煎饼。

实现说明

  • 在这个表格视图中看起来像是行的地方，实际上都是章节。我选择这样实现的原因是我可能希望在之后利用UITableView数据源协议中的titleForSection或footerForSection方法。

安装

LGFlapJackStackView可通过CocoaPods获得。要安装，只需将以下行添加到您的Podfile中

pod "LGFlapJackStackView"

作者

Luke Geiger，[email protected]

@lukejgeiger

许可

LGFlapJackStackView可在MIT许可下使用。更多信息请见LICENSE文件。