2025-10-16

Stack 위젯

Stack

  • 위젯을 서로 겹쳐서 배치할 때 사용하는 위젯이다.
  • 자식 위젯들을 자유롭게 겹치거나 위치를 조정할 수 있다.

Positioned

  • Stack의 자식 위젯을 top, bottom, left, right 등의 속성을 이용해 원하는 위치에 배치할 수 있다.
  • Stack과 함께 쓰면 유연한 UI 레이아웃 구성이 가능하다.

Opacity

  • 위젯의 투명도를 조절할 수 있다.
  • 0.0은 완전히 투명, 1.0은 불투명이다.
  • Stack과 함께 쓰면 겹친 위젯의 표현을 부드럽게 조절할 수 있다.


페이지 라우팅 시 데이터 전달 방법

  1. settings.arguments 사용
    • Navigator.pushNamed로 페이지를 이동할 때 arguments 속성에 데이터를 담아서 보낸다.
    • 이동한 페이지에서는 ModalRoute.of(context)?.settings.arguments로 데이터를 꺼낸다.
  2. 생성자를 통해 넘겨주기
    • 페이지 이동 시 생성자 매개변수를 통해 직접 데이터를 전달한다.
    • 가장 직관적이고 많이 사용되는 방식이다.


RichText 위젯

  • 하나의 텍스트 영역에 다양한 스타일을 적용할 수 있는 위젯이다.
  • 여러 개의 TextSpan을 조합해 한 문장 안에서 색상, 폰트, 굵기 등을 다르게 표현할 수 있다.
  • 예를 들어 특정 단어만 색상을 다르게 하거나 강조할 때 유용하다.


Theme.of(context).textTheme

  • 현재 적용된 테마에서 TextTheme에 접근할 수 있는 메서드다.
  • 전역적으로 지정된 폰트, 색상, 스타일을 그대로 가져와 사용할 수 있다.
  • 개별 위젯마다 스타일을 지정하지 않아도 앱 전체의 통일된 텍스트 스타일을 유지할 수 있다.




회고

  오늘은 Stack과 Positioned, Opacity를 사용한 레이아웃 제어 방법과 페이지 라우팅 시 데이터 전달 방식을 정리했다.

태그:

카테고리:

업데이트: