[Widget] SnackBar

SnackBar는 크게 content, duration, action 3개의 속성을 주로 쓴다. 그 외에 여러가지 속성들이 있지만 오늘은 이 3개 속성만을 사용하여 SnackBar를 구현해보도록 하자.

content의 경우 상위 BuildContext에 있는 객체를 그대로 가져온다고 생각하면 된다.
content는 실제 SnackBar의 내용이라고 생각하면 된다. Text만이 아니라 Widget 개념으로 되어 있기 때문에 Icon이나 Button 등도 구현이 가능하다.

duration은 SnackBar가 노출되는 시간이다.

action은 추가로 작업을 넣는다고 생각하면 된다.

 

SnackBar 예시

위에 설명을 토대로 간단하게 구현해보았다.

저기에서 Duration을 주면 설정한 시간이 지난 뒤 자동으로 SnackBar는 사라지게 된다.

 

ScaffoldMessenger.of(context).showSnackBar(
    SnackBar(
      content: Text('사용할 수 있는 권한이 없습니다.', textScaleFactor: 2.0,  overflow: TextOverflow.ellipsis,
        maxLines: 1, style: TextStyle(fontSize: 9),), // Widget
      duration: Duration(seconds: 2), // 설정 시간
      action: SnackBarAction( 
        label: '닫기', 
        textColor: Colors.white,
        onPressed: (){}, 
      ),
    )
);

예제 코드는 이렇다.

 

끝!