【Flutter】AppBarの戻るボタンを非表示|画面遷移すると勝手に表示される

今回はNavigatorなどを使って画面遷移するとAppBarのleadingに自動的に表示されてしまう「戻るボタン」を非表示にする方法を紹介します。

AppBarの戻るボタンを非表示にするにはautomaticallyImplyLeadingを使用します。

\ 世界最大級のオンライン学習サービス /

目次

AppBarの戻るボタンを非表示にする

AppBar(
  title: Text('Screen1'),
  automaticallyImplyLeading: false,
),

画面遷移するとAppBarに戻るボタンが表示されないようにするにはautomaticallyImplyLeadingfalseにします。

サンプルコード

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Screen1()));

class Screen1 extends StatelessWidget {
  const Screen1({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Screen1'),
        automaticallyImplyLeading: false,
      ),
      body: Center(
        child: ElevatedButton(
          child: Text('Screen2'),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => const Screen2(),
              ),
            );
          },
        ),
      ),
    );
  }
}

class Screen2 extends StatelessWidget {
  const Screen2({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Screen2'),
        automaticallyImplyLeading: false,
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: const Text('Screen1'),
        ),
      ),
    );
  }
}

一緒に読みたい

  • URLをコピーしました!
目次