https://github.com/iwufan/dwscrolltabbarcontroller
A scrollable tabBar with dynamic items. Each item shows a specific view.
https://github.com/iwufan/dwscrolltabbarcontroller
ios objective-c scrollable scrollbar tabbar tabbarcontroller uitableview
Last synced: 10 months ago
JSON representation
A scrollable tabBar with dynamic items. Each item shows a specific view.
- Host: GitHub
- URL: https://github.com/iwufan/dwscrolltabbarcontroller
- Owner: iwufan
- License: mit
- Created: 2017-04-05T09:01:09.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2018-09-01T11:00:00.000Z (over 7 years ago)
- Last Synced: 2025-03-17T10:02:34.972Z (11 months ago)
- Topics: ios, objective-c, scrollable, scrollbar, tabbar, tabbarcontroller, uitableview
- Language: Objective-C
- Homepage:
- Size: 62.5 KB
- Stars: 4
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# DWScrollTabBarController
- A scrollable tabBar with dynamic items. Each item shows a specific view.
- Swift: You can click [Here](https://github.com/iwufan/DJTabBarController) to get the Swift version of this framework.
# Why shoud I use this framework
- You can build a view controller with scrollable tabBar in only a few steps.
- The items in the tabBar can be dynamic. The items in the tabBar can be different every time you open the view controller.
- You don't have to create a class file for each item. What you should do is to create a view for each item.
- You can use this framework to create view controllers like these below.
- It can be used on iPhoneX now.
# Installation
- ### Cocoapods
In your Podfile
`pod 'DWScrollTabBarController'`
- ### Manual import
Drag all the files in the `DWScrollTabBarController` folder to your project.
# How to use it
- ### Extends DWScrollTabBarController
```
#import "DWScrollTabBarController.h"
@interface YourViewController : DWScrollTabBarController
@end
```
NOTE: You can make `DWScrollTabBarController` extends your base ViewController in your project if necessary, instead of extending `UIViewController`.
- ### Setup customized properties in `viewDidLoad` method
```
// 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;
```
#### Tip: You DO NOT have to setup all these properties. Every property has a default value.
`unifiedWidth` is a special property. It's default value is 'NO', so if you do not set it as 'YES', the tabBar item's width is calculated based on the item's title. The more words on the title, the wider the title.
If you set `unifiedWidth` as 'YES', every item's width will be the same. You should set `buttonWidth` as you want, it has a default value 100.
#### Note: If you show `indicatorLine` and `bottomLine` at the same time. The indicator line may be covered by bottom line.
- ### Setup data in `viewDidLoad` method
```
/**
!!!!! 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];
```
#### Tip: You MUST setup data AFTER setting properties. Or you will get nothing in the tabBar.
The `setupSubViews` method should be implemented by yourself. Please refer to below for details.
- ### LoadDefaultData in `viewDidLoad` method
```
[self loadTableViewData];
```
Load first type's data by default.
This method should be implemented by yourself. Please refer to demo for details.
- ### Create your own tableView to display data.
This tableView should have a property `typeID`, and load data in its setter method.
```
- (void)setTypeID:(NSString *)typeID {
_typeID = typeID;
[self loadData];
}
```
Then you can load data based on different types.
Add them to the property `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];
```
You can refer to the demo project for the example tableView.
- ### Implement `DWScrollTabBarController` delegate methods.
Please refer to demo for details. You can use the codes of the two methods in the demo directly.
```
/**
* 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];
}
```
#### Tip: You ONLY can use these two methods above to load every page's data. Please add your 'loadData' method to these two methods.
- Above is all you shoud do with this framework. More you shoud do are add customized views to this framework and load data from your server.
#### Plese refer to demo for details.