[flutter] RichText 위젯의 텍스트 정렬 옵션

22 Dec 2023

flutter

RichText의 텍스트 정렬 옵션

RichText 위젯은 TextSpan을 사용하여 다양한 텍스트 스타일을 정의하고, 각 TextSpan은 textAlign 속성을 통해 텍스트 정렬을 지정할 수 있습니다. textAlign는 TextSpan의 생성자를 통해 지정할 수 있으며, TextAlign 열거형을 통해 left, right, center, justify 등의 정렬 옵션을 설정할 수 있습니다. 이를 통해 RichText를 사용하여 다양한 텍스트 정렬 스타일을 구현할 수 있습니다.

아래는 RichText를 사용하여 텍스트 정렬 옵션을 설정하는 간단한 예제 코드입니다.

RichText(
  text: TextSpan(
    text: 'Example text',
    style: TextStyle(
      fontSize: 20.0,
      color: Colors.black,
    ),
    children: <TextSpan>[
      TextSpan(
        text: 'with different alignments\n',
        style: TextStyle(
          fontSize: 16.0,
          color: Colors.grey,
          fontWeight: FontWeight.bold,
          fontStyle: FontStyle.italic,
          decoration: TextDecoration.underline,
        ),
      ),
      TextSpan(
        text: 'center aligned',
        style: TextStyle(
          fontSize: 18.0,
          color: Colors.blue,
          fontWeight: FontWeight.normal,
          fontStyle: FontStyle.normal,
          decoration: TextDecoration.none,
        ),
        textAlign: TextAlign.center,
      ),
      TextSpan(
        text: 'right aligned',
        style: TextStyle(
          fontSize: 18.0,
          color: Colors.green,
          fontWeight: FontWeight.normal,
          fontStyle: FontStyle.normal,
          decoration: TextDecoration.none,
        ),
        textAlign: TextAlign.right,
      ),
    ],
  ),
)

위 예제에서는 RichText를 사용하여 서로 다른 정렬 스타일을 갖는 텍스트를 구성하는 방법을 보여줍니다. 이를 활용하면 보다 다채로운 텍스트 표시 스타일을 구현할 수 있습니다.

RichText 위젯의 텍스트 정렬과 관련된 속성에 대한 자세한 정보는 Flutter 공식 문서를 참조하시기 바랍니다.