material2_dart 0.1.1

angular/material2 for Dart.

Material Design for Angular 2

It is angular/material2 for Dart.

Why

The angular/material2 is one of the prospective standard material design UI library for angular2 TypeScript / JavaScript users. Bringing it into native Dart package will be useful.

Another high-quality angular2 Dart material design UI library is expected to be published soon (coming July?) as stated in the angular/material2 issue tracker. I believe most Dart people will choose it, and it is absolutely fine with me.

I have been maintaining the same API and internal structure as much as I can for easy side by side comparison between the Dart version and the TypeScript version. (And for easy updating.) It would clarify the API compatibility, and hopefully, it would be a good code example for TypeScript / JavaScript users who are interested in angular2 Dart version.

Project Status

Current porting target.

497a3c1(commit SHA1) 6/15/2016: DONE.

Notes

This package is very much a work in progress.

Please note that the original angular/material2 is in alpha phase, and this package may contain additional bugs.

I would change the package name on the next update of Angular2 Dart and the next release of angular/material2. (At leaset one month later.)

Components

All porting works have done for the current target.

• Button
• Button Toggle (This is not working. I will investigate it after the next ng2 Dart update.)
• Card
• Checkbox(Without enough test code)
• Grid List(Without enough test code)
• Icon
• Input(Without enough test code)
• List
• Progress Bar(Without enough test code)
• Progress Circle(Without enough test code)
• Radio(Without enough test code)
• Sidenav
• Slide Toggle(Without enough test code)
• Tabs (The async tabs is broken. See issues/30)
• Toolbar

Core

All porting works have done for the current target.

Gestures are not ported. It looks like Angular2 Dart does not support gestures as of beta-17. I will investigate it after next Angular2 Dart release.

Prerequisites

This package depends on scissors package which requires to install sassc for scss compilation. (Ruby sass is not supported.)

If you have not set up scissors, please set up scissors with the guide.

Usage

1. Add this to your package's pubspec.yaml file. (The example)

    dependencies:
      material2_dart: any
   

2. Run pub get.

3. Import component files and add directives on a component metadata. (The example)

Example

Please see the Demo App which includes all of the components and core functions usages.

How to see the Demo App on a browser.

Assuming you have already installed Dart,

1. Clone this repository.

    git clone https://github.com/ntaoo/material2_dart.git
   

2. Go to the example directory.

    cd material2_dart/example
   

3. Run pub get to get all the dependent packages.

    pub get
   

4. Run pub serve to start up a development server.

    pub serve
   

5. Go to http://localhost:8080 on a browser. (I recommend Dartium because perhaps there are still browser-specific bugs on this package.)

Contributing

Your contribution is welcome. Please note that this project is nothing more than a porting work of angular/material2.

Many tests have not been ported, so it is much appreciated if you help to port them.

Features and bugs

Basically, I would not add any original features on it. If you need new features, please consider contributing angular/material2.

If you find this Dart version's specific bugs, please file them at the issue tracker.

Testing Angular2.

Run test server on the project root.

pub serve

Run tests on dartium.

pub run test --pub-serve=8080 -p dartium