[Flutter] AppBar 커스텀 클래스로 만들기 / 그림자 제거

PreferredSizeWidget

PreferredSizeWidget은 Flutter에서 사용되는 위젯 클래스

→ 화면의 크기 및 위치와 관련된 정보를 제공하는 위젯이다.

• PreferredSizeWidget을 구현한 위젯은 PreferredSize를 통해 화면 크기를 정의할 수 있다.

주로 PreferredSizeWidget은 AppBar와 같은 상단 앱 바, SliverAppBar와 같은 스크롤 가능한 상단 앱 바 및 기타 커스텀 위젯에서 사용된다. 이를 통해 해당 위젯의 크기를 정확하게 제어하고 다른 위젯과의 상호작용을 관리할 수 있다.

PreferredSizeWidget을 구현할 때, PreferredSize 클래스를 사용하여 위젯의 높이를 지정한다. 예를 들어, AppBar의 높이는 kToolbarHeight 상수를 사용하여 설정한다. 이렇게 함으로써 앱 바의 높이를 표준화하고 일관된 디자인을 유지할 수 있다.

AppBar 커스텀 클래스로 만들기

class CGAppBar extends StatelessWidget implements PreferredSizeWidget {
  final String? title;
  final List<Widget> actions;
  final Widget? leading;

  const CGAppBar(
      {super.key, this.title, this.leading, this.actions = const []});

  @override
  Widget build(BuildContext context) {
    return AppBar(
      title: title != null
          ? Text(title!,
              style: CGTextStyle.subtitle1.copyWith(color: CGColor.text_1st))
          : null,
      leading: leading,
      actions: actions,
      backgroundColor: Colors.transparent,
    );
  }

  @override
  Size get preferredSize => const Size.fromHeight(kToolbarHeight);
}

AppBar 그림자? 없애기

return AppBar(
      title: title != null
          ? Text(title!,
              style: CGTextStyle.subtitle1.copyWith(color: CGColor.text_1st))
          : null,
      leading: leading,
      actions: actions,
      **backgroundColor: Colors.transparent,
      bottomOpacity: 0.0,
      elevation: 0.0,
      scrolledUnderElevation: 0,**
);