All Projects → tuckerconnelly → Carbon Ui

tuckerconnelly / Carbon Ui

Licence: mit
React Native Material Design library for all platforms

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Carbon Ui

Material Admin
A Material Designed Admin Framework based on Spring boot2 And Bootstrap
Stars: ✭ 196 (-8.84%)
Mutual labels:  material-design
Flutterexampleapps
[Example APPS] Basic Flutter apps, for flutter devs.
Stars: ✭ 15,950 (+7318.6%)
Mutual labels:  material-design
Listenermusicplayer
A Grace Material Design Music Player
Stars: ✭ 2,360 (+997.67%)
Mutual labels:  material-design
Iconshowcase Dashboard
A full-of-features, easy-to-customize, free and open source, Material Design dashboard for icon packs.
Stars: ✭ 197 (-8.37%)
Mutual labels:  material-design
Arctic admin
Responsive Theme for ActiveAdmin
Stars: ✭ 201 (-6.51%)
Mutual labels:  material-design
Ionic 4 Components
🍕 Ionic 4 UI Component Library. Featuring Image Gallery, Refresher, Bottom Sheet and more.
Stars: ✭ 206 (-4.19%)
Mutual labels:  material-design
React Md
React material design - An accessible React component library built from the Material Design guidelines in Sass
Stars: ✭ 2,284 (+962.33%)
Mutual labels:  material-design
Matblazor
Material Design components for Blazor and Razor Components
Stars: ✭ 2,599 (+1108.84%)
Mutual labels:  material-design
Design Blocks
A set of 170+ Bootstrap based design blocks ready to be used to create clean modern websites.
Stars: ✭ 13,317 (+6093.95%)
Mutual labels:  material-design
Hubuntu Ui
Material Admin Dashboard Starter UI ( Ubuntu style ) - https://720kb.github.io/hubuntu-ui/
Stars: ✭ 207 (-3.72%)
Mutual labels:  material-design
Material Start
Starter Repository for AngularJS Material
Stars: ✭ 2,234 (+939.07%)
Mutual labels:  material-design
Material Singleinputform
A single EditText instead of a classical form. Library that implements flavienlaurent's singleinputform
Stars: ✭ 202 (-6.05%)
Mutual labels:  material-design
Minimalist
A Material Color Scheme Darker for Vim.
Stars: ✭ 205 (-4.65%)
Mutual labels:  material-design
Materialcalendar
A Material design calendar inspired by the CalendarView of School Diary.
Stars: ✭ 196 (-8.84%)
Mutual labels:  material-design
Twidere Android
twidere.com
Stars: ✭ 2,486 (+1056.28%)
Mutual labels:  material-design
Materialskin
Theming .NET WinForms, C# or VB.Net, to Google's Material Design Principles.
Stars: ✭ 2,358 (+996.74%)
Mutual labels:  material-design
Windview
WindView is an Android Library to show Weather's Wind & pressure Status
Stars: ✭ 205 (-4.65%)
Mutual labels:  material-design
Ghost Android
🤖 Ghost for Android
Stars: ✭ 215 (+0%)
Mutual labels:  material-design
Materialize Blog
redesign blog using material design
Stars: ✭ 212 (-1.4%)
Mutual labels:  material-design
Flutter speed dial
Flutter plugin to implement a Material Design Speed Dial
Stars: ✭ 206 (-4.19%)
Mutual labels:  material-design

No longer maintained!

Material Design library for React Native that runs on all platforms.

Installation

npm -S i tuckerconnelly/carbon-ui#0.1 // or, if you want the latest:
npm -S i tuckerconnelly/carbon-ui

Material Design is built on the Roboto Fonts, so you need to make them available for Carbon UI.

You can download them here, and then install them for your platform:

Install react-native-web, and then place the <WebStyles /> in your index.web.js:

import 'babel-polyfill'

import React from 'react'
import { AppRegistry } from 'react-native-web'
import { WebStyles } from 'carbon-ui'

import App from './src/index'

const AppWithStyles = () => <App><WebStyles /></App>

AppRegistry.registerComponent('CarbonUIExample', () => AppWithStyles)
AppRegistry.runApplication('CarbonUIExample', { rootTag: document.getElementById('root') })

Usage

Once you're installed, you can use any of Carbon UI's components:

import React from 'react'
import { Paper, Display1, FlatButton } from 'carbon-ui'

export default () =>
  <Paper>
    <Display1>Giant display</Display1>
    <FlatButton>Flat button</Button>
  </Paper>

Documentation

Known issues

Performance on Android

Performance on Android can get pretty slow if you're not careful. Carbon UI makes good use of the Animated API, which is particularly slow on Android.

Carbon UI optimizes a lot, using native animations and graceful degradations, and it'll generally be good-to-go out of the box.

Long term, the React Native team is doing good work to improve Animated performance.

If you run in to any snags, check out the Known issues page in the docs for tips on improving performance, or file an issue here.

Disclaimer

This is still a beta. Expect bugs 😛

Connect

Follow the creator on Twitter, @TuckerConnelly

License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].