@nativescript-community/ui-material-progress
TypeScript icon, indicating that this package has built-in type declarations

7.1.3 • Public • Published

NativeScript Material Linear progress indicator

Material Design's Linear progress indicator component for NativeScript.

npm npm

Contents

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

Installation

For NativeScript 7.0+

  • tns plugin add @nativescript-community/ui-material-progress

For NativeScript 6.x

  • tns plugin add nativescript-material-progress

If using tns-core-modules

  • tns plugin add nativescript-material-progress@2.5.4

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

Changelog

FAQ

Usage

Plain NativeScript

IMPORTANT: Make sure you include xmlns:mdp="@nativescript-community/ui-material-progress" on the Page element

XML

<Page xmlns:mdp="@nativescript-community/ui-material-progress">
    <StackLayout horizontalAlignment="center">
        <mdp:Progress value="50" maxValue="100"/>
   </StackLayout>
</Page>

CSS

mdprogress {
    ripple-color: blue;
    elevation: 4;
}

NativeScript + Angular

import { NativeScriptMaterialProgressModule } from "@nativescript-community/ui-material-progress/angular";

@NgModule({
    imports: [
        NativeScriptMaterialProgressModule,
        ...
    ],
    ...
})
<MDProgress v-model="value" maxValue="100"></MDProgress>

NativeScript + Vue

import ProgressPlugin from '@nativescript-community/ui-material-progress/vue';

Vue.use(ProgressPlugin);
<MDProgress value="50" maxValue="100"></MDProgress>

API

Attributes

Inherite from NativeScript Progress so it already has all the same attributes.

  • elevation optional

An attribute to set the elevation of the progress. This will increase the 'drop-shadow' of the progress.

  • rippleColor optional

An attribute to set the ripple color of the progress.

Install

npm i @nativescript-community/ui-material-progress

DownloadsWeekly Downloads

77

Version

7.1.3

License

Apache-2.0

Unpacked Size

41.9 kB

Total Files

26

Last publish

Collaborators

  • dgmachado
  • classicoldsong
  • mayerlench
  • jcassidyav
  • sebjean
  • cjohn001
  • edusperoni
  • asharghi
  • farfromrefuge
  • triniwiz
  • eddyverbruggen
  • rigor789
  • walkerrunpdx
  • dnr
  • keerl
  • cvietor
  • bradmartin
  • rdlabo
  • tralves