본문 바로가기
반응형

Widget31

플러터에서 Text 위젯 종류와 사용 방법 옵션 플러터에서 텍스트를 표시하는 데 가장 기본적인 위젯은 Text 위젯입니다.Text 위젯은 다양한 속성과 옵션을 제공하여 텍스트를 원하는 대로 표시할 수 있도록 합니다. 1. 기본 속성data: 표시할 텍스트 문자열을 지정합니다.style: 텍스트 스타일을 지정합니다. (글꼴, 크기, 색상, 정렬 등)textAlign: 텍스트 정렬 방식을 지정합니다. (시작, 중앙, 끝, 정렬)maxLines: 표시할 최대 줄 수를 지정합니다.overflow: 텍스트가 최대 줄 수를 초과할 때 처리 방식을 지정합니다. (ellipsis, clip, visible)softWrap: 텍스트가 줄 바꿈될 때 처리 방식을 지정합니다. (normal, hardWrap, wordWrap)2. 스타일 속성fontFamily: 글꼴 이.. 2024. 7. 17.
플러터에서 IconButton 사용하기: 가이드 및 팁 IconButton는 Flutter에서 아이콘과 버튼 기능을 결합한 유용한 위젯입니다. 터치 가능한 아이콘을 간편하게 만들고, 다양한 스타일링과 기능을 제공하여 사용자 인터페이스를 풍부하게 만들 수 있습니다.이 블로그에서는 Flutter에서 IconButton를 사용하는 방법, 주요 속성, 사용 팁, 실제 코드 예시 등을 자세히 살펴보겠습니다.1. IconButton 기본 사용IconButton를 사용하려면 먼저 material.dart 라이브러리를 import해야 합니다.import 'package:flutter/material.dart'; IconButton 위젯은 다음과 같은 기본 구조를 가지고 있습니다:IconButton( onPressed: () { // 버튼 클릭 시 실행할 코드 },.. 2024. 7. 17.
플러터에서 TextButton 사용하기: 가이드 및 활용 예시 TextButton은 Flutter에서 간단하고 세련된 버튼을 만드는 데 사용되는 유용한 위젯입니다.텍스트와 색상을 사용하여 버튼을 디자인하고, 다양한 기능과 속성을 제공하여 사용자 인터페이스를 풍부하게 만들 수 있습니다.이 블로그에서는 Flutter에서 TextButton의 사용법, 주요 속성, 사용 팁, 실제 활용 예시 등을 자세히 살펴보겠습니다.1. TextButton 기본 사용TextButton을 사용하려면 먼저 material.dart 라이브러리를 import해야 합니다.import 'package:flutter/material.dart'; TextButton 위젯은 다음과 같은 기본 구조를 가지고 있습니다. TextButton( onPressed: () { // 버튼 클릭 시 실행할 코.. 2024. 7. 17.
플러터에서 FAB 확장이란? FloatingActionButton(FAB) FAB 확장은 FloatingActionButton(FAB) 위젯을 확장하여 여러 개의 액션 버튼을 표시하는 기능입니다.주요 기능과 활용 방법, 장점과 단점 등을 자세히 살펴보고, 실제 코드 예시와 함께 FAB 확장을 활용하는 방법을 알려드리겠습니다.1. FAB 확장의 주요 기능FAB 확장은 기본 FAB 버튼을 클릭하면 추가적인 버튼들이 펼쳐져 더 많은 기능을 제공하는 기능입니다.이를 통해 화면 공간을 효율적으로 활용하면서도 사용자에게 다양한 옵션을 제공할 수 있습니다.FAB 확장은 다음과 같은 주요 기능을 제공합니다:공간 효율성: 단일 FAB 버튼 대신 여러 버튼을 표시하여 화면 공간을 효율적으로 활용할 수 있습니다.사용자 경험 향상: 다양한 액션 버튼을 제공하여 사용자가 원하는 작업을 빠르고 쉽게 수.. 2024. 7. 17.
플러터에서 CustomButton 만들기: 심화 가이드 및 활용 예시 Flutter에서 버튼은 앱과 사용자 간의 상호작용을 위한 필수적인 요소입니다. 기본적인 버튼 위젯 외에도 원하는 디자인과 기능을 가진 커스텀 버튼을 만들 수 있습니다.이 블로그 포스팅에서는 CustomButton을 만드는 방법, 주요 속성, 활용 예시, 실제 코드 및 팁을 자세히 살펴보겠습니다.1. CustomButton 기본 구조CustomButton은 기본적으로 다음과 같은 구조를 가지고 있습니다:class CustomButton extends StatelessWidget { const CustomButton({ Key? key, required this.onPressed, required this.child, this.backgroundColor = Colors.blue, .. 2024. 7. 17.
플러터에서 FloatingActionButton 사용하기: 가이드 및 활용 예시 FloatingActionButton은 Flutter에서 화면 오른쪽 아래에 표시되는 버튼을 만드는 데 사용되는 유용한 위젯입니다.주요 기능, 속성, 활용 예시 등을 자세히 살펴보고, 실제 개발에 활용할 수 있는 코드와 팁을 제공합니다.1. FloatingActionButton 기본 사용 FloatingActionButton을 사용하려면 먼저 material.dart 라이브러리를 import해야 합니다.import 'package:flutter/material.dart'; FloatingActionButton 위젯은 다음과 같은 기본 구조를 가지고 있습니다.FloatingActionButton( onPressed: () { // 버튼 클릭 시 실행할 코드 }, child: Icon(Icons... 2024. 7. 17.
반응형

티스토리툴바