Git Product home page Git Product logo

ggtabbar's Introduction

#GGTabBar

GGTabBar is a simple UITabBar & UITabBarController replacement that uses Auto Layout for constructing the GUI. I created it for curiosity, but it may be useful to others who adventure into the land of Auto Layout.

Build Status

screenshot

โš ๏ธ This is a work in progress/proof of concept, I'm no expert. Sorry if it's missing some feature you need, feel free to fork, pull request or open issues. I'm available on Twitter if you have further questions ๐Ÿ˜ฌ๐Ÿ‘Œ

Limitations ๐Ÿ’ฃ

  • Still need to add customization options (background color, tint, style, background image, etc.).
  • The tab bar items are UIButtons (no TabBarItem abstraction in a UIView).
  • No more tab if you add more than 5 View Controllers.
  • Still need to add more integration tests.

Install

Cocoapods

pod 'GGTabBar', '~> 0.0.2'

Xcode

Just copy the GGTabBar folder into your Xcode project.

Usage ๐Ÿš€

โš ๏ธ Your UIViewControllers must set their tabBarItem images (selected/normal).

Objective-C

Init and customize

GGTabBarController *tabBar = [[GGTabBarController alloc] init];
tabBar.tabBarAppearanceSettings = @{kTabBarAppearanceHeight : @(100.0)}; // in points
tabBar.viewControllers = @[vc1, vc2, vc3, vc4];
self.window.rootViewController = tabBar;

Swift

โš ๏ธ remember to add GGTabBar.h into your project's Swift Bridging Header.

var tabBar: GGTabBarController = GGTabBarController()
tabBar.tabBarAppearanceSettings = [kTabBarAppearanceHeight : 100.0];
tabBar.viewControllers = [vc1, vc2, vc3, vc4]
self.window!.rootViewController = tabBar

โš ๏ธ Feel free to explore the provided Example Project to check out how to use GGTabBar.

Structure ๐Ÿท

All the views are setup with Auto Layout. There are no CGRect, Struts or Sprints, so unless you break the constraints, everything should work on different screen-sizes.

If you want more information about how the AutoLayout Constraints are specified, please take a look at the tests. It's the best way to understand what's going on here.

hierarchy

Debug ๐Ÿ›

Normally you won't be doing any sort of Debug, but it something strange happens you can enable debugMode so that all the UIView's backgrounds are painted.

To enable debug mode:

Objective-C

tabBar.debug = YES;

Swift

tabBar.debug = true
  • Green Views: Margins, there are always exactly two of them.
  • Red Views: Separators, located between buttons.
  • Blue View: The GGTabBar.view.
  • White Views: Button backgrounds.

Emoji ๐Ÿ’ฉ

You got to freakin' โค๏ธ them ๐Ÿ˜!

ggtabbar's People

Contributors

goles avatar maciej-matuszewski avatar chuongtrh avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.