본문 바로가기
반응형

expanded6

플러터에서 Flexible 위젯 사용법 및 Expanded와의 차이점 Flexible 위젯은 플러터(Flutter)에서 Flex 계열 위젯(Row, Column, Flex) 내에서 자식 위젯의 크기를 조정할 때 유용하게 사용하는 도구입니다.Flexible 위젯은 Expanded 위젯과 유사한 역할을 하지만, 크기 조정에 좀 더 세밀한 제어를 제공합니다.이 포스트에서는 Flexible 위젯의 기본 개념과 사용법, 그리고 Flexible과 Expanded의 차이점에 대해 자세히 다루겠습니다. 1. Flexible 위젯의 기본 개념Flexible 위젯은 자식 위젯이 부모 위젯 내에서 남는 공간을 차지하도록 도와줍니다.Flex 계열 위젯(Row, Column, Flex) 내에서 자식 위젯의 크기를 조정할 때 사용됩니다.Flexible은 Expanded와 유사하게 자식 위젯이 부모.. 2024. 8. 6.
플러터 Flex와 Expanded의 차이점 및 적절한 사용법 플러터(Flutter)에서 레이아웃을 구성할 때 Flex와 Expanded는 매우 중요한 위젯입니다.이 두 위젯은 유사해 보이지만, 사용 방법과 역할에서 중요한 차이점이 있습니다.이 포스트에서는 Flex와 Expanded의 차이점을 설명하고, 각각의 적절한 사용 방법에 대해 다룹니다.1. Flex와 Expanded란?Flex: 자식 위젯들을 주어진 축(Axis)을 따라 배치하는 컨테이너 위젯입니다. Row와 Column 위젯의 기반이 되는 더 일반적인 형태로, 수평(Axis.horizontal) 또는 수직(Axis.vertical) 방향으로 레이아웃을 구성할 수 있습니다.Expanded: Flex 계열 위젯(Row, Column, Flex)의 자식으로 사용되며, 남는 공간을 적절히 채우는 역할을 합니다... 2024. 8. 6.
플러터 Expanded 위젯 사용법 및 옵션 완벽 가이드 플러터에서 레이아웃을 구성할 때 자주 사용되는 위젯 중 하나는 바로 Expanded 위젯입니다.Expanded 위젯은 잔여 공간을 채우도록 자식 위젯을 확장하는 데 사용되며, 특히 Row나 Column과 함께 사용하면 효과적입니다.이 블로그 글에서는 Expanded 위젯의 사용법과 주요 옵션들을 자세히 살펴보고, 실제 코드 예시와 함께 다양한 활용 방법을 알아보겠습니다. 1. Expanded 위젯 사용법 Expanded 위젯은 단독으로 사용할 수 없으며, 반드시 Row나 Column과 함께 사용해야 합니다.Expanded 위젯을 사용하면, 잔여 공간을 자식 위젯이 차지하도록 합니다.즉, Row나 Column의 자식 위젯들 중 Expanded 위젯으로 감싸인 위젯만 잔여 공간을 채우게 됩니다. 기본 사용법.. 2024. 7. 24.
플러터에서 Row, Column, Vertical, Horizontal 차이와 사용법 가이드 플러터에서 레이아웃을 구성할 때 가장 기본적으로 사용하는 요소 중 하나는 바로 Row, Column, Vertical, Horizontal입니다.이 요소들은 모두 자식 위젯들을 특정 방향으로 배치하는 데 사용되지만, 미묘한 차이점과 사용 상황에 따라 적절하게 선택해야 합니다.이 블로그 글에서는 Row, Column, Vertical, Horizontal의 차이점을 명확하게 비교하고, 각 요소의 특징과 사용법, 그리고 언제 어떤 것을 선택해야 하는지에 대한 가이드를 제공합니다. 1. Row vs ColumnRow: 자식 위젯들을 가로 방향으로 왼쪽에서 오른쪽 순서대로 배치합니다. 마치 한 줄로 나열하는 것과 같습니다.Column: 자식 위젯들을 세로 방향으로 위에서 아래 순서대로 배치합니다. 마치 여러 줄.. 2024. 7. 24.
플러터 Column과 Row 위젯 사용법 완벽 가이드 플러터에서 레이아웃을 구성하는 데 가장 기본적인 위젯 중 하나는 바로 Column과 Row 위젯입니다.Column 위젯은 자식 위젯들을 세로 방향으로 나열하고, Row 위젯은 자식 위젯들을 가로 방향으로 나열하는 데 사용됩니다.이 블로그 글에서는 Column과 Row 위젯의 사용법과 주요 옵션들을 자세히 살펴보고, 실제 코드 예시와 함께 다양한 배치 구현 방법을 알아보겠습니다. 1. Column 위젯 Column 위젯은 자식 위젯들을 위에서 아래로 순서대로 배치합니다.기본적으로 자식 위젯들은 균등하게 공간을 차지하지만, mainAxisAlignment 속성을 사용하여 정렬 방식을 조정할 수 있습니다.또한, crossAxisAlignment 속성을 사용하여 자식 위젯들을 가로축 기준으로 정렬 방식을 조정할.. 2024. 7. 24.
플러터에서 반응형 디자인 구현하기 반응형 디자인은 다양한 화면 크기와 해상도에서 앱이 잘 보이도록 만드는 것을 의미해요.예를 들어, 핸드폰, 태블릿, 그리고 큰 모니터에서 모두 잘 작동하도록 만드는 거죠.플러터는 이를 쉽게 도와주는 도구들을 제공해요. 이 글에서는 초보자부터 고급 개발자까지 모두 이해할 수 있도록 단계별로 설명할게요.1. 기본 개념 이해하기반응형 디자인이란?반응형 디자인은 앱이 어떤 화면 크기에서도 잘 보이도록 만드는 것을 의미해요.작은 화면에서는 요소들이 작게 배치되고, 큰 화면에서는 요소들이 크게 배치되거나 추가적인 요소들이 나타날 수 있어요.MediaQuery 사용하기플러터에서는 MediaQuery 클래스를 사용하여 화면의 크기나 해상도 정보를 가져올 수 있어요.예를 들어, 다음 코드는 화면의 너비와 높이를 가져오는.. 2024. 7. 17.
반응형

티스토리툴바