[Flutter]Text 위젯

들어가며

Flutter 기본 포스팅을 하면서 맨 처음 다루게 될 위젯은 Text위젯입니다. 위젯이란 무엇인가요? 모바일 화면에 보여지는 모든 것을 위젯이라고 합니다. 어플리케이션은 결국 위젯의 집합인 셈이죠. 그 중 가장 기초가 되는 위젯 Text위젯에 대해서 이야기해보겠습니다.

Text위젯

화면에 글자를 랜더하고 싶습니다. 그럴 때 이용하는 위젯이 바로 Text위젯입니다. 단독으로 사용하는 경우도 많지만, 다른 위젯에 child프러퍼티로 사용되는 경우가 있습니다. 그러니까 잘 알아둬야 자유자재로 다룰 수 있겠죠??

Text위젯의 속성

Text위젯의 속성은 다양합니다. 가장 기본으로 String형 data가 필수이고, 나머지 속성은 기본값이 존재하거나, 입력하지 않아도 됩니다.

//...
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      child: Text(data),
    );
  }
//...

속성 중에서 가장 많이 사용하는 style속성을 알아보겠습니다. 나머지 속성은 pub.dev 사이트에서 확인 가능합니다.

style 속성

style 속성은 textStyle을 이용해서 data의 글꼴, 굵기, 색상, 폰트 사이즈 등을 조절할 수 있습니다. 예시를 보면 쉽게 이해할 수 있습니다.

Text(
              "Hello World!",
              style: TextStyle(
                  fontSize: 30, //글자 크기 조절
                  color: Colors.amber, //글자 색상 조절
                  fontStyle: FontStyle.italic, //글꼴 조절
                  fontWeight: FontWeight.bold), //글꼴 굵기 조절
            )