Skip to content

Instantly share code, notes, and snippets.

@koboolean
Created June 11, 2022 06:46
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save koboolean/ce5bfe5a89e1e0ef7c9b3817952e3c36 to your computer and use it in GitHub Desktop.
Save koboolean/ce5bfe5a89e1e0ef7c9b3817952e3c36 to your computer and use it in GitHub Desktop.
flutter bucketlist Provider
import 'package:flutter/material.dart';
import 'main.dart';
/// Bucket 담당
class BucketService extends ChangeNotifier {
List<Bucket> bucketList = [
];
/// bucket 추가
void createBucket(String job) {
bucketList.add(Bucket(job, false));
notifyListeners(); // 갱신 = Consumer<BucketService>의 builder 부분만 새로고침
}
/// bucket 수정
void updateBucket(Bucket bucket, int index) {
bucketList[index] = bucket;
notifyListeners();
}
/// bucket 삭제
void deleteBucket(int index) {
bucketList.removeAt(index);
notifyListeners();
}
}
import 'package:bucketlist_provider/bucket_service.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
void main() {
runApp(
// MyApp의 최상단에 Provider를 이용해 감싼 후 모든 위젯에서 사용할 수 있도록 만들어 준다.
MultiProvider(
providers: [
ChangeNotifierProvider(create: (context) => BucketService()),
],
child: const MyApp(),
),
);
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: HomePage(),
);
}
}
/// 버킷 클래스
class Bucket {
String job; // 할 일
bool isDone; // 완료 여부
Bucket(this.job, this.isDone); // 생성자
}
/// 홈 페이지
class HomePage extends StatelessWidget {
const HomePage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Consumer<BucketService>(
builder: (context, bucketService, child) {
List<Bucket> bucketList = bucketService.bucketList; // bucketService로 부터 bucketList 가져오기
return Scaffold(
appBar: AppBar(
title: Text("버킷 리스트"),
),
body: bucketList.isEmpty
? Center(child: Text("버킷 리스트를 작성해 주세요."))
: ListView.builder(
itemCount: bucketList.length, // bucketList 개수 만큼 보여주기
itemBuilder: (context, index) {
var bucket = bucketList[index]; // index에 해당하는 bucket 가져오기
return ListTile(
// 버킷 리스트 할 일
title: Text(
bucket.job,
style: TextStyle(
fontSize: 24,
color: bucket.isDone ? Colors.grey : Colors.black,
decoration: bucket.isDone
? TextDecoration.lineThrough
: TextDecoration.none,
),
),
// 삭제 아이콘 버튼
trailing: IconButton(
icon: Icon(CupertinoIcons.delete),
onPressed: () {
bucketService.deleteBucket(index);
},
),
onTap: () {
bucket.isDone = !bucket.isDone;
bucketService.updateBucket(bucket, index);
},
);
},
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {
// + 버튼 클릭시 버킷 생성 페이지로 이동
Navigator.push(
context,
MaterialPageRoute(builder: (_) => CreatePage()),
);
},
),
);
}
);
}
}
/// 버킷 생성 페이지
class CreatePage extends StatefulWidget {
const CreatePage({Key? key}) : super(key: key);
@override
State<CreatePage> createState() => _CreatePageState();
}
class _CreatePageState extends State<CreatePage> {
// TextField의 값을 가져올 때 사용합니다.
TextEditingController textController = TextEditingController();
// 경고 메세지
String? error;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("버킷리스트 작성"),
// 뒤로가기 버튼
leading: IconButton(
icon: Icon(CupertinoIcons.chevron_back),
onPressed: () {
Navigator.pop(context);
},
),
),
body: Padding(
padding: const EdgeInsets.all(16),
child: Column(
children: [
// 텍스트 입력창
TextField(
controller: textController,
autofocus: true,
decoration: InputDecoration(
hintText: "하고 싶은 일을 입력하세요",
errorText: error,
),
),
SizedBox(height: 32),
// 추가하기 버튼
SizedBox(
width: double.infinity,
height: 48,
child: ElevatedButton(
child: Text(
"추가하기",
style: TextStyle(
fontSize: 18,
),
),
onPressed: () {
// 추가하기 버튼 클릭시
String job = textController.text;
if (job.isEmpty) {
setState(() {
error = "내용을 입력해주세요."; // 내용이 없는 경우 에러 메세지
});
} else {
setState(() {
error = null; // 내용이 있는 경우 에러 메세지 숨기기
});
// BucketService 가져오기
BucketService bucketService = context.read<BucketService>();
bucketService.createBucket(job);
Navigator.pop(context); // 화면을 종료합니다.
}
},
),
),
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment