[Flutter] 코딩쉐프 순한맛 강좌 14 - 메뉴 아이콘 추가하기

 

AppBar 위젯에서 사용하는 속성

• leading : 아이콘 버튼이나 간단한 위젯을 왼쪽에 배치할 때
• actions : 복수의 아이콘 버튼 등을 오른쪽에 배치할 때
• onPressed : 함수의 형태로 일반 버튼이나 아이콘 버튼을 터치했을 때 일어나는 이벤트를 정의

 

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'AppBar',
      theme: ThemeData(
        primarySwatch: Colors.red
      ),
      home: const MyPage(),
    );
  }
}

class MyPage extends StatelessWidget {
  const MyPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Appbar icon menu'),
        centerTitle: true,
        elevation: 0.0,
        leading: IconButton(
            onPressed: (){
              print("menu button is clicked");
            },
            icon: Icon(Icons.menu)
        ),
        actions: [
          IconButton(
              onPressed: (){
                print("shopping cart button is clicked");
              },
              icon: Icon(Icons.shopping_cart)
          ),
          IconButton(
              onPressed: (){
                print("Search button is clicked");
              },
              icon: Icon(Icons.search)
          ),
        ],
      ),
    );
  }
}

 

 

https://youtu.be/ze0t5gWKBvE?si=lCwLNd_YqqjWhuTt