[flutter] Scaffold에서 SnackBar의 내용과 액션을 변경하는 방법은 어떻게 되나요?

12 Dec 2023

flutter

먼저, ScaffoldMessenger를 사용하여 SnackBar를 표시합니다. 그런 다음 SnackBar의 상태를 관리하고, 변경할 때마다 상태를 갱신합니다. SnackBar의 내용 또는 액션을 변경하려면 상태를 변경하는 함수를 호출하고 이를 바탕으로 SnackBar가 업데이트됩니다.

아래는 간단한 예시 코드입니다.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<ScaffoldMessengerState> _scaffoldMessengerKey = GlobalKey<ScaffoldMessengerState>();

  String snackBarMessage = 'Initial Message';
  String actionText = 'Initial Action';

  void showCustomSnackBar() {
    _scaffoldMessengerKey.currentState!.showSnackBar(
      SnackBar(
        content: Text(snackBarMessage),
        action: SnackBarAction(
          label: actionText,
          onPressed: () {
            // Your action logic here
          },
        ),
      ),
    );
  }

  void updateSnackBarContent() {
    setState(() {
      snackBarMessage = 'Updated Message';
      actionText = 'Updated Action';
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldMessengerKey,
      appBar: AppBar(
        title: Text('SnackBar Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            showCustomSnackBar();
          },
          child: Text('Show SnackBar'),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          updateSnackBarContent();
        },
        child: Icon(Icons.edit),
      ),
    );
  }
}

위의 예시 코드에서는 ScaffoldMessenger를 사용하여 SnackBar를 표시하고 있으며, 상태를 관리하여 SnackBar의 내용과 액션을 업데이트하고 있습니다.

자세한 내용은 Flutter 공식 문서를 참고하시기 바랍니다.