NavbarComponent - A Framer module for generating an iOS-style navigation bar.

  •        2

The NavbarComponent module allows you to generate an iOS-style navigation bar with title, action buttons, and search bar. Scroll effects mimic those on iOS, and views can be navigated forward and reverse. Copy or save the NavbarComponent file into your project's modules folder.

https://github.com/bpxl-labs/NavbarComponent

Dependencies:

coffeeify : ^2.1.0

Tags
Implementation
License
Platform

   




Related Projects

sketch-framer - A Sketch plugin to easily export your mockups to FramerJS

  •    Javascript

A plugin to export Sketch.app documents into FramerJS to make interactive prototypes. You can customize the exported files (index.html, app.js) by tweaking sketch-framer-config.js. The most common thing you might want to do is import a library file and include it in all your projects.

framer-material-kit

  •    Javascript

Material Kit was created to make prototyping with Material Design fast and easy without compromising the quality or customization. If you're interested in prototyping with iOS, check out the iOS Kit for FramerJS.

Input-Framer - Framer module to add inputs to your prototypes and easily turn your designs inputs into real inputs

  •    CoffeeScript

Framer module to easily turn your designs inputs into real inputs. Note: keyboard.png is prepared for iPhone 7. If you want to use a different size, replace with your own image.

Framer-Snippets-Library - A library of Framer snippets to help speed up your workflow

  •    CoffeeScript

I built this library to compliment the included snippets library in Framer. These snippets focus on repeated actions and include as little code as possible. It should be quite helpful to beginners who are learning the basic behaviors of Framer, but it should be also be helpful to more experienced users when used as shortcuts. A variety of common actions.

textLayer-for-Framer - Framer

  •    CoffeeScript

Update 23/3: TextLayer is now a native feature of Framer. Framer.js module that simplifies the process of adding text to your prototypes.


react-native-nav - A cross-platform (iOS / Android), fully customizable, React Native Navigation Bar component

  •    Javascript

I created this project after going through the navbars contained in Awesome React and not finding any that were cross-platform, customizable, and integrated the status bar. This project is a spiritual successor to react-native-navbar (I forked it and ended up changing like 90% of it). To find a preview of all examples go to the examples folder.

Frameless - A chromeless web browser for viewing prototypes.

  •    Swift

Frameless is a web browser for iOS 8+ that gets out of your way. It was built for designers and prototypers who need to interact with your prototypes in a "native" device environment but also works to browser most websites. I highly recommend downloading and using the official Framer viewer app for iOS. It's got a more robust feature set than Frameless and is actively maintained by the Framer team.

ViewController-for-Framer - Multi step user flows in Framer.js

  •    CoffeeScript

The ViewController module for Framer.js helps you create multi step user flows with pre-made transitions like "fade in", "zoom in" and "slide in". It consists of a Framer module and an optional Sketch plugin. Check out the intro article on Medium. Step 2 Call one of the supported transitions to switch view or use the Sketch plugin to generate links.

react-native-image-header-scroll-view - ScrollView with an image in header which becomes a navbar

  •    Javascript

You can find examples in a dedicated repository. All of the properties of ScrollView are supported. Please refer to the ScrollView documentation for more detail.

bootstrap-autohidingnavbar - An extension for Bootstrap's fixed navbar which hides the navbar while the page is scrolling downwards and shows it the other way

  •    Javascript

Bootstrap Auto-Hiding Navbar is an extension for Bootstrap's fixed navbar which hides the navbar while the page is scrolling downwards and shows it the other way. The plugin is able to show/hide the navbar programmatically as well. You can listen for following events.

framer-ios-kit

  •    Javascript

iOS Kit was created to make prototyping for iOS fast and easy without compromising the quality or customization. There are three core pieces that make up iOS Kit. There is the foundational elements that help iOS Kit mold to devices. There is the component library that’ll save you time by providing native iOS offerings, and then there’s the supporting functions that help power the foundation & components.

Framer - Framer - Design Everything

  •    Javascript

Framer Library is an open source JavaScript framework for high fidelity prototyping. Use it to design animations and interactions without any limitations. Make use of real spring physics or animate with 3D effects, anything is possible. There are 2 ways to use Framer Library. To get most out of Library download Framer; a design tool for the Mac. The other way you can leverage Framer Library is with generator; an app that imports your layers from Sketch, Photoshop and Figma. The following features are included with each option.

framer-modules - Discover, install and save your favorite modules at one place

  •    Javascript

Looking for the right module used to be time-consuming and annoying—you didn't know if a module for the job exists, you weren't sure where to look for it and you had to manually download and move the files just to try things out. Tired of downloading and copying modules to the prototype on your own? We all are. That's why installing modules is now so easy even your grandma can do it. Seriously, it's just “press Enter”.

react-native-navbar - Navbar component for React Native

  •    Javascript

Simple customizable navbar component for react-native

react-native-controllers - Native IOS Navigation for React Native (navbar, tabs, drawer)

  •    Objective-C

Without react-native-controllers, iOS skeleton components such as UINavigationController or a side menu drawer are challenging to implement natively. This forces developers to compromise on user experience to use React Native. react-native-controllers simplifies this by re-introducing UIViewController into the React Native stack. If you're already convinced you need this package, you can skip straight to Installation. If not, brace yourself for a long read.

NativeBase - Essential cross-platform UI components for React Native

  •    Javascript

NativeBase is a sleek, ingenious and dynamic front-end framework created by passionate React Loving team at Geekyants.com to build cross platform Android & iOS mobile apps using ready to use generic components of React Native. What is really great with NativeBase is that you can use shared UI cross-platform components, which will drastically increase your productivity. When using NativeBase, you can use any native third-party libraries out of the box.

shortcuts-for-framer - A collection of useful functions to make mobile prototyping with Framer easier

  •    Javascript

A collection of useful functions to make mobile prototyping with Framer easier. For full reference, check our annotated source code in shortcuts.coffee.All the animation functions use curves and times that can be customized. Check the very top of shortcuts.js to see all the options.

shortcuts-for-framer - A collection of useful functions to make mobile prototyping with Framer easier

  •    Javascript

A collection of useful functions to make mobile prototyping with Framer easier. For full reference, check our annotated source code in shortcuts.coffee. All the animation functions use curves and times that can be customized. Check the very top of shortcuts.js to see all the options.