Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- Stream
- divider
- Snapshot
- globalkey
- enum
- multiprovider
- signout
- Camera
- consumer
- transform
- runTransaction
- controller
- borderRadius
- snackbar
- user
- swift 문법
- 문법
- Swift
- platformexception
- changenotifier
- setstate
- provider
- switch
- ListView.builder
- Navigator
- permission
- changenotifierprovider
- Firebase
- datetime
- reference
Archives
- Today
- Total
코딩하는 제리
[Flutter/Project](Instagram Clone) 갤러리 사진 선택 미리보기 본문
Flutter/Project_InstaClone(완)
[Flutter/Project](Instagram Clone) 갤러리 사진 선택 미리보기
JerryCho 2021. 2. 1. 17:57SharePostScreen으로 새 화면을 띄워 이미지를 보여주기 위해서는
local_image_provider를 통해 만들어진 갤러리 이미지를 File로 변경해야한다.
하지만 다이렉트로 localImage -> File로 변경이 불가능하기에
localImage -> bytes -> File 형식으로 변경한다.
소스코드 및 pubspec.yaml
// widgets/my_gallery.dart
import 'dart:io';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:flutter_project_IJ/models/gallery_state.dart';
import 'package:flutter_project_IJ/screens/share_post_screen.dart';
import 'package:local_image_provider/device_image.dart';
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
import 'package:provider/provider.dart';
class MyGallery extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Consumer<GalleryState>(
builder: (BuildContext context, GalleryState galleryState, Widget child) {
return GridView.count(
crossAxisCount: 3,
children: getImages(context, galleryState),
);
},
);
}
List<Widget> getImages(BuildContext context, GalleryState galleryState) {
return galleryState.images
.map((localImage) => InkWell(
onTap: () async {
// 로컬 이미지를 File 형식으로 바로 변경할 수 없기에
// 로컬 이미지를 byte 이미지로 변경해야함.
Uint8List bytes = await localImage.getScaledImageBytes(
galleryState.localImageProvider, 0.3);
final String timeInMilli =
DateTime.now().millisecondsSinceEpoch.toString();
try {
// 이미지 저장 경로 및 파일이름
// getTemporaryDirectory()).path -> 임시경로(path_provider)
final path = join(
(await getTemporaryDirectory()).path, '$timeInMilli.png');
// .. -> File 생성 후 writeAsBytesSync(bytes) 실행.
// File을 bytes 목록으로 작성 후 imageFile 변수에 저장.
File imageFile = File(path)..writeAsBytesSync(bytes);
// 사진 선택시 미리보기 화면으로 넘어감.
// byte로 변환된 imageFile을 SharePostScreen 클래스로 넘김.
Navigator.push(
context,
MaterialPageRoute(
builder: (_) => SharePostScreen(imageFile)));
} catch (e) {}
},
child: Image(
// 갤러리 이미지 표시.
image: DeviceImage(localImage),
),
))
.toList();
}
}
'Flutter > Project_InstaClone(완)' 카테고리의 다른 글
[Flutter/Project](Instagram Clone) follow 화면 레이아웃 (0) | 2021.02.02 |
---|---|
[Flutter/Project](Instagram Clone) 갤러리 이미지 BoxFit 및 scale 축소 추가 (0) | 2021.02.01 |
[Flutter/Project](Instagram Clone) 카메라 갤러리 가져오기 (0) | 2021.01.31 |
[Flutter/Project](Instagram Clone) 갤러리 상태 파일 (0) | 2021.01.31 |
[Flutter/Project](Instagram Clone) 갤러리 레이아웃 만들기 (0) | 2021.01.31 |
Comments