웹이나 앱이나 언제나 등장하는 것이 팝업창이다. 팝업창을 (Dialog라고 한다) 예를 들면 에러를 표시할 때나, 아니면 [뭐뭐뭐 하시겠습니까?]와 같이 물어볼 때 Dialog를 띄운다 Flutter에서도 한번 Dialog를 표시해보자 1. 기본 코드 main.dart import 'package:flutter/material.dart'; import 'package:flutter_practice/pages/practice_page.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); // This widget is the root ..
css에서는 position: absolute를 사용해서 이미지 위에 덮어씌우는 느낌 (겹치기)으로 이미지의 위에 문자를 표시하거나 할 수 있다. 그런 기능을 Flutter에서는 Positioned라는 것을 사용하면 된다 위젯 위에 위젯을 올라와 있고 그 위치를 마음대로 조정하는 게 가능하다는 말이다 이제 시작해 보도록 할까 1. 기본 코드 main.dart import 'package:flutter/material.dart'; import 'package:flutter_practice/pages/practice_page.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? k..
이번에는 TextoFormFiled를 사용해 보겠다 TextoFormFiled를 사용하면 스타일과 입력체크등을 설정할 수 있다 1. 기본코드 main.dart import 'package:flutter/material.dart'; import 'package:flutter_practice/pages/practice_page.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); // This widget is the root of your application. @override Widget build(BuildContext conte..
Flutter에서 Svg를 사용하는 법을 해보겠다 1. Package 사용하기 우선 플러터 아래의 링크로 간다 https://pub.dev/ Dart packages Pub is the package manager for the Dart programming language, containing reusable libraries & packages for Flutter and general Dart programs. pub.dev 그리고 검색창에 flutter_svg를 검색한다 flutter_svg를 클릭한다 복사버튼을 클릭하도록 한다 2. pubspec.yaml에 붙여 넣기 pubspec.yaml 파일에 붙여 넣는다 위치는 dependencies > flutter > 안에다가 붙여 넣는다 ※ ^2.0...
이번에는 이미지를 나열해 보겠다 이때는 GridView라는 것을 사용해 보도록 한다 1. 기본 코드 main.dart import 'package:flutter/material.dart'; import 'package:flutter_practice/pages/practice_page.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialAp..
저번시간 TabBar에 이어서 이번에는 TabBarView와 Expanded을 사용해 볼 것이다 저번 시간 코드는 아래의 링크를 참조한다 https://initstory.tistory.com/118 1. practice_page.dart 코드 수정 practice_page.dart import 'package:flutter/material.dart'; import 'package:flutter_practice/components/practice_tabbar.dart'; class PracticePage extends StatelessWidget { const PracticePage({Key? key}) : super(key: key); @override Widget build(BuildContext co..
