vibração remover botão voltar na barra de aplicativos

119

Gostaria de saber se alguém sabe de uma maneira de remover o botão Voltar que aparece appBarem um aplicativo flutter quando você usa Navigator.pushNamedpara ir para outra página. O motivo pelo qual não o quero nesta página resultante é que ele vem da navegação e quero que os usuários usem o logoutbotão, para que a sessão seja reiniciada.

Robert
fonte

Respostas:

141

Você pode remover o botão Voltar passando um vazio new Container()como o leadingargumento para seu AppBar.

No entanto, se você estiver fazendo isso, provavelmente não deseja que o usuário possa pressionar o botão Voltar do dispositivo para voltar à rota anterior. Em vez de ligar pushNamed, tente ligar Navigator.pushReplacementNamedpara fazer com que a rota anterior desapareça.

O exemplo de código completo para a última abordagem está abaixo.

import 'package:flutter/material.dart';

class LogoutPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Logout Page"),
      ),
      body: new Center(
        child: new Text('You have been logged out'),
      ),
    );
  }

}
class MyHomePage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Remove Back Button"),
      ),
      floatingActionButton: new FloatingActionButton(
        child: new Icon(Icons.fullscreen_exit),
        onPressed: () {
          Navigator.pushReplacementNamed(context, "/logout");
        },
      ),
    );
  }
}

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      home: new MyHomePage(),
      routes: {
        "/logout": (_) => new LogoutPage(),
      },
    );
  }
}
Collin Jackson
fonte
Sim, eu confundi meus comandos. Vou tentar, Obrigado pela sua ajuda.
Robert
2
@Collin, pushReplacementNamed não parece remover a possibilidade de voltar com a seta para trás do sistema.
Jackpap de
@Collin Jackson, pushReplacementNamed()descarta o widget de tela anterior (e todos os dados e estados dependentes)?
Dmitriy Blokhin
@Jackpap é porque realmente mostra a seta se houver uma rota anterior. Se for o único caminho, não há nada para onde voltar. No seu caso, use o método Container () vazio.
ThinkDigital
1
O método de recipiente vazio parece resultar em um espaço onde o botão Voltar estaria, então o título da Appbar é movido ligeiramente. Ainda não é um método ideal.
Hasen
291

Eu acredito que as soluções são as seguintes

Você na verdade:

  • Não queira exibir aquele botão voltar feio (:]) e, portanto, vá para AppBar(...,automaticallyImplyLeading: false,...):;

  • Não quer que o usuário volte - substituindo a visão atual - e, portanto, vá para Navigator.pushReplacementNamed(## your routename here ##):;

  • Não quer que o usuário volte - substituindo uma determinada visão de volta na pilha - e, portanto, use: Navigator.pushNamedAndRemoveUntil(## your routename here ##, f(Route<dynamic>)→bool); onde f é uma função que retorna trueao encontrar a última visão que você deseja manter na pilha (logo antes da nova);

  • Não quero que o usuário volte - SEMPRE - esvaziando completamente a pilha do navegador com: Navigator.pushNamedAndRemoveUntil(context, ## your routename here ##, (_) => false);

Felicidades

Fabio Veronese
fonte
8
Essa era a resposta que eu procurava! pushReplacementNamed () não estava funcionando para mim, mas o usuário voltando SEMPRE é o que acabou funcionando! Obrigado!
s.bridges de
1
na verdade, esta é a melhor resposta.
Jay Jeong
Obrigado, tive que usar "pushReplacementNamed" em vez de "popAndPushNamed"
camillo777
155

Uma maneira simples de remover o botão Voltar no AppBar é definir automaticallyImplyLeadingcomo false.

appBar: AppBar(
  title: Text("App Bar without Back Button"),
  automaticallyImplyLeading: false,
),
Jackpap
fonte
Obrigado por simples
Qutbuddin Bohra
Embora seja simples de implementar, para o cenário fornecido, Navigator.pushReplacementNamedé a solução correta. O que você sugere é uma solução alternativa que, se aplicada em todos os cenários, pode eventualmente inferir um comportamento errado, como em algum lugar que alguém gostaria que AppBarcontinue a implicar no comportamento de liderança (ex .: botão de navegação voltar)
Guilherme Matuella 13/08
35

Só quero adicionar alguma descrição sobre a resposta de @Jackpap:

automaticImplyLeading:

Isso verifica se queremos aplicar o widget de volta (widget principal) sobre a barra de aplicativos ou não. Se o automaticImplyLeading for false, então automaticamente espaço será dado ao título e se o widget principal for true, então este parâmetro não tem efeito.

void main() {
  runApp(
    new MaterialApp(
      home: new Scaffold(
        appBar: AppBar(
          automaticallyImplyLeading: false, // Used for removing back buttoon. 
          title: new Center(
            child: new Text("Demo App"),
          ),
        ),
        body: new Container(
          child: new Center(
            child: Text("Hello world!"),
          ),
        ),
      ),
    ),
  );
}  
jitsm555
fonte
4

// se você deseja ocultar o botão Voltar, use o código abaixo

class SecondScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: Text('Remove Back Button'),
    
    //hide back button
    automaticallyImplyLeading: false,
   ),
  body: Center(
    child: Container(),
  ),
);
}
}

// se você deseja ocultar o botão Voltar e parar a ação pop, use o código abaixo

class SecondScreen extends StatelessWidget {

@override
Widget build(BuildContext context) {
 return new WillPopScope(

  onWillPop: () async => false,
  child: Scaffold(
    appBar: AppBar(
      title: Text("Second Screen"),
      //For hide back button
      automaticallyImplyLeading: false,
    ),
    body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            RaisedButton(
              child: Text('Back'),
              onPressed: () {
                Navigator.pop(context);
              },
            ),
          ],
        )
    ),
  ),
);
 }

[

ShigaSuresh
fonte
3

O widget AppBar tem uma propriedade chamada automaticallyImplyLeading. Por padrão, seu valor é true. Se você não quiser vibração, crie automaticamente o botão Voltar para você, basta fazer a propriedade false.

appBar: AppBar(
  title: Text("YOUR_APPBAR_TITLE"), 
  automaticallyImplyLeading: false,
),

Para adicionar seu botão Voltar personalizado

appBar: AppBar(
  title: Text("YOUR_APPBAR_TITLE"), 
  automaticallyImplyLeading: false,
  leading: YOUR_CUSTOM_WIDGET(),
),
Ahammed Hossain Shanto
fonte
0

Use isso para fitas AppBar

SliverAppBar (
        automaticallyImplyLeading: false,
        elevation: 0,
        brightness: Brightness.light,
        backgroundColor: Colors.white,
        pinned: true,
      ),

Use isto para Appbar normal

 appBar: AppBar(
    title: Text
    ("You decide on the appbar name"
    style: TextStyle(color: Colors.black,), 
    elevation: 0,
    brightness: Brightness.light,
    backgroundColor: Colors.white,
    automaticallyImplyLeading: false,

),
Desconto Kobby
fonte
-1

Se estiver navegando para outra página. Navigator.pushReplacement()pode ser usado. Ele pode ser usado se você estiver navegando do login para a tela inicial. Ou você pode usar.
AppBar(automaticallyImplyLeading: false)

SR Keshav
fonte
-2
  appBar: new AppBar(title: new Text("SmartDocs SPAY"),backgroundColor: Colors.blueAccent, automaticallyImplyLeading:false,
        leading: new Container(),
      ),

Está funcionando bem

siva
fonte
precisamos fornecer o líder: nova tag Container ()
siva