TeamWertarbyte / Material Auto Rotating Carousel
Licence: mit
Introduce users to your app with this Material-style carousel.
Stars: β 400
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Material Auto Rotating Carousel
Materialabout
It's a material-design about screen to use on your Android apps. A developer profile and application information easy to integrate. π
Stars: β 1,511 (+277.75%)
Mutual labels: material-design, material, material-ui
Jekyll Material Theme
A Jekyll Theme based on Material Design using Materialize.
Stars: β 165 (-58.75%)
Mutual labels: material-design, material, material-ui
Materialanim
εΊδΊAndroid η³»η»ηε¨η»ζ»η»
Stars: β 123 (-69.25%)
Mutual labels: material-design, material, material-ui
Cardview
Material Design Cards ? How cool is that !
Stars: β 101 (-74.75%)
Mutual labels: material-design, material, material-ui
Motion Shapeofview
Explain how to use MotionLayout with ShapeOfView
Stars: β 236 (-41%)
Mutual labels: material-design, material, material-ui
Materialspinner
Implementation of a Material Spinner for Android with TextInputLayout functionalities
Stars: β 107 (-73.25%)
Mutual labels: material-design, material, material-ui
Ibackdrop
A library to simply use Backdrop in your project (make it easy). Read more ->
Stars: β 137 (-65.75%)
Mutual labels: material-design, material, material-ui
Shards Dashboard
π₯A beautiful Bootstrap 4 admin dashboard templates pack.
Stars: β 1,143 (+185.75%)
Mutual labels: material-design, material, material-ui
Material Admin
Free Material Admin Template
Stars: β 219 (-45.25%)
Mutual labels: material-design, material, material-ui
Hubuntu Ui
Material Admin Dashboard Starter UI ( Ubuntu style ) - https://720kb.github.io/hubuntu-ui/
Stars: β 207 (-48.25%)
Mutual labels: material-design, material, material-ui
Cyanea
A theme engine for Android
Stars: β 1,319 (+229.75%)
Mutual labels: material-design, material, material-ui
Materiallettericon
Material first letter icon like lollipop contacts icon. Letter(s) on a shape drawn on canvas.
Stars: β 255 (-36.25%)
Mutual labels: material-design, material, material-ui
Togglebuttons
Android toggle buttons that adhere to the Material Design documentation.
Stars: β 88 (-78%)
Mutual labels: material-design, material, material-ui
Smart Webcomponents
Web Components & Custom Elements for Professional Web Applications
Stars: β 110 (-72.5%)
Mutual labels: material-design, material, material-ui
Mahapps.metro.iconpacks
Awesome icon packs for WPF and UWP in one library
Stars: β 1,157 (+189.25%)
Mutual labels: material-design, material, material-ui
Svelte Material Ui
Svelte Material UI Components
Stars: β 2,081 (+420.25%)
Mutual labels: material-design, material, material-ui
Slidetoact
A simple 'Slide to Unlock' Material widget for Android, written in Kotlin π±π¨π¦
Stars: β 783 (+95.75%)
Mutual labels: material-design, material, material-ui
React Saas Template
π Template for building an SaaS / admin website using React + Material-UI
Stars: β 942 (+135.5%)
Mutual labels: material-design, material, material-ui
Material Singleinputform
A single EditText instead of a classical form. Library that implements flavienlaurent's singleinputform
Stars: β 202 (-49.5%)
Mutual labels: material-design, material, material-ui
Alyle Ui
Minimal Design, a set of components for Angular 9+
Stars: β 234 (-41.5%)
Mutual labels: material-design, material, material-ui
Material AutoRotatingCarousel
So you wrote a great app and deployed it and everything. But how do you introduce new users to your app? Well, the Material design guidelines have a solution: Displaying the top benefits in a beautiful auto-rotating carousel!
This project implements such a carousel for Material-UI. Visit the styleguide for an interactive demo.
Installation
npm i --save material-auto-rotating-carousel
npm i --save react-swipeable-views
Note: This is the version for Material-UI 1.0.0 or later. If you are using Material-UI 1.0.0-beta, you should update to the latest version. If you are still using Material-UI 0.x, you can use our legacy version.
AutoRotatingCarousel Properties
| Name | Type | Default | Description |
|---|---|---|---|
| autoplay | bool |
true |
If false, the auto play behavior is disabled. |
| ButtonProps | object |
Properties applied to the Button element. | |
| classes | object |
Object for customizing the CSS classes. | |
| containerStyle | object |
Override the inline-styles of the carousel container. | |
| hideArrows | function |
If true, the left and right arrows are hidden in the desktop version. |
|
| interval | integer |
3000 |
Delay between auto play transitions (in ms). |
| label | string |
Button text. If not supplied, the button will be hidden. | |
| landscape | bool |
If true, slide will adjust content for wide mobile screens. |
|
| mobile | bool |
false |
If true, the screen width and height is filled. |
| ModalProps | object |
Properties applied to the Modal element. | |
| open | bool |
false |
Controls whether the AutoRotatingCarousel is opened or not. |
| onChange | function |
Fired when the index changed. Returns current index. | |
| onClose | function |
Fired when the gray background of the popup is pressed when it is open. | |
| onStart | function |
Fired when the user clicks the getting started button. |
Slide Properties
| Name | Type | Default | Description |
|---|---|---|---|
| classes | object |
Object for customizing the CSS classes. | |
| landscape | bool |
If true, slide will adjust content for wide mobile screens (automatically set by AutoRotatingCarousel). |
|
| media* | node |
Object to display in the upper half. | |
| mediaBackgroundStyle | object |
Override the inline-styles of the media container. | |
| mobile | bool |
If true, the screen width and height is filled (automatically set by AutoRotatingCarousel). |
|
| style | object |
Override the inline-styles of the slide. | |
| subtitle* | string |
Subtitle for the slide. | |
| title* | string |
Title for the slide. |
* required property
Example
License
The files included in this repository are licensed under the MIT license.
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].