[Flutter/Project](Instagram Clone) Provider를 이용한 카메라 상태관리3

---

widgets/take_photo.dart

(좌)provider 적용 전, (우) provider 적용 후.

(좌)provider 적용 전, (우) provider 적용 후.

 

---

소스코드 및 pubspec.yaml

// take_photo.dart

import 'package:camera/camera.dart';
import 'package:flutter/material.dart';
import 'package:flutter_project_IJ/constants/screen_size.dart';
import 'package:flutter_project_IJ/models/camera_state.dart';
import 'package:flutter_project_IJ/widgets/my_progress_indicator.dart';
import 'package:provider/provider.dart';

class TakePhoto extends StatefulWidget {
  const TakePhoto({
    Key key,
  }) : super(key: key);

  @override
  _TakePhotoState createState() => _TakePhotoState();
}

class _TakePhotoState extends State<TakePhoto> {
  Widget _progress = MyProgressIndicator();

  @override
  Widget build(BuildContext context) {
    return Consumer(
      builder: (BuildContext context, CameraState cameraState, Widget child) {
        return Column(
          children: [
            Container(
              color: Colors.black,
              height: size.height / 3 * 2,
              width: size.width,
              child: (cameraState.isReadyToTakePhoto)
                  ? _getPreview(cameraState)
                  : _progress,
            ),
            Expanded(
              child: OutlineButton(
                onPressed: () {},
                shape: CircleBorder(),
                borderSide: BorderSide(
                  color: Colors.black12,
                  width: 20,
                ),
              ),
            )
          ],
        );
      },
    );
  }

  Widget _getPreview(CameraState cameraState) {
    return ClipRect(
      // OverflowBox로 넘어간 부분을 제거.
      child: OverflowBox(
        // BoxFit으로 맞춘 나머지 부분을 밖으로 넘어가게 함.
        alignment: Alignment.center,
        child: FittedBox(
          // 가로사이즈에 맞춤.
          fit: BoxFit.fitWidth,
          child: Container(
            width: size.width,
            child: CameraPreview(cameraState.controller),
          ),
        ),
      ),
    );
  }
}