티스토리 뷰

[Flutter] Container 가운데 정렬하기

 

넓이가 지정된 Container를 디스플레이하면 좌측정렬된 상태로 나온다.

 

...

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: 300,
        height: 300,
        decoration: const BoxDecoration(
          color: Colors.lightBlueAccent,
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () => {},
              child: const Text("Button")
            )
          ],
        ),
      )
    );
  }

...

 

 

이럴 때 Center 위젯으로 감싸주면 Container 위젯이 가운데 정렬되어 디스플레이 된다.

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
          width: 300,
          height: 300,
          decoration: const BoxDecoration(
            color: Colors.lightBlueAccent,
          ),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ElevatedButton(
                onPressed: () => {},
                child: const Text("Button")
              )
            ],
          ),
        ),
      )
    );
  }

 

공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
«   2024/07   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31
글 보관함