[Widget] AppBar 사용법

 

 

AppBar는 Widget 내에서 최상단에 위치해있는 Widget이다.

설명하기전에 먼저 예시를 보여주자면,

AppBar 미적용

AppBar 적용

가장 간단하게 구현해보았고, 흔히들 앱 내 페이지에서 많이들 쓰는 형태이다.

 

return Scaffold(
        appBar: AppBar(
          title: Text("AppBar Test"), // 가운데 보여지는 제목
          centerTitle: true, // true: 제목 가운데 정렬 여부
          leading: IconButton( // leading: 상단 좌측
            icon: Icon(Icons.arrow_back),
            onPressed: () {},
          ),
          actions: [ // actions: 상단 우측
            IconButton(
              icon: Icon(Icons.home),
              onPressed: () {},
            ),
          ],
        ),
        body: 

이런식으로 구현해주면 된다. 코드 내에 설명을 적어놔서 따로 설명 할 내용은 없을듯하다.

추가적으로 background 옵션을 주면 AppBar의 배경 색상도 변경 가능하다.

AppBar 관련되서 궁금하신 사항 있으신 분들 댓글주세요~

 

끝!