DWScrollTabBarController 1.0.3

DWScrollTabBarController 1.0.3

×

由jiadawei维护。

DWScrollTabBarController 1.0.3

  • 作者：
  • jiadawei

DWScrollTabBarController

  • 一个可滚动的tabBar，具有动态项目。每个项目显示一个特定的视图。

为什么我应该使用这个框架

  • 您只需几个步骤即可创建一个具有可滚动tabBar的视图控制器。

  • tabBar中的项可以是动态的。每次打开视图控制器时，tabBar中的项都可能不同。

  • 您不需要为每个项创建一个类文件。您应该为每个项创建一个视图。

  • 您可以使用此框架创建如下视图控制器。

  • 它现在可用于iPhoneX。

image image image image image image image

安装

  • Cocoapods

    在您的Podfile中

    pod 'DWScrollTabBarController'

  • 手动导入

    将“DWScrollTabBarController”文件夹中的所有文件拖动到您的项目中。

如何使用它

  • 扩展 DWScrollTabBarController

    #import "DWScrollTabBarController.h"

@interface YourViewController : DWScrollTabBarController

@end

    注意：如有必要，您可以直接在项目中将 DWScrollTabBarController 扩展到您的基类 ViewController，而不仅仅是扩展 UIViewController。

  • 在 viewDidLoad 方法中设置自定义属性

      // color
  self.normalTitleColor       = [UIColor blackColor];
  self.currentTitleColor      = [UIColor whiteColor];
  self.normalButtonBgColor    = [UIColor blueColor];
  self.currentButtonBgColor   = [UIColor orangeColor];
  self.tabBarBgColor          = [UIColor whiteColor];
  // font
  self.normalTitleFont        = [UIFont systemFontOfSize:13];
  self.currentTitleFont       = [UIFont systemFontOfSize:18];
  // height
  self.tabBarHeight           = 30;
  // button width
  self.unifiedWidth           = YES;
  self.buttonWidth            = 70;
  // indicator line
  self.showIndicatorLine      = YES;
  self.indicatorLineHeight    = 2;
  self.indicatorLineColor     = [UIColor redColor];
  self.indicatorLineWidth     = 50;
  self.indicatorLineCenter    = YES;
  // bottom line
  self.showBottomLine         = YES;
  self.bottomLineHeight       = 1;
  self.bottomLineColor        = [UIColor blackColor];
  // margin
  self.showViewMargin         = YES;
  self.viewMargin             = 10;
  self.leftMargin             = 10;
  self.rightMargin            = 0;
  self.buttonMargin           = 10;
  // others
  self.bounces                = YES;
  self.scrollable             = YES;

    提示：您不需要设置所有这些属性。每个属性都有一个默认值。

    unifiedWidth 是一个特殊的属性。其默认值为 'NO'，所以如果不将其设置为 'YES'，则 tabBar 项的宽度将基于项的标题计算。标题中的单词越多，标题越宽。
    如果您将 unifiedWidth 设置为 'YES'，则每个项的宽度都将相同。您应根据需要设置 buttonWidth，其默认值为 100。

    提示：如果同时显示indicatorLine和bottomLine，指示线可能会被底部线覆盖。

  • 在viewDidLoad方法中设置数据

      /**
   !!!!! NOTE:
    You MUST set properties of tab bar before set value for 'typesArray', otherwise the properties
    you set for tab bar will not take effect.
    You can hardcode the types in the code or get the types data from server. It doesn't matter how
    many types are.
   */
  self.typesArray = @[@"军事", @"游戏", @"社会", @"体育", @"娱乐", @"头条", @"女性", @"政治", @"时尚"];
  
  // Add all tableviews that need to display data
  self.tableViewArray = [self setupSubViews];

    提示：您必须在设置属性后再设置数据。否则在tabBar中什么也看不到。

    setupSubViews方法应由您自己实现。详细信息请参考以下内容。

  • 在viewDidLoad方法中加载默认数据

    [self loadTableViewData];

    默认加载第一类数据。此方法应由您自己实现。详细信息请参考示例。

  • 创建自己的tableView来显示数据。

    此tableView应有一个属性typeID，在其setter方法中加载数据。

    - (void)setTypeID:(NSString *)typeID {
  
    _typeID = typeID;

    [self loadData];
}

    然后您可以加载基于不同类型的各种数据。

    将它们添加到属性tableViewArray中

    /**
 * Add all tableviews that need to display data
 */
- (NSMutableArray *)setupSubViews {

    NSMutableArray *typeTableViews = [NSMutableArray array];

    for (int i = 0; i < self.typesArray.count; i++) {

        DWTableView *tableView = [[DWTableView alloc] init];

        [typeTableViews addObject:tableView];
    }

    return typeTableViews;
}

    // Add all tableviews that need to display data
self.tableViewArray = [self setupSubViews];

    您可以参考示例项目中的示例tableView。

  • 实现 DWScrollTabBarController 委托方法。

    请参考示例以获取详细说明。您可以直接在示例中使用这两个方法中的代码。

    /**
 * click buttons in the tab bar
 */
- (BOOL)tabBar:(DWScrollTabBar *)tabBar didClickTabButton:(UIButton *)tabBarButton {

// if the click is caused by scroll the tableviews, then don't need to load data
BOOL isScrolled = [super tabBar:tabBar didClickTabButton:tabBarButton];

if (!isScrolled) {
    // load data for a specific type
    [self loadTableViewData];
}

return NO;
}
/**
 * Change page when scroll tableviews
 */
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {

  [super scrollViewDidEndDecelerating:scrollView];
  // load data for a specific type
  [self loadTableViewData];
}
/**
 * load data according to types
 */
- (void)loadTableViewData{

  DWTableView *allView = self.tableViewArray[self.currentPage];
  allView.typeID = [NSString stringWithFormat:@"%ld", self.currentPage];
}

    提示：您只能使用上述两个方法来加载数据的每一页。请将您的 'loadData' 方法添加到这两个方法中。

    • 这就是使用此框架需要做的所有事情。更多需要您做的是添加自定义视图到框架并从您的服务器加载数据。

请参考示例以获取详细说明。