ModalRoute

Skapa dart fil och class AppModal som ska användas i hela appen

import 'package:flutter/material.dart';

class AppModal extends ModalRoute<void> {

  @override
  Duration get transitionDuration => Duration(milliseconds: 300);

  @override
  bool get opaque => false;

  @override
  bool get barrierDismissible => false;

  @override
  Color get barrierColor => Colors.black.withOpacity(0.7);

  @override
  String get barrierLabel => null;

  @override
  bool get maintainState => true;

  @override
  Widget buildPage(
      BuildContext context,
      Animation<double> animation,
      Animation<double> secondaryAnimation
      ) {
    return Material(
      type: MaterialType.transparency,
      child: SafeArea(
        child: _buildOverLay(context),
      ),
    );
  }

  _buildOverLay(BuildContext context) {
    return Center(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          new Container(
            margin: EdgeInsets.symmetric(horizontal: 20.0),
            height: 300.0,
            width: MediaQuery.of(context).size.width,
            color: Colors.white,
            child: new TextField(
                decoration: InputDecoration(
                    contentPadding: EdgeInsets.all(15),
                    border: InputBorder.none,
                    hintText: 'Skriv meddelandet...'
                ),
                maxLines: 10,
                keyboardType: TextInputType.multiline,
                // controller: _controller,
                style: new TextStyle(
                    fontSize: 16.0,
                    height: 1.2,
                    color: Colors.black,
                    letterSpacing: 2
                )
            ),
          ),
        ],
      ),
    );
  }
}

För att visa modal

child: RaisedButton(
    child: Text('Show modal'),
    onPressed: () {
    Navigator.of(context).push(AppModal());
    },
),

Lämna ett svar

Stäng meny