방문해 주셔서 감사합니다.

텍스트 정렬 지정하기

이번에는 텍스트를 가운데 정렬해볼게요.

텍스트를 가운데로 정렬하기

정렬은 style에 종속되지 않습니다. style과 동등합니다.

textAlign속성을 사용하고 값으로 TextAlign.center를 사용합니다.

다음과 같이 적용합니다.

child: Text(
    'everdevel',
    style: TextStyle(fontSize: 20, color:Colors.white),
    textAlign: TextAlign.center,
),

그럼 적용해보면

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context){
    return MaterialApp(
      title: 'hello',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Container(
        color: Colors.red,
        child: Text(
            'everdevel',
            style: TextStyle(fontSize: 20, color:Colors.white),
            textAlign: TextAlign.center,
        ),
      ),
    );
  }
}

실행해 봅시다.

가운데로 정렬되었습니다.

왼쪽으로 정렬하거나 오른쪽으로 정렬하려면 어떻게 해야하는지 감이 오시죠?

center대신 left또는 right를 적습니다.

텍스트를 오른쪽으로 정렬하기

child: Text(
    'everdevel',
    style: TextStyle(fontSize: 20, color:Colors.white),
    textAlign: TextAlign.right,
),

그럼 적용해보면

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context){
    return MaterialApp(
      title: 'hello',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Container(
        color: Colors.red,
        child: Text(
            'everdevel',
            style: TextStyle(fontSize: 20, color:Colors.white),
            textAlign: TextAlign.right,
        ),
      ),
    );
  }
}

실행해 봅시다.

그런데 여전히 상단에 있어서 보기가 어렵네요.

다음에는 화면의 가운데에 출력해 봅시다.

봐주셔서 감사합니다. 문의 또는 잘못된 설명은 아래의 댓글에 부탁드립니다.
당신의 작은 누름이 저에게는 큰 희망이 됩니다.

컨텐츠의 내용을 더 보려면 바로 아래에서 확인할 수 있습니다.