Как создать и использовать SnackBar для ReUse (глобально) в Flutter - PullRequest
Новая
       11

Как создать и использовать SnackBar для ReUse (глобально) в Flutter

1 голос
/ 20 февраля 2020

Я хочу создать SnackBar для многоразового использования (глобально)

Я уже создан, но это только для 1 страницы, я не знаю, как создать для повторного использования .

ниже кода: 

import 'package:flutter/material.dart';

class SnackBarMain extends StatefulWidget {
  @override
  _SnackBarMainState createState() => _SnackBarMainState();
}

class _SnackBarMainState extends State<SnackBarMain> {
  final globalKey = GlobalKey<ScaffoldState>();
  String title = 'SnackBar';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: globalKey,
      resizeToAvoidBottomPadding: false,
      appBar: AppBar(
        centerTitle: true,
        title: Text(title),
      ),
      body: Center(
        child: RaisedButton(
          shape: new RoundedRectangleBorder(
              borderRadius: new BorderRadius.circular(18.0),
              side: BorderSide(color: Colors.purple)),
          onPressed: () => snackBarMsg(context),
          color: Colors.purple,
          textColor: Colors.white,
          child: Text("SnackBar",
              style: TextStyle(fontSize: 18)),
        ),
      ),
    );
  }

snackBarMsg(BuildContext context) {
    final sb = SnackBar(
      elevation: 0.0,
      //behavior: SnackBarBehavior.floating,
      content: Text('SnackBar Bottom Message'),
      duration: new Duration(seconds: 5000000),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.only(
            topLeft: Radius.circular(16.0), topRight: Radius.circular(16.0)),
      ),
      //backgroundColor: Colors.redAccent,
      action: SnackBarAction(
        textColor: Color(0xFFFAF2FB),
        label: 'OK',
        onPressed: () {},
      ),
    );
    globalKey.currentState.showSnackBar(sb);
  }
}

поэтому, пожалуйста, приведите пример для этого

Ответы [ 3 ]

2 голосов
/ 20 февраля 2020

Просто создайте класс publi c и поместите в него свои пользовательские функции, вот вам go, например: 

//Custom class in project directory
class CustomWidgets {
 CustomWidgets._();
 static buildErrorSnackbar(BuildContext context, String message) {
  Scaffold.of(context)
     .showSnackBar(
    SnackBar(
      content: Text("$message"),
    ),
  );
 }
}

 // This is any page in your project

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
     backgroundColor: Colors.white,
      //        Always create body with Builder method so you can 
      //        get exact context to pass
      body: Builder(
      builder: (context) =>
          Center(
              child: RaisedButton(
              color: Colors.pink,
              textColor: Colors.white,
              onPressed: (){
                CustomWidgets.buildErrorSnackbar(context,"Your message here");
              },
              child: Text('Display SnackBar'),
          ),
         ),
     ),
  );
 }
}
1 голос
/ 20 февраля 2020

У вас может быть class, у которого есть метод c * * * * * * *, который получает context и показывает snackbar. Проверьте код ниже. 

class GlobalSnackBar {
  final String message;

  const GlobalSnackBar({
    @required this.message,
  });

  static show(
    BuildContext context,
    String message,
  ) {
    Scaffold.of(context).showSnackBar(
      SnackBar(
        elevation: 0.0,
        //behavior: SnackBarBehavior.floating,
        content: Text(message),
        duration: new Duration(seconds: 5000000),
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.only(
              topLeft: Radius.circular(16.0), topRight: Radius.circular(16.0)),
        ),
        //backgroundColor: Colors.redAccent,
        action: SnackBarAction(
          textColor: Color(0xFFFAF2FB),
          label: 'OK',
          onPressed: () {},
        ),
      ),
    );
  }
}

И вы можете вызвать его из любого места, например так: 

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      child: Text('SHOW Snackbar'),
      onPressed: () => GlobalSnackBar.show(context, 'Test'),
    );
  }
}

Помните, что context, который вы передаете методу show(), должен быть потомок от Scaffold, чтобы показать SnackBar

0 голосов
/ 20 февраля 2020

Вы можете использовать Snackbar, который вы уже определили, чтобы использовать его повсюду, поместив его в общую папку c, к которой можно получить доступ из любой точки вашего приложения. Вам не нужно заключать его в виджет или класс. Затем вы можете показать это, позвонив по номеру Scaffold.of(context).showSnackBar(...). Для этого вам, конечно, нужно будет передать текущий BuildContext. Таким образом, до тех пор, пока у context, с которого вы звоните showSnackBar, есть родительский элемент Scaffold, для вашей текущей страницы будет отображаться снэк-бар, и вы можете сделать это из любого места.

Рассмотрим пример, который я сам использовал в прошлом: 

  void buildErrorSnackbar(BuildContext context) {
    Scaffold.of(context).showSnackBar(
      SnackBar(
        content: Text("Oops! Something went wrong."),
      ),
    );
  }
...