Skip to content

Latest commit

 

History

History
50 lines (34 loc) · 2.2 KB

File metadata and controls

50 lines (34 loc) · 2.2 KB

NativeScript Material Speed dial

Material Design's Speed dial component for NativeScript.

npm npm

Contents

  1. Installation
  2. Changelog
  3. FAQ
  4. Usage

Installation

⚠️ Warning ⚠️

From NativeScript 5.x using this component will break the NativeScript tab component on iOS (which is bound to be removed). This is needed to allow using the latest native iOS features. If needed you can use either bottomnavigationbar (this one is the best choice, closest to material design) or material-tabs (clone of the NativeScript one, but with a little less features).

ns plugin add @nativescript-community/ui-material-speeddial

Be sure to run a new build after adding plugins to avoid any issues.

Usage

NativeScript + Vue

import Vue from 'nativescript-vue';
import speeddialPlugin from '@nativescript-community/ui-material-speeddial/vue';

Vue.use(speeddialPlugin);
<MDSpeedDial buttonFontSize="26" text="mdi-one-up"  buttonClass="mdi" buttonBackgroundColor="yellow" @tap="onTap">
    <MDSpeedDialItem icon="res://ic_action_add" title="test1" backgroundColor="red"  @tap="onTap"/>
    <MDSpeedDialItem text="mdi-card-account-mail" title="test2" buttonClass="mdi" backgroundColor="green"  @tap="onTap"/>
    <MDSpeedDialItem backgroundImage="~/images/iu.jpg"  backgroundColor="blue"  @tap="onTap"/>
    <MDSpeedDialItem icon="res://ic_action_add" title="test4" backgroundColor="orange" @tap="onTap"/>
</MDSpeedDial>