Vuoi uno sviluppo mobile più veloce? Flutter è la via!

Vuoi uno sviluppo mobile più veloce? Flutter è la via!

E22edc988280c3b6ff183318bc1590c2?s=128

weLaika

May 02, 2018
Tweet

Transcript

  1. 3.

    Content 1. What is Flutter ? 2. The story 3.

    Tooling 4. Widgets 5. Testing 6. Use Cases 7. Example
  2. 6.

    1. mobile UI framework 2. made by google 3. helps

    to craft high-quality native interfaces on iOS and Android 4. free and open source 5. Fast Development experience
  3. 7.
  4. 8.

    What do you need to setup Flutter? • Operating System

    of 64 bit (Windows, MacOs, Linux) • Disk Space: Windows — 400 MB, MacOs — 700 MB, Linux — 600 MB • Tools: Windows (git), MacOs-Linux (bash, mkdir, rm, git, curl, unzip, which) • Get the Flutter SDK • run “flutter doctor” on command prompt or POWER SHELL.
  5. 10.

    Dart is a general-purpose programming language originally developed by Google

    and later approved as a standard by Ecma — Wikipedia
  6. 11.

    1. Dart language is a cool language: 2. it’s familiar

    and easy to learn for developers 3. it’s Class-based and optionally typed 4. It has a cool Asynchronous Library (Future and Stream) 5. Dart helps to create an easy to understand layout for your UI
  7. 14.

    Flutter CLI doctor: Show information about the installed tooling. This

    command is vital to know if there is something dependencies missing. logs: Show log output for running Flutter apps. screenshot: Take a screenshot from a connected device. test: Run Flutter unit tests for the current project. trace: Start and stop tracing for a running Flutter app. With this command you can trace and measure wall/CPU time.
  8. 18.

    A widget can define: • a structural element (like a

    button or menu) • a stylistic element (like a font or color scheme) • an aspect of layout (like padding) • ... flutter.io
  9. 20.
  10. 21.
  11. 28.

    Stateful Widget These one have a state and can change.

    When the state values changes, the Widget will be redrawn on the screen.
  12. 29.
  13. 33.

    Unit testing Tests are run on local Dart VM with

    a headless version of the Flutter Engine
  14. 39.
  15. 44.
  16. 47.

    widget = new Padding( padding: new EdgeInsets.all( 32.0), child: new

    Column(children: <Widget>[ new Flexible( child: new FirebaseAnimatedList( query: reference, sort: (a, b) => b. key.compareTo(a. key), padding: new EdgeInsets.all( 8.0), reverse: true, itemBuilder: (context, DataSnapshot snapshot, Animation<double> animation,int x) { //new return new Quote( snapshot: snapshot, animation: animation ); }, ), ), new Align( alignment: const Alignment(0.0, -0.2), child: new FloatingActionButton( child: const Icon(Icons. add), onPressed: () { Navigator. of(context).pushNamed( '/add'); }, ), ), ], ), );
  17. 48.

    new Form( key: _formKey, autovalidate: _autovalidate, onWillPop: _warnUserAboutInvalidData, child: new

    ListView( padding: const EdgeInsets.symmetric(horizontal: 16.0), children: <Widget>[ new TextFormField( decoration: const InputDecoration( icon: const Icon(Icons. person), hintText: 'Author', labelText: 'author *', ), onSaved: (String value) { _author = value; }, validator: _validateName,), new TextFormField( decoration: const InputDecoration( icon: const Icon(Icons. note), hintText: 'Your quote', labelText: 'Quote',), maxLines: 3, keyboardType: TextInputType. emailAddress, onSaved: (String value) { _quote = value; }, validator: _validateName,), new Container( alignment: Alignment. center, padding: const EdgeInsets.symmetric(vertical: 16.0), child: new RaisedButton( child: const Text('ADD'), onPressed: _handleSubmitted,),),],),),
  18. 50.

    bool _IsLoading; bool Logged; State _IsLoading _IsLoading true false Logged

    true impossible quotes Logged false progress login