차근차근 배움터

Flutter는 구글에서 개발한 모바일 앱 개발 프레임워크로, 하나의 코드로 iOS와 Android 모두에서 동작하는 앱을 만들 수 있습니다. 또한, Flutter는 빠른 개발과 높은 생산성을 지원하며, 다양한 UI 및 애니메이션 효과를 제공합니다. 이러한 이유로 Flutter를 배우면 모바일 앱 개발에 있어서 큰 도움이 될 것입니다. [Flutter 강좌] : 인프런에서 제공하는 코딩셰프의 Flutter 강좌입니다. 초보부터 실무까지 넓은 범위의 내용을 다룹니다. 플러터 강의 순한 맛 시즌1 완전 초보자용 구글 플러터(flutter) 순한맛(입문자용) 강좌모음입니다. 플러터는 직관적이고 풍부한 기능을 가지고 있기 때문에 코딩을 시작하려는 입문자에게는 최적의 언어가 될 수 있습니다. www.youtube..

어플 만들기가 자꾸 땡겨서.... 플러터 영상을 열심히 보고 있다 오늘 만든 간단한 닌자 카드인데 floatingActionButton 을 두 개 더 추가해서 감소와 리셋 기능까지 넣었다! flutter 공부하고 싶은 사람들은 아래 유투버에게 받아보세요~! 아마 영국 사람인 것 같아요! import 'package:flutter/material.dart'; void main() { runApp(MaterialApp( home: NinjaCard(), )); } class NinjaCard extends StatefulWidget { @override State createState() => _NinjaCardState(); } class _NinjaCardState extends State { int n..

Flutter에서 ElevatedButton에 색상 좀 넣으려 했더니 마냥 간단하지가 않다 보다시피 Button 위젯 아래 style: ButtonStyle() 로 시작해 그 안에 backgroundColor: 속성을 준 후에 MaterialStateProperty.all(Colors.원하는색상) 이렇게 이어주어야 한다... import 'package:flutter/material.dart'; void main() => runApp(MaterialApp( home: Home(), )); class Home extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title..

플러텅에서 FontFamily를 변경하는 한 가지 방법을 알아본다 1. Google fonts에서 먼저 원하는 폰트 다운로드 Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 2. fonts라는 디렉토리를 생성한 후에 다운 받은 폰트 파일의 압축을 해제한 후에 fonts 하위 폴더에 넣는다 3. pubspec.yaml 파일에서 family에 간단하게 폰트 이름을 적고 (나중에 해당 이름을 적용해야 함) asset: 에는 폰트가 존재하는 파일의 경로를 아래와 같이 작성한다 그리고 아래와 같이 TextStyle( 속성으로 fontFamily: '폰트family설정한이름')을 작성..

상당히 까다로운 부분이다 나 역시 일단 긁어왔는데 다시 보니 decoration 안에 InputDecoration() 을 넣고 그 안에 focusBorder 그리고 OutlineInputBorder안에 borderSide로...속성을 지정하는 것이다. TextField( controller: tec, maxLength: 10, decoration: InputDecoration( focusedBorder: OutlineInputBorder( //

그림자를 설정하려고 한다. 먼저 Container로 감싼 박스에 decoration이라는 속성을 줄 수 있는데 그 안에 BoxDecoration() 을 이용해서 아래와 같이 작성하면 된다. Container 아래 담긴 ... decoration: BoxDecoration( borderRadius: BorderRadius.circular(15), boxShadow: [ BoxShadow( blurRadius: 15, offset: const Offset(10, 10), color: Colors.black.withOpacity(0.3), ) ], ),

플러터에서 컨테이너 박스 너비를 꽉 채우고 싶을 때 width: double.infinity, 위의 것을 활용한다. 아래는 전체 코드 Container( color: Color(0xFF8EB695), width: double.infinity, child: Column( children: [ Text('오늘 날짜'), Text(todayDate), Text('현재시각'), Text(currentTime), ], ), ),

하트 버튼을 클릭해서 좋아하는 웹툰을 저장하는 기능을 마지막으로 담을 것이다. 어떻게 하면 핸드폰 저장소에 데이터를 담을 수 있을까? shared_preferences라는 패키지를 이용하면 된다. shared_preferences | Flutter Package Flutter plugin for reading and writing simple key-value pairs. Wraps NSUserDefaults on iOS and SharedPreferences on Android. pub.dev $ flutter pub add shared_preferences 버튼을 누를 때마다 웹툰의 ID를 가져와보자 일단 새로운 class member를 만들어야 한다. class _DetailScreenState e..

지난 시간 버튼에 outline 주는 challenger가 있었는데, 그림자까지 넣어보았다 detail_screen.dart import 'package:flutter/material.dart'; import 'package:toonflix/models/webtoon_detail_model.dart'; import 'package:toonflix/models/webtoon_episode_model.dart'; import 'package:toonflix/services/api_service.dart'; class DetailScreen extends StatefulWidget { final String title, thumb, id; const DetailScreen({ super.key, require..

WebtoonEpisodeModel 여기에서 아래 코드를 빼먹는 바람에 return episodesInstances; 에러가 생겼었다. 지금은 찾아서 해결 detail_screen.dart에서 stateful위젯으로 변경한 이유는 initState메서드가 필요하기 때문이다. 그래야 getToonById와 getLatestEpisodesById가 필요하기 때문이다. ListView는 목록이 길 때 최적화에 좋게 사용하면 된다. 우리는 10개의 목록만 출력하기 때문에 Column을 이용할 것이다. 만약에 길이를 몰랐다면 ListView를 사용하는 게 맞지만 우리는 10개의 길이를 알기 때문에 Column으로 고. Collection for를 이용하고 있는데 (for문을 보고 있음) List 안에서 List를..