Flutter - 6.1 AppBar

이제부터는 웹툰앱을 만드는 프로젝트가 시작되었다.

니꼬쌤이 직접 만든 api를 이용해서 만들 것이라고 함.
이번에는 AppBar를 이용해서 제목을 만들었다.
AppBar에는 아주 많은 옵션이 있으니... 나중에 사용할 때마다 대충 찾아보자.

딱히 특별한 것은 없어서 전체 코드를 첨부한다.

main.dart

import 'package:flutter/material.dart';

import 'package:toonflix/screens/home_screen.dart';

void main() {

  runApp(const App());

}

class App extends StatelessWidget {

  // 이 위젯의 key를 stateless widget이라는 슈퍼클래스에 보낸 것임.

  const App({super.key});

  // 위젯은 ID같은 식별자 역할을 하는 key가 있다.

  // 이걸로 Flutter가 위젯을 빠르게 찾는 것임.

  // 사실 상관 없음.

  @override

  Widget build(BuildContext context) {

    return const MaterialApp(

      home: HomeScreen(),

    );

  }

}

./screens/home_screen.dart

import 'package:flutter/material.dart';

class HomeScreen extends StatelessWidget {

  const HomeScreen({super.key});

  @override

  Widget build(BuildContext context) {

    return Scaffold(

      backgroundColor: Colors.white,

      appBar: AppBar(

        //그림자를 줄일 수 있음

        elevation: 2,

        surfaceTintColor: Colors.white,

        shadowColor: Colors.black,

        foregroundColor: Colors.green,

        centerTitle: true,

        title: const Text(

          "오늘의 웹툰",

          style: TextStyle(fontSize: 24),

        ),

      ),

    );

  }

}