[Flutter] markdown Viewer 만들기

 

Markdown viewer 를 만들기 위해서는 라이브러리를 받아야한다. 

 

https://pub.dev/packages/flutter_markdown

flutter_markdown | Flutter Package

 

flutter pub add flutter_markdown

 

적용법은 매우 간단하다. 

Markdown(data: 'markdown String here')

 

커스텀 디자인은 어떻게 할 수 있을까?

 styleSheet: MarkdownStyleSheet()

 

이렇게 styleSheet 인자에 MarkdownStyleSheet를 넘겨주면 된다. 

styleSheet: MarkdownStyleSheet(
    h1: const TextStyle(
        fontSize: 24, color: Colors.red, fontWeight: FontWeight.w700),
    h2: const TextStyle(color: Colors.pink, fontSize: 30),
  ),

 

전체 코드는 아래와 같다. 

적용 되지 않는 문법들도 존재하니, 꼭 공식문서를 확인해보기를 바란다. 

 

적용 가능한 objects는 뭐가 있을까

위 사진을 참고하여 다양한 스타일을 적용해 보면 될 것 같다!