일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 연습문제
- Flutter
- rails7
- springboot
- 건담베이스
- html
- javascript
- 자바
- 디지몬
- Web
- 日本語
- vscode
- 単語
- 반다이몰
- 一日一つメソッド
- C로 시작하는 컴퓨터 프로그래밍4판
- 일본어
- CSS
- java
- メソッド
- Spring
- nico
- 건담
- 비즈니스일본어
- rails
- jsp
- Python
- 인프런
- ruby
- DART
- Today
- Total
목록Dart/Flutter (25)
AR삽질러
Flutter 기초 - Theme (25) 1. Theme - 테마를 사용해 App전체에 일관된 시각적 스타일을 적용하여 사용자경험 UX를 향상시킬 수 있다. 2. ThemeData - MaterialApp의 theme속성에서 제공되고 앱 전체에서 공통 스타일을 적용한다.void main(){ MaterialApp( theme: ThemeData( primary: Colors.indigo, secondary: Colors.green, teriary: Colors.yellow ), );} primaryColor앱의 기본색상으로 툴바, 탭바 등accentColor버튼, 액션 버튼, 체크박스 등 사용자와 상호작용하는 요소에서 사용되는 색상brightness앱의 전체적인..
Flutter 기초 - 페이지이동2 (24) 1. 페이지 이동 및 네비게이션 - Navigator Widget을 사용해 Navigator 앱 내에서 페이지 간의 이동을 관리한다.Navigator.push새로운 화면을 현재의 네비게이션 스택에 푸쉬한다.Navigator.pop스택의 가장 위에 있는 라우트를 제거하여 이전 페이지로 돌아간다. 2. MaterialPageRoute - 디자인의 페이지 전환 애니메이션을 제공하는 라우트로 페이지 이동 시 표준적인 머티어리얼 디자인 애니메이션을 제공한다. 3. 새로운 페이지로 이동Navigator.push( context, MaterialPageRoute(builder: (context) => const NewPage()),); 4. 이전 페이지로 이동 Nav..
Flutter 기초 - Callback (22) 1. Callback - 함수나 메서드를 다른 함수나 메서드의 인자로 전달하는 기법으로 특정 이벤트나 조건이 만족되었을때 지정한 코드를 실행할 수 있다. 2. Gesture - 사용자의 터치입력으로 GestureDetector 위젯을 사용해 탭, 더블탭, 드래그, 핀치 등의 이벤트를 처리할 수 있다. import 'package:flutter/cupertino.dart';import 'package:flutter/material.dart';void main() { runApp(const MaterialApp(home: HomeWidget()));}class HomeWidget extends StatelessWidget { const HomeWidge..
Flutter 기초 - 페이지이동1 (23) class _HomeWidgetState extends State { late int index; @override void initState() { super.initState(); index = 0; } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: const Text('App Bar'), ), body: homeBody(), bottomNavigationBar: BottomNavigationBar( items: const [ BottomNa..
Flutter 기초 - PopupMenu (21) 1. PopupMenu - itemBuilder속성을 통해서 메뉴 항목을 생성한다. 각 메뉴 항목에서 PopupMenuItem Widget을 사용해 정의하고 onSelected콜백에서 처리된다. class TestPopupMenu extends StatefulWidget { const TestPopupMenu({super.key}); @override State createState() => _TestPopupMenuState();}class _TestPopupMenuState extends State { TestRadioValue selectValue = TestRadioValue.test1; @override Widget build(B..
Flutter 기초 - Switch (20) 1. Switch - 사용자가 토클할 수 있는 스위치 컨트롤러를 제공해 설정을 키고 끄는 상태를 전활할때 사용도니다. 2. Switch Widget 기본 사용법value스위치의 현재 상태를 나타낸다.(true, false)onChanged스위치의 값이 변경될 때 호출되는 콜백 함수로 스위치를 토글할 때마다 함수에 새로운 상태가 전달된다. class TestSwitch extends StatefulWidget { const TestSwitch({super.key}); @override State createState() => _TestSwitchState();}class _TestSwitchState extends State { bool value..
Flutter 기초 - Slider (19) 1. Slider - Slider Widget은 사용자에게 시각적인 피드백을 제공하면서 값의 범위를 조정할 수 있는 인터페이스를 제공한다. value현재의 슬라이더 값으로 min, max의 사이어야 한다.onChanged슬라이더를 움직일때 호출되는 콜백함수로 조작시 현재 슬라이더 값이 전달된다.min, max슬라이더의 최소값, 최대값divisions사용자가 선택할 수 있는 값의 수로 값을 설정하므로써 눈금표시와 특정 눈금에 위치시킬 수 있다.label사용자가 슬라이더를 조작할 때 보여줄 수 있는 텍스트 레이블로 현재 값을 표시하는데 사용된다. class TestSlider extends StatefulWidget { const TestSlider({su..
Flutter 기초 - RadioButton (18) 1. Radio버튼 - 사용자에게 옵션들중 하나만 선택할 수 있게하는 위젯으로 라디오 버튼은 서로 연관된 그룹안에서 단 하나의 항목만을 선택할 수 있도록 제한하기 때문에 설정 혹은 조정 에서 여러 옵션중 하나를 선택해야할때 유용하게 사용할 수 있다. 2. Radio버튼 기본구조value라디오 버튼의 고유한 값으로 열거형(enum)을 사용해 각 옵션을 명시한다.groupValue현재 그룹에서 선택된 값을 나타내며 value값과 같을 경우 해당 라디오 버튼이 선택된 것으로 표시된다.onChanged라디오 버튼의 값이 변경될때 실행할 콜백함수로 사용자가 라디오 버튼중 하나를 탭할 때 마다 호출된다. 3. RadioButton동작방식oValue { tes..
Flutter 기초 - CheckBox (17) 1. Checkbox - 사용자가 설정을 켜거나 끄는 요소로 Boolean (false | true) 로 변경하고 UI에 나타낼 수 있다. 2. CheckBox사용방법 value - 체크박스의 현재 상태를 나타내며 true, false, null 이 될수 있다. - null은 체크박스가 선택 가능한 상태를 표시하지만 아직 선택되지 않았을때에는 null로 입력도니다. onChanged - 체크박스의 값이 변경될때 호출되는 콜백함수로 사용자가 체크박스를 탭했을 경우 함수가 호출되고 체크박스의 새로운 상태가 매개변수로 전달된다. import 'package:flutter/material.dart';import 'dart:math';void main()..
Flutter 기초 - State Basic (16) StatelessWidget상태가 없는 위젯으로 생성될 때 한번 설정되고 데이터에 따라 동적으로 변하지 않는 의미로 StateWidget은 입력 데이터나 내부 상태의 변화 없이 동일한 정보를 표시할 때 사용한다. - 초기화시 입력된 파라미터를 기반으로 UI를 렌더링 한다. - 위젯의 속성이 변경되지 않는다.(불변성을 가진다) - 애니메이션, 데이터 변경에 반응해 상태를 변경할 필요가 없는 경우 적합하다. StatefullWidget 동적인 상태를 가질 수 있는 위젯으로 데이터의 변경에 따라 내부 상태가 변할 수 있고 변화된 상태에 따라 UI가 업데이트된다. StatefulWidget은 State객체를 생성하고 상태를 관리해 setState()메소..